diff --git a/src/app/(gistLayout)/layout-ui.tsx b/src/app/(gistLayout)/layout-ui.tsx index 9e77e4f..931e1a7 100644 --- a/src/app/(gistLayout)/layout-ui.tsx +++ b/src/app/(gistLayout)/layout-ui.tsx @@ -1,115 +1,174 @@ -import { OrgListFeature } from '@/components/logic/org-list-logic' -import { Avatar, AvatarFallback, AvatarImage } from '@/components/shadcn/avatar' -import { Button } from '@/components/shadcn/button' -import { Codearea } from '@/components/shadcn/codearea' -import { Input } from '@/components/shadcn/input' -import MenuButton from '@/components/ui/menu-button' -import { Modal } from '@/components/ui/modal' -import { ProfileDropdown } from '@/components/ui/profile-dropdown' -import Shortcut from '@/components/ui/shortcut' -import TooltipShortcut, { TooltipShortcutTrigger } from '@/components/ui/tooltip-shortcut' -import { getLanguage } from '@/lib/language' -import { FileCodeIcon, LucidePencil, Menu, PlusIcon } from 'lucide-react' -import { useState } from 'react' +import { OrgListFeature } from "@/components/logic/org-list-logic"; +import { + Avatar, + AvatarFallback, + AvatarImage, +} from "@/components/shadcn/avatar"; +import { Button } from "@/components/shadcn/button"; +import { Codearea } from "@/components/shadcn/codearea"; +import { Input } from "@/components/shadcn/input"; +import MenuButton from "@/components/ui/menu-button"; +import { Modal } from "@/components/ui/modal"; +import { ProfileDropdown } from "@/components/ui/profile-dropdown"; +import Shortcut from "@/components/ui/shortcut"; +import TooltipShortcut, { + TooltipShortcutTrigger, +} from "@/components/ui/tooltip-shortcut"; +import { getLanguage } from "@/lib/language"; +import { FileCodeIcon, LucidePencil, Menu, PlusIcon } from "lucide-react"; +import { useState } from "react"; interface GistLayoutProps { - username: string - avatar: string - children: React.ReactNode - onMyGists: () => void - onCreateOrg: (name: string) => void - onCreateGist: (name: string, content: string) => void - onLogout: () => void + username: string; + avatar: string; + children: React.ReactNode; + onMyGists: () => void; + onCreateOrg: (name: string) => void; + onCreateGist: (name: string, content: string) => void; + onLogout: () => void; } -export default function GistLayout({ avatar, children, username, onMyGists, onCreateOrg, onCreateGist, onLogout }: GistLayoutProps) { - const [gistName, setGistName] = useState('') - const [gistContent, setGistContent] = useState('') - const [orgName, setOrgName] = useState('') - const [isOrgModalOpen, setIsOrgModalOpen] = useState(false) +export default function GistLayout({ + avatar, + children, + username, + onMyGists, + onCreateOrg, + onCreateGist, + onLogout, +}: GistLayoutProps) { + const [gistName, setGistName] = useState(""); + const [gistContent, setGistContent] = useState(""); + const [orgName, setOrgName] = useState(""); + const [isOrgModalOpen, setIsOrgModalOpen] = useState(false); - const language = getLanguage(gistName) + const language = getLanguage(gistName); const handleCreateGistClick = () => { - onCreateGist(gistName, gistContent) - setGistName('') - setGistContent('') - } + onCreateGist(gistName, gistContent); + setGistName(""); + setGistContent(""); + }; return ( -
-
-
-
- - - {username.charAt(0).toUpperCase()} - - -
+
+
+
+
+
+ + + + {username.charAt(0).toUpperCase()} + + + +
- - - - - - -
- } - content={ -
- setGistName(e.target.value)} /> - setGistContent(e.target.value)} /> -
- } - footer={ - - Create - - } - > -
-
- } variant="menu" size="menu" letter="M" onClick={onMyGists} href="/mygist" className="w-full"> - My Gists - - } variant="menu" size="menu" letter="T" className="w-full"> - Create org - - } - title="Create Org" - content={ -
- setOrgName(e.target.value)} /> -
- } - footer={ - { - onCreateOrg(orgName) - setOrgName('') - setIsOrgModalOpen(false) - }} - > - Create - - } - /> + + + + + + +
+ } + content={ +
+ setGistName(e.target.value)} + /> + setGistContent(e.target.value)} + /> +
+ } + footer={ + + Create + + } + > +
+
+ } + variant="menu" + size="menu" + letter="M" + onClick={onMyGists} + href="/mygist" + className="w-full" + > + My Gists + + } + variant="menu" + size="menu" + letter="T" + className="w-full" + > + Create org + + } + title="Create Org" + content={ +
+ setOrgName(e.target.value)} + /> +
+ } + footer={ + { + onCreateOrg(orgName); + setOrgName(""); + setIsOrgModalOpen(false); + }} + > + Create + + } + /> +
+
-
{children}
- ) + ); }