revert social media link

This commit is contained in:
Faisal Amir 2024-01-04 11:45:23 +07:00
parent 214739e143
commit c81f301b6c
2 changed files with 50 additions and 39 deletions

View File

@ -1,15 +1,20 @@
import { ReactNode, useState } from 'react' import { ReactNode, useState } from 'react'
import { useAtomValue } from 'jotai'
import { import {
ChevronDownIcon, ChevronDownIcon,
MoreVerticalIcon, MoreVerticalIcon,
FolderOpenIcon, FolderOpenIcon,
Code2Icon, Code2Icon,
PencilIcon,
} from 'lucide-react' } from 'lucide-react'
import { twMerge } from 'tailwind-merge' import { twMerge } from 'tailwind-merge'
import { useActiveModel } from '@/hooks/useActiveModel'
import { useClickOutside } from '@/hooks/useClickOutside' import { useClickOutside } from '@/hooks/useClickOutside'
import { activeThreadAtom } from '@/helpers/atoms/Thread.atom'
interface Props { interface Props {
children: ReactNode children: ReactNode
title: string title: string
@ -28,6 +33,8 @@ export default function CardSidebar({
const [more, setMore] = useState(false) const [more, setMore] = useState(false)
const [menu, setMenu] = useState<HTMLDivElement | null>(null) const [menu, setMenu] = useState<HTMLDivElement | null>(null)
const [toggle, setToggle] = useState<HTMLDivElement | null>(null) const [toggle, setToggle] = useState<HTMLDivElement | null>(null)
const { activeModel } = useActiveModel()
const activeThread = useAtomValue(activeThreadAtom)
useClickOutside(() => setMore(false), null, [menu, toggle]) useClickOutside(() => setMore(false), null, [menu, toggle])
@ -77,7 +84,7 @@ export default function CardSidebar({
{more && ( {more && (
<div <div
className="absolute right-4 top-8 z-20 w-64 rounded-lg border border-border bg-background shadow-lg" className="absolute right-4 top-8 z-20 w-72 rounded-lg border border-border bg-background shadow-lg"
ref={setMenu} ref={setMenu}
> >
<div <div
@ -101,7 +108,7 @@ export default function CardSidebar({
{title === 'Model' ? ( {title === 'Model' ? (
<div className="flex flex-col"> <div className="flex flex-col">
<span className="font-medium text-black dark:text-muted-foreground"> <span className="font-medium text-black dark:text-muted-foreground">
{openFolderTitle} Show in Finder
</span> </span>
<span className="mt-1 text-muted-foreground"> <span className="mt-1 text-muted-foreground">
Opens thread.json. Changes affect this thread only. Opens thread.json. Changes affect this thread only.
@ -109,7 +116,7 @@ export default function CardSidebar({
</div> </div>
) : ( ) : (
<span className="text-bold text-black dark:text-muted-foreground"> <span className="text-bold text-black dark:text-muted-foreground">
{openFolderTitle} Show in Finder
</span> </span>
)} )}
</> </>
@ -121,18 +128,33 @@ export default function CardSidebar({
setMore(false) setMore(false)
}} }}
> >
<Code2Icon <PencilIcon
size={16} size={16}
className="mt-0.5 flex-shrink-0 text-muted-foreground" className="mt-0.5 flex-shrink-0 text-muted-foreground"
/> />
<> <>
<div className="flex flex-col"> <div className="flex flex-col">
<span className="font-medium text-black dark:text-muted-foreground"> <span className="line-clamp-1 font-medium text-black dark:text-muted-foreground">
View as JSON Edit Global Defaults for{' '}
<span
className="font-bold"
title={activeThread?.assistants[0].model.id}
>
{activeThread?.assistants[0].model.id}
</span>
</span> </span>
<span className="mt-1 text-muted-foreground"> <span className="mt-1 text-muted-foreground">
Opens <span className="lowercase">{title}.json.</span>&nbsp; {title === 'Model' ? (
Changes affect all new threads. <>
Opens <span className="lowercase">{title}.json.</span>
&nbsp;Changes affect all new assistants and threads.
</>
) : (
<>
Opens <span className="lowercase">{title}.json.</span>
&nbsp;Changes affect all new threads.
</>
)}
</span> </span>
</div> </div>
</> </>

View File

@ -1,18 +1,8 @@
import { useState } from 'react'
import { import {
Tooltip, Tooltip,
TooltipContent, TooltipContent,
TooltipTrigger, TooltipTrigger,
TooltipArrow, TooltipArrow,
Modal,
ModalTitle,
ModalContent,
ModalHeader,
ModalFooter,
ModalDescription,
ModalClose,
Button,
} from '@janhq/uikit' } from '@janhq/uikit'
import { motion as m } from 'framer-motion' import { motion as m } from 'framer-motion'
@ -21,8 +11,8 @@ import {
SettingsIcon, SettingsIcon,
MonitorIcon, MonitorIcon,
LayoutGridIcon, LayoutGridIcon,
// Twitter, Twitter,
// Github, Github,
} from 'lucide-react' } from 'lucide-react'
import { twMerge } from 'tailwind-merge' import { twMerge } from 'tailwind-merge'
@ -64,22 +54,22 @@ export default function RibbonNav() {
}, },
] ]
// const linksMenu = [ const linksMenu = [
// { {
// name: 'Twitter', name: 'Twitter',
// icon: ( icon: (
// <Twitter size={20} className="flex-shrink-0 text-muted-foreground" /> <Twitter size={20} className="flex-shrink-0 text-muted-foreground" />
// ), ),
// link: 'https://twitter.com/janhq_', link: 'https://twitter.com/janhq_',
// }, },
// { {
// name: 'Github', name: 'Github',
// icon: ( icon: (
// <Github size={20} className="flex-shrink-0 text-muted-foreground" /> <Github size={20} className="flex-shrink-0 text-muted-foreground" />
// ), ),
// link: 'https://github.com/janhq/jan', link: 'https://github.com/janhq/jan',
// }, },
// ] ]
const secondaryMenus = [ const secondaryMenus = [
{ {
@ -148,8 +138,7 @@ export default function RibbonNav() {
</div> </div>
<div> <div>
{/* Temporary hidden social media until we finalize design */} <>
{/* <>
{linksMenu {linksMenu
.filter((link) => !!link) .filter((link) => !!link)
.map((link, i) => { .map((link, i) => {
@ -174,7 +163,7 @@ export default function RibbonNav() {
</div> </div>
) )
})} })}
</> */} </>
{secondaryMenus {secondaryMenus
.filter((secondary) => !!secondary) .filter((secondary) => !!secondary)