Skip to content

Commit

Permalink
Merge pull request #3 from giuliohome-org/main
Browse files Browse the repository at this point in the history
AzureChatGPT Mobile View
  • Loading branch information
oliverlabs authored Sep 4, 2023
2 parents 9116afe + d6b9219 commit c664e5a
Show file tree
Hide file tree
Showing 4 changed files with 73 additions and 22 deletions.
16 changes: 16 additions & 0 deletions src/app/chat/context.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,16 @@
'use client'

import { useState } from 'react';

import { ChatMenu } from "@/features/chat/chat-menu/chat-menu";
import { MainMenu } from "@/features/menu/menu";

export const Context = () => {
const [isOpen, setIsOpen] = useState(false);
return (
<>
<MainMenu isOpen={isOpen} setIsOpen={setIsOpen} />
<ChatMenu isOpen={isOpen} setIsOpen={setIsOpen} />
</>
)
}
7 changes: 4 additions & 3 deletions src/app/chat/layout.tsx
Original file line number Diff line number Diff line change
@@ -1,22 +1,23 @@
import { ProtectedPage } from "@/features/auth/protected-page";
import { ChatMenu } from "@/features/chat/chat-menu/chat-menu";
import { MainMenu } from "@/features/menu/menu";
import { Context } from "./context";
import { AI_NAME } from "@/features/theme/customise";

export const metadata = {
title: AI_NAME,
description: AI_NAME,
};

export default async function RootLayout({
export default function RootLayout({
children,
}: {
children: React.ReactNode;
}) {

return (
<ProtectedPage>
<MainMenu />
<ChatMenu />
<Context/>
<div className="flex-1">{children}</div>
</ProtectedPage>
);
Expand Down
59 changes: 44 additions & 15 deletions src/features/chat/chat-menu/chat-menu.tsx
Original file line number Diff line number Diff line change
@@ -1,25 +1,54 @@
'use client'

import { useState, useEffect } from 'react';
import { Menu, MenuContent, MenuFooter, MenuHeader } from "@/components/menu";
import { FindAllChatThreadForCurrentUser } from "@/features/chat/chat-services/chat-thread-service";
import { ThemeToggle } from "@/features/theme/theme-toggle";
import { MenuItems } from "./menu-items";
import { NewChat } from "./new-chat";
import { ChatThreadModel } from '../chat-services/models';
import { Button } from '@/components/ui/button';

interface Prop {
isOpen: boolean;
setIsOpen: Function;
}

export const ChatMenu = (prop:Prop) => {
const [items, setItems] = useState<ChatThreadModel[]>([]);

// Fetch data when the component mounts
useEffect(() => {
const fetchData = async () => {
const data = await FindAllChatThreadForCurrentUser();
setItems(data);
};

export const ChatMenu = async () => {
const items = await FindAllChatThreadForCurrentUser();
fetchData();
}, []);

return (
<Menu>
<MenuHeader className="justify-end">
<NewChat />
</MenuHeader>
<MenuContent>
<MenuItems menuItems={items} />
</MenuContent>
<MenuFooter>
<div className="flex flex-col gap-3">
<ThemeToggle />
</div>
</MenuFooter>
</Menu>
<div>
<Button size={"icon"} onClick={() => prop.setIsOpen(!prop.isOpen)} >
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" width="12" height="12" stroke="currentColor">
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M4 6h16M4 12h16M4 18h16" />
</svg>
</Button>
{prop.isOpen ?
<Menu>
<MenuHeader className="justify-end">
<NewChat />
</MenuHeader>
<MenuContent>
<MenuItems menuItems={items} />
</MenuContent>
<MenuFooter>
<div className="flex flex-col gap-3">
<ThemeToggle />
</div>
</MenuFooter>
</Menu>
: ''}
</div>
);
};
13 changes: 9 additions & 4 deletions src/features/menu/menu.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -3,10 +3,15 @@ import { BarChartHorizontalBig } from "lucide-react";
import Link from "next/link";
import { UserProfile } from "../user-profile";

export const MainMenu = () => {
interface Prop {
isOpen: boolean;
setIsOpen: Function;
}

export const MainMenu = (prop: Prop) => {
return (
<div className="flex gap-2 flex-col justify-between">
<div className="flex gap-2 flex-col justify-between">
{prop.isOpen ? <div className="flex gap-2 flex-col justify-between">
<Link
href="/"
className="w-10 h-10 items-center justify-center flex"
Expand All @@ -23,8 +28,8 @@ export const MainMenu = () => {
>
<BarChartHorizontalBig size={20} />
</Link>
</div>
<UserProfile />
</div> : ''}
{prop.isOpen ? <UserProfile /> : ''}
</div>
);
};

0 comments on commit c664e5a

Please sign in to comment.