mirror of https://github.com/langgenius/dify.git
chore: handle app title installed
This commit is contained in:
金伟强
parent
1d1acacb81
commit
e21cdff88c
|
|
@ -17,7 +17,7 @@ import { useDatasetsContext } from '@/context/datasets-context'
|
|||
|
||||
const BuildAppsIcon = ({isSelected}: {isSelected: boolean}) => (
|
||||
<svg className='mr-1' width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M13.6666 4.85221L7.99998 8.00036M7.99998 8.00036L2.33331 4.85221M7.99998 8.00036L8 14.3337M14 10.7061V5.29468C14 5.06625 14 4.95204 13.9663 4.85017C13.9366 4.76005 13.8879 4.67733 13.8236 4.60754C13.7509 4.52865 13.651 4.47318 13.4514 4.36224L8.51802 1.6215C8.32895 1.51646 8.23442 1.46395 8.1343 1.44336C8.0457 1.42513 7.95431 1.42513 7.8657 1.44336C7.76559 1.46395 7.67105 1.51646 7.48198 1.6215L2.54865 4.36225C2.34896 4.47318 2.24912 4.52865 2.17642 4.60754C2.11211 4.67733 2.06343 4.76005 2.03366 4.85017C2 4.95204 2 5.06625 2 5.29468V10.7061C2 10.9345 2 11.0487 2.03366 11.1506C2.06343 11.2407 2.11211 11.3234 2.17642 11.3932C2.24912 11.4721 2.34897 11.5276 2.54865 11.6385L7.48198 14.3793C7.67105 14.4843 7.76559 14.5368 7.8657 14.5574C7.95431 14.5756 8.0457 14.5756 8.1343 14.5574C8.23442 14.5368 8.32895 14.4843 8.51802 14.3793L13.4514 11.6385C13.651 11.5276 13.7509 11.4721 13.8236 11.3932C13.8879 11.3234 13.9366 11.2407 13.9663 11.1506C14 11.0487 14 10.9345 14 10.7061Z" stroke={isSelected ? '#155EEF': '#667085'} stroke-width="1.25" strokeLinecap="round" strokeLinejoin="round"/>
|
||||
<path d="M13.6666 4.85221L7.99998 8.00036M7.99998 8.00036L2.33331 4.85221M7.99998 8.00036L8 14.3337M14 10.7061V5.29468C14 5.06625 14 4.95204 13.9663 4.85017C13.9366 4.76005 13.8879 4.67733 13.8236 4.60754C13.7509 4.52865 13.651 4.47318 13.4514 4.36224L8.51802 1.6215C8.32895 1.51646 8.23442 1.46395 8.1343 1.44336C8.0457 1.42513 7.95431 1.42513 7.8657 1.44336C7.76559 1.46395 7.67105 1.51646 7.48198 1.6215L2.54865 4.36225C2.34896 4.47318 2.24912 4.52865 2.17642 4.60754C2.11211 4.67733 2.06343 4.76005 2.03366 4.85017C2 4.95204 2 5.06625 2 5.29468V10.7061C2 10.9345 2 11.0487 2.03366 11.1506C2.06343 11.2407 2.11211 11.3234 2.17642 11.3932C2.24912 11.4721 2.34897 11.5276 2.54865 11.6385L7.48198 14.3793C7.67105 14.4843 7.76559 14.5368 7.8657 14.5574C7.95431 14.5756 8.0457 14.5756 8.1343 14.5574C8.23442 14.5368 8.32895 14.4843 8.51802 14.3793L13.4514 11.6385C13.651 11.5276 13.7509 11.4721 13.8236 11.3932C13.8879 11.3234 13.9366 11.2407 13.9663 11.1506C14 11.0487 14 10.9345 14 10.7061Z" stroke={isSelected ? '#155EEF': '#667085'} strokeWidth="1.25" strokeLinecap="round" strokeLinejoin="round"/>
|
||||
</svg>
|
||||
)
|
||||
|
||||
|
|
|
|||
|
|
@ -444,6 +444,7 @@ const Main: FC<IMainProps> = ({
|
|||
currentId={currConversationId}
|
||||
copyRight={siteInfo.copyright || siteInfo.title}
|
||||
isInstalledApp={isInstalledApp}
|
||||
siteInfo={siteInfo}
|
||||
/>
|
||||
)
|
||||
}
|
||||
|
|
@ -456,14 +457,17 @@ const Main: FC<IMainProps> = ({
|
|||
|
||||
return (
|
||||
<div className='bg-gray-100'>
|
||||
<Header
|
||||
title={siteInfo.title}
|
||||
icon={siteInfo.icon || ''}
|
||||
icon_background={siteInfo.icon_background || '#FFEAD5'}
|
||||
isMobile={isMobile}
|
||||
onShowSideBar={showSidebar}
|
||||
onCreateNewChat={() => handleConversationIdChange('-1')}
|
||||
/>
|
||||
{!isInstalledApp && (
|
||||
<Header
|
||||
title={siteInfo.title}
|
||||
icon={siteInfo.icon || ''}
|
||||
icon_background={siteInfo.icon_background}
|
||||
isMobile={isMobile}
|
||||
onShowSideBar={showSidebar}
|
||||
onCreateNewChat={() => handleConversationIdChange('-1')}
|
||||
/>
|
||||
)}
|
||||
|
||||
{/* {isNewConversation ? 'new' : 'exist'}
|
||||
{JSON.stringify(newConversationInputs ? newConversationInputs : {})}
|
||||
{JSON.stringify(existConversationInputs ? existConversationInputs : {})} */}
|
||||
|
|
|
|||
|
|
@ -0,0 +1,27 @@
|
|||
'use client'
|
||||
import React, { FC } from 'react'
|
||||
import cn from 'classnames'
|
||||
import { appDefaultIconBackground } from '@/config/index'
|
||||
import AppIcon from '@/app/components/base/app-icon'
|
||||
|
||||
export interface IAppInfoProps {
|
||||
className?: string
|
||||
icon: string
|
||||
icon_background?: string
|
||||
name: string
|
||||
}
|
||||
|
||||
const AppInfo: FC<IAppInfoProps> = ({
|
||||
className,
|
||||
icon,
|
||||
icon_background,
|
||||
name
|
||||
}) => {
|
||||
return (
|
||||
<div className={cn(className, 'flex items-center space-x-3')}>
|
||||
<AppIcon size="small" icon={icon} background={icon_background || appDefaultIconBackground} />
|
||||
<div className='w-0 grow text-sm font-semibold text-gray-800 overflow-hidden text-ellipsis whitespace-nowrap'>{name}</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
export default React.memo(AppInfo)
|
||||
|
|
@ -7,8 +7,9 @@ import {
|
|||
} from '@heroicons/react/24/outline'
|
||||
import { ChatBubbleOvalLeftEllipsisIcon as ChatBubbleOvalLeftEllipsisSolidIcon, } from '@heroicons/react/24/solid'
|
||||
import Button from '../../../base/button'
|
||||
import AppInfo from '@/app/components/share/chat/sidebar/app-info'
|
||||
// import Card from './card'
|
||||
import type { ConversationItem } from '@/models/share'
|
||||
import type { ConversationItem, SiteInfo } from '@/models/share'
|
||||
|
||||
function classNames(...classes: any[]) {
|
||||
return classes.filter(Boolean).join(' ')
|
||||
|
|
@ -22,6 +23,7 @@ export type ISidebarProps = {
|
|||
onCurrentIdChange: (id: string) => void
|
||||
list: ConversationItem[]
|
||||
isInstalledApp: boolean
|
||||
siteInfo: SiteInfo
|
||||
}
|
||||
|
||||
const Sidebar: FC<ISidebarProps> = ({
|
||||
|
|
@ -29,18 +31,27 @@ const Sidebar: FC<ISidebarProps> = ({
|
|||
currentId,
|
||||
onCurrentIdChange,
|
||||
list,
|
||||
isInstalledApp
|
||||
isInstalledApp,
|
||||
siteInfo,
|
||||
}) => {
|
||||
const { t } = useTranslation()
|
||||
return (
|
||||
<div
|
||||
className={
|
||||
classNames(
|
||||
isInstalledApp ? 'tablet:h-[calc(100vh_-_120px)]' : 'tablet:h-[calc(100vh_-_3rem)]',
|
||||
isInstalledApp ? 'tablet:h-[calc(100vh_-_58px)]' : 'tablet:h-[calc(100vh_-_3rem)]',
|
||||
"shrink-0 flex flex-col overflow-y-auto bg-white pc:w-[244px] tablet:w-[192px] mobile:w-[240px] border-r border-gray-200 mobile:h-screen"
|
||||
)
|
||||
}
|
||||
>
|
||||
{isInstalledApp && (
|
||||
<AppInfo
|
||||
className='my-4 px-4'
|
||||
name={siteInfo.title || ''}
|
||||
icon={siteInfo.icon || ''}
|
||||
icon_background={siteInfo.icon_background}
|
||||
/>
|
||||
)}
|
||||
{list.length < MAX_CONVERSATION_LENTH && (
|
||||
<div className="flex flex-shrink-0 p-4 !pb-0">
|
||||
<Button
|
||||
|
|
|
|||
|
|
@ -1,3 +1,3 @@
|
|||
.installedApp {
|
||||
height: calc(100vh - 120px);
|
||||
height: calc(100vh - 58px);
|
||||
}
|
||||
|
|
@ -97,5 +97,7 @@ export const VAR_ITEM_TEMPLATE = {
|
|||
required: true
|
||||
}
|
||||
|
||||
export const appDefaultIconBackground = '#D5F5F6'
|
||||
|
||||
|
||||
|
||||
|
|
|
|||
Loading…
Reference in New Issue