Skip to content

Commit

Permalink
update(console): use projectId for table query (#1845)
Browse files Browse the repository at this point in the history
* update: use projectId for table query

* update: remove test code
  • Loading branch information
waynelwz authored Feb 16, 2023
1 parent 11d90db commit 28a4741
Show file tree
Hide file tree
Showing 6 changed files with 59 additions and 74 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -29,13 +29,13 @@ export function useDatastoreTablesByPrefix(prefix: string) {
}
}

export default function useDatastoreTables(projectName: string, jobUuid: string) {
export default function useDatastoreTables(projectId: string, jobUuid: string) {
const queryAllTables = useMemo(() => {
if (!projectName || !jobUuid) return undefined
if (!projectId || !jobUuid) return undefined
return {
prefix: tablesOfEvaluation(projectName, jobUuid),
prefix: tablesOfEvaluation(projectId, jobUuid),
}
}, [projectName, jobUuid])
}, [projectId, jobUuid])

return useDatastoreTablesByPrefix(queryAllTables?.prefix as string)
}
4 changes: 1 addition & 3 deletions console/src/components/Editor/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,6 @@ import { registerWidgets } from '@starwhale/core/widget/WidgetFactoryRegister'
import { createCustomStore } from '@starwhale/core/store'
import WidgetRenderTree from '@starwhale/core/widget/WidgetRenderTree'
import { EventBusSrv } from '@starwhale/core/events'
import { useProject } from '@/domain/project/hooks/useProject'
import { useJob } from '@/domain/job/hooks/useJob'
import { tablesOfEvaluation } from '@starwhale/core'
import { useParams } from 'react-router-dom'
Expand All @@ -26,10 +25,9 @@ export function withEditorRegister(EditorApp: React.FC) {
// log.debug('WidgetFactory', WidgetFactory.widgetMap)
// @FIXME
const { projectId } = useParams<{ projectId: string }>()
const { project } = useProject()
const { job } = useJob()
// eslint-disable-next-line prefer-template
const prefix = project?.name && job?.uuid ? tablesOfEvaluation(project?.name, job?.uuid) + '/' : undefined
const prefix = projectId && job?.uuid ? tablesOfEvaluation(projectId, job?.uuid) + '/' : undefined
const storeKey = job?.modelName ? ['evaluation-model', job?.modelName].join('-') : undefined
if (!prefix || !storeKey || !projectId) {
return <BusyPlaceholder type='spinner' />
Expand Down
7 changes: 2 additions & 5 deletions console/src/pages/Evaluation/EvaluationListCard.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -15,7 +15,6 @@ import { useFetchViewConfig } from '@/domain/evaluation/hooks/useFetchViewConfig
import { setEvaluationViewConfig } from '@/domain/evaluation/services/evaluation'
import { useQueryDatasetList } from '@starwhale/core/datastore/hooks/useFetchDatastore'
import { tableNameOfSummary } from '@starwhale/core/datastore/utils'
import { useProject } from '@/domain/project/hooks/useProject'
import { TextLink } from '@/components/Link'
import { WithCurrentAuth } from '@/api/WithAuth'
import { GridTable, useDatastoreColumns } from '@starwhale/ui/GridTable'
Expand All @@ -28,11 +27,9 @@ export default function EvaluationListCard() {
const [t] = useTranslation()
const history = useHistory()
const { projectId } = useParams<{ projectId: string }>()
const { project } = useProject()
const summaryTableName = React.useMemo(() => {
if (!project?.name) return ''
return tableNameOfSummary(project?.name as string)
}, [project])
return tableNameOfSummary(projectId)
}, [projectId])
const store = useEvaluationStore()

const options = React.useMemo(() => {
Expand Down
18 changes: 9 additions & 9 deletions console/src/pages/Evaluation/EvaluationResults.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -6,10 +6,10 @@ import BusyPlaceholder from '@starwhale/ui/BusyLoaderWrapper/BusyPlaceholder'
import { showTableName, tableNameOfSummary, tablesOfEvaluation } from '@starwhale/core/datastore/utils'
import { useJob } from '@/domain/job/hooks/useJob'
import { useListDatastoreTables, useQueryDatastore } from '@starwhale/core/datastore/hooks/useFetchDatastore'
import { useProject } from '@/domain/project/hooks/useProject'
import { useParseConfusionMatrix, useParseRocAuc } from '@starwhale/core/datastore/hooks/useParseDatastore'
import Table from '@/components/Table'
import { QueryTableRequest } from '@starwhale/core/datastore/schemas/datastore'
import { useParams } from 'react-router-dom'

const PlotlyVisualizer = React.lazy(
() => import(/* webpackChunkName: "PlotlyVisualizer" */ '../../components/Indicator/PlotlyVisualizer')
Expand Down Expand Up @@ -157,34 +157,34 @@ function EvaluationViewer({ table, filter }: { table: string; filter?: Record<st
}

function EvaluationResults() {
const { project } = useProject()
const { job } = useJob()
const { projectId } = useParams<{ jobId: string; projectId: string }>()

const queryAllTables = React.useMemo(() => {
if (!project?.name || !job?.uuid) return ''
if (!projectId || !job?.uuid) return ''
return {
prefix: tablesOfEvaluation(project?.name as string, job?.uuid),
prefix: tablesOfEvaluation(projectId, job?.uuid),
}
}, [project, job])
}, [projectId, job])
const allTables = useListDatastoreTables(queryAllTables)

useEffect(() => {
if (job?.uuid && project?.name) {
if (job?.uuid && projectId) {
allTables.refetch()
}
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [project?.name, job?.uuid])
}, [projectId, job?.uuid])

const tables = React.useMemo(() => {
const names = []
if (project?.name) names.push(tableNameOfSummary(project?.name as string))
if (projectId) names.push(tableNameOfSummary(projectId))

return [
...names,
// TODO hard code remove results
...(allTables.data?.tables?.sort((a, b) => (a > b ? 1 : -1)).filter((v) => !v.includes('results')) ?? []),
]
}, [allTables, project])
}, [allTables, projectId])

return (
<div style={{ width: '100%', height: 'auto' }}>
Expand Down
81 changes: 37 additions & 44 deletions console/src/pages/Evaluation/EvaluationWidgetResults.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,6 @@ import Card from '@/components/Card'
import BusyPlaceholder from '@starwhale/ui/BusyLoaderWrapper/BusyPlaceholder'
import { showTableName, tableNameOfSummary } from '@starwhale/core/datastore/utils'
import { useQueryDatastore } from '@starwhale/core/datastore/hooks/useFetchDatastore'
import { useProject } from '@/domain/project/hooks/useProject'
import Table from '@/components/Table'
import { Panel, StatelessAccordion } from 'baseui/accordion'
import { QueryTableRequest } from '@starwhale/core/datastore'
Expand All @@ -14,7 +13,7 @@ import { Button, IconFont } from '@starwhale/ui'
const PAGE_TABLE_SIZE = 100

function Summary({ fetch }: any) {
const record: Record<string, string> = fetch?.data?.records?.[0] ?? {}
const record: Record<string, string> = fetch?.data?.records?.[0]
const [expanded, setExpanded] = React.useState<boolean>(false)

return (
Expand Down Expand Up @@ -96,9 +95,7 @@ function Summary({ fetch }: any) {
}
key='summary'
>
{fetch?.data?.records.length === 0 && (
<BusyPlaceholder type='notfound' style={{ height: '300px' }} />
)}
{!record && <BusyPlaceholder type='notfound' style={{ height: '148px', minHeight: 'auto' }} />}
<div
style={{
lineHeight: '32px',
Expand All @@ -109,34 +106,35 @@ function Summary({ fetch }: any) {
overflow: 'auto',
}}
>
{Object.keys(record)
.sort((a, b) => {
if (a === 'id') return -1
return a > b ? 1 : -1
})
.filter((label) => typeof record[label] !== 'object')
.map((label) => {
return (
<React.Fragment key={label}>
<div
style={{
color: 'rgba(2,16,43,0.60)',
borderBottom: '1px solid #EEF1F6',
}}
>
{label}
</div>
<div
style={{
borderBottom: '1px solid #EEF1F6',
paddingLeft: '20px',
}}
>
{record[label]}
</div>
</React.Fragment>
)
})}
{record &&
Object.keys(record)
.sort((a, b) => {
if (a === 'id') return -1
return a > b ? 1 : -1
})
.filter((label) => typeof record[label] !== 'object')
.map((label) => {
return (
<React.Fragment key={label}>
<div
style={{
color: 'rgba(2,16,43,0.60)',
borderBottom: '1px solid #EEF1F6',
}}
>
{label}
</div>
<div
style={{
borderBottom: '1px solid #EEF1F6',
paddingLeft: '20px',
}}
>
{record[label]}
</div>
</React.Fragment>
)
})}
</div>
</Panel>
</StatelessAccordion>
Expand Down Expand Up @@ -172,13 +170,9 @@ function EvaluationViewer({ table, filter }: { table: string; filter?: Record<st
)
}, [info.data, columns])

if (info.isFetching) {
return <BusyPlaceholder />
}

if (info.isError) {
return <BusyPlaceholder type='notfound' />
}
// if (info.isFetching) {
// return <BusyPlaceholder />
// }

if (table.includes('/summary')) return <Summary name={table} fetch={info} />

Expand All @@ -192,15 +186,14 @@ function EvaluationViewer({ table, filter }: { table: string; filter?: Record<st
}

function EvaluationWidgetResults() {
const { jobId } = useParams<{ jobId: string; projectId: string }>()
const { project } = useProject()
const { jobId, projectId } = useParams<{ jobId: string; projectId: string }>()

const tables = React.useMemo(() => {
const names = []
if (project?.name) names.push(tableNameOfSummary(project?.name))
if (projectId) names.push(tableNameOfSummary(projectId))

return [...names]
}, [project?.name])
}, [projectId])

return (
<div style={{ width: '100%', height: 'auto' }}>
Expand Down
15 changes: 6 additions & 9 deletions console/src/pages/Model/ModelOverviewLayout.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -8,11 +8,9 @@ import { fetchModel, removeModel } from '@model/services/model'
import BaseSubLayout from '@/pages/BaseSubLayout'
import IconFont from '@starwhale/ui/IconFont'
import { BaseNavTabs } from '@/components/BaseNavTabs'
import { Button } from '@starwhale/ui'
import { Button, Toggle } from '@starwhale/ui'
import { usePage } from '@/hooks/usePage'
import qs from 'qs'
import Checkbox from '@starwhale/ui/Checkbox'
import { STYLE_TYPE } from 'baseui/checkbox'
import { createUseStyles } from 'react-jss'
import { useQueryArgs } from '@starwhale/core'
import { ConfirmButton } from '@starwhale/ui/Modal'
Expand Down Expand Up @@ -165,18 +163,17 @@ export default function ModelOverviewLayout({ children }: IModelLayoutProps) {
</div>

<div style={{ display: 'flex', alignItems: 'center', gap: '9px' }}>
<Checkbox
checked={isCompare}
onChange={(e) => {
setIsCompare(e.currentTarget.checked)
if (!e.currentTarget.checked)
<Toggle
value={isCompare}
onChange={(checked) => {
setIsCompare(checked)
if (!checked)
history.push(
`/projects/${projectId}/models/${modelId}/versions/${modelVersionId}/${activeItemId}?${qs.stringify(
{ ...page, compare: undefined }
)}`
)
}}
checkmarkType={STYLE_TYPE.toggle_round}
/>
{t('model.viewer.compare')}
</div>
Expand Down

0 comments on commit 28a4741

Please sign in to comment.