AI/dify
1
0
Fork 0
mirror of https://git.mirrors.martin98.com/https://github.com/langgenius/dify.git synced 2025-08-13 20:56:00 +08:00
Code Issues Packages Projects Releases Wiki Activity

feat: add a minimal separator between pinned apps and unpinned apps in the explore page (#10871)

Browse Source
This commit is contained in:
kurokobo 2024-11-20 10:32:59 +09:00 committed by GitHub
parent 3087913b74
commit 07b5bbae06
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
1 changed files with 7 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
web/app/components/explore/sidebar/index.tsx
View File

@ -11,6 +11,7 @@ import cn from '@/utils/classnames'
import { fetchInstalledAppList as doFetchInstalledAppList, uninstallApp, updatePinStatus } from '@/service/explore' import { fetchInstalledAppList as doFetchInstalledAppList, uninstallApp, updatePinStatus } from '@/service/explore'
import ExploreContext from '@/context/explore-context' import ExploreContext from '@/context/explore-context'
import Confirm from '@/app/components/base/confirm' import Confirm from '@/app/components/base/confirm'
import Divider from '@/app/components/base/divider'
import useBreakpoints, { MediaType } from '@/hooks/use-breakpoints' import useBreakpoints, { MediaType } from '@/hooks/use-breakpoints'
const SelectedDiscoveryIcon = () => ( const SelectedDiscoveryIcon = () => (
@ -89,6 +90,7 @@ const SideBar: FC<IExploreSideBarProps> = ({
fetchInstalledAppList() fetchInstalledAppList()
}, [controlUpdateInstalledApps]) }, [controlUpdateInstalledApps])
const pinnedAppsCount = installedApps.filter(({ is_pinned }) => is_pinned).length
return ( return (
<div className='w-fit sm:w-[216px] shrink-0 pt-6 px-4 border-gray-200 cursor-pointer'> <div className='w-fit sm:w-[216px] shrink-0 pt-6 px-4 border-gray-200 cursor-pointer'>
<div> <div>
@ -109,10 +111,9 @@ const SideBar: FC<IExploreSideBarProps> = ({
height: 'calc(100vh - 250px)', height: 'calc(100vh - 250px)',
}} }}
> >
{installedApps.map(({ id, is_pinned, uninstallable, app: { name, icon_type, icon, icon_url, icon_background } }) => { {installedApps.map(({ id, is_pinned, uninstallable, app: { name, icon_type, icon, icon_url, icon_background } }, index) => (
return ( <React.Fragment key={id}>
<Item <Item
key={id}
isMobile={isMobile} isMobile={isMobile}
name={name} name={name}
icon_type={icon_type} icon_type={icon_type}
@ -129,8 +130,9 @@ const SideBar: FC<IExploreSideBarProps> = ({
setShowConfirm(true) setShowConfirm(true)
}} }}
/> />
) {index === pinnedAppsCount - 1 && index !== installedApps.length - 1 && <Divider />}
})} </React.Fragment>
))}
</div> </div>
</div> </div>
)} )}