admin/dify
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

fix: toggling AppDetailNav causes unnecessary component rerenders (#3718)

Browse Source
This commit is contained in:
legao
2024-04-24 04:07:28 +00:00
committed by GitHub
parent 9eebe9d54e
commit 40e36e9b52
18 changed files with 314 additions and 276 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
web/app/(commonLayout)/app/(appDetailLayout)/[appId]/layout.tsx
View File

@@ -5,6 +5,7 @@ import React, { useCallback, useEffect, useState } from 'react'
import { usePathname, useRouter } from 'next/navigation'
import cn from 'classnames'
import { useTranslation } from 'react-i18next'
import { useShallow } from 'zustand/react/shallow'
import s from './style.module.css'
import { useStore } from '@/app/components/app/store'
import AppSideBar from '@/app/components/app-sidebar'
@@ -32,7 +33,11 @@ const AppDetailLayout: FC<IAppDetailLayoutProps> = (props) => {
const media = useBreakpoints()
const isMobile = media === MediaType.mobile
const { isCurrentWorkspaceManager } = useAppContext()
const { appDetail, setAppDetail, setAppSiderbarExpand } = useStore()
const { appDetail, setAppDetail, setAppSiderbarExpand } = useStore(useShallow(state => ({
appDetail: state.appDetail,
setAppDetail: state.setAppDetail,
setAppSiderbarExpand: state.setAppSiderbarExpand,
})))
const [navigation, setNavigation] = useState<Array<{
name: string
href: string

3
web/app/(commonLayout)/app/(appDetailLayout)/[appId]/overview/cardView.tsx
View File

@@ -26,7 +26,8 @@ export type ICardViewProps = {
const CardView: FC<ICardViewProps> = ({ appId }) => {
const { t } = useTranslation()
const { notify } = useContext(ToastContext)
const { appDetail, setAppDetail } = useAppStore()
const appDetail = useAppStore(state => state.appDetail)
const setAppDetail = useAppStore(state => state.setAppDetail)
const updateAppDetail = async () => {
fetchAppDetail({ url: '/apps', id: appId }).then((res) => {

2
web/app/(commonLayout)/app/(appDetailLayout)/[appId]/overview/chartView.tsx
View File

@@ -22,7 +22,7 @@ export type IChartViewProps = {
export default function ChartView({ appId }: IChartViewProps) {
const { t } = useTranslation()
const { appDetail } = useAppStore()
const appDetail = useAppStore(state => state.appDetail)
const isChatApp = appDetail?.mode !== 'completion' && appDetail?.mode !== 'workflow'
const isWorkflow = appDetail?.mode === 'workflow'
const [period, setPeriod] = useState<PeriodParams>({ name: t('appLog.filter.period.last7days'), query: { start: today.subtract(7, 'day').format(queryDateFormat), end: today.format(queryDateFormat) } })