Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly
Sign up
Appearance settings

Commit 1af9ee1

Browse files
authored
add get_documents ep (#1024)
1 parent 4bb42e1 commit 1af9ee1

File tree

19 files changed

+810
-41
lines changed

19 files changed

+810
-41
lines changed
Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
import {Pill} from "@mantine/core"
2+
import type {TagType} from "@/types"
3+
4+
interface Args {
5+
item: TagType
6+
}
7+
8+
export default function Tag({item}: Args) {
9+
return (
10+
<Pill style={{backgroundColor: item.bg_color, color: item.fg_color}}>
11+
{item.name}
12+
</Pill>
13+
)
14+
}
Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
import type {TagType} from "@/types"
2+
import Tag from "@/components/Tag"
3+
4+
interface Args {
5+
items: TagType[]
6+
}
7+
8+
export default function Tags({items}: Args) {
9+
const components = items.map(i => <Tag key={i.id} item={i} />)
10+
return <>{components}</>
11+
}

‎frontend/apps/ui/src/features/api/slice.ts‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -75,6 +75,7 @@ export const apiSlice = createApi({
7575
"DocumentCustomField", // custom fields associated to specific document (via document type)
7676
"DocumentCFV",
7777
"DocVersList",
78+
"FlatDocument",
7879
"DocumentVersion",
7980
"AuditLog",
8081
"PreferenceOptionTimezones",

‎frontend/apps/ui/src/features/documents-by-category/components/ColumnSelector.tsx‎

Lines changed: 6 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -11,20 +11,19 @@ import {ColumnConfig} from "kommon"
1111
import {useState} from "react"
1212
import {useTranslation} from "react-i18next"
1313
import {DocumentByCategoryItem} from "../types"
14-
import docByCatColumns from "./columns"
14+
import useColumns from "@/features/documents-by-category/hooks/useColumns"
1515

16-
interface Args {
17-
items: DocumentByCategoryItem[]
18-
}
19-
20-
export default function ColumnSelectorContainer({items}: Args) {
16+
export default function ColumnSelectorContainer() {
2117
const {panelId} = usePanel()
2218
const {t} = useTranslation()
2319
const dispatch = useAppDispatch()
20+
2421
const visibleColumns = useAppSelector(s =>
2522
selectPanelVisibleColumns(s, panelId)
2623
)
27-
const allColumns = docByCatColumns({items, t}).map(c => {
24+
const columns = useColumns()
25+
26+
const allColumns = columns.map(c => {
2827
if (!visibleColumns) {
2928
return {...c, visible: c.visible !== false}
3029
}

‎frontend/apps/ui/src/features/documents-by-category/components/List.tsx‎

Lines changed: 16 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,8 @@
11
import {useAppDispatch, useAppSelector} from "@/app/hooks"
22
import {ERRORS_403_ACCESS_FORBIDDEN} from "@/cconstants"
3-
import documentByCategoryColumns from "@/features/documents-by-category/components/columns"
4-
import useDocumentsByCategoryTable from "@/features/documents-by-category/hooks/useDocumentsByCategoryTable"
53
import useVisibleColumns from "@/features/documents-by-category/hooks/useVisibleColumns"
4+
import useDocumentsByCategoryTable from "@/features/documents-by-category/hooks/useDocumentsByCategoryTable"
5+
import useFlatDocumentsTable from "@/features/documents-by-category/hooks/useFlatDocumentsTable"
66
import {showDocumentDetailsInSecondaryPanel} from "@/features/documents-by-category/storage/thunks"
77
import {usePanel} from "@/features/ui/hooks/usePanel"
88
import {selectPanelDetailsEntityId} from "@/features/ui/panelRegistry"
@@ -15,19 +15,21 @@ import {useNavigate} from "react-router-dom"
1515
import {selectDocumentCategoryID} from "../storage/documentsByCategory"
1616
import {DocumentByCategoryItem} from "../types"
1717
import ActionButtons from "./ActionButtons"
18-
import PickupDocumentCategory from "./PickupDocumentCategory"
1918

20-
export default function DocumentsListByCagegory() {
19+
export default function DocumentsListByCategory() {
2120
const {t} = useTranslation()
2221
const dispatch = useAppDispatch()
2322
const navigate = useNavigate()
2423
const {actions} = usePanel()
2524
const categoryID = useAppSelector(selectDocumentCategoryID)
26-
const {isError, data, queryParams, error, isLoading, isFetching} =
27-
useDocumentsByCategoryTable()
28-
const visibleColumns = useVisibleColumns(
29-
documentByCategoryColumns({items: data?.items, t})
30-
)
25+
const byCategoryResult = useDocumentsByCategoryTable()
26+
const flatResult = useFlatDocumentsTable()
27+
28+
const {isError, data, queryParams, error, isLoading, isFetching} = categoryID
29+
? byCategoryResult
30+
: flatResult
31+
32+
const visibleColumns = useVisibleColumns()
3133
const currentDetailsPanelDocID = useAppSelector(s =>
3234
selectPanelDetailsEntityId(s, "secondary")
3335
)
@@ -62,20 +64,20 @@ export default function DocumentsListByCagegory() {
6264
}
6365
}
6466

65-
if (!categoryID) {
66-
return <PickupDocumentCategory />
67-
}
68-
6967
if (isError && isHTTP403Forbidden(error)) {
7068
navigate(ERRORS_403_ACCESS_FORBIDDEN)
7169
}
7270

7371
return (
7472
<Stack style={{height: "100%"}}>
7573
<Group w={"100%"}>
76-
<ActionButtons items={data?.items || []} />
74+
<ActionButtons
75+
//@ts-ignore
76+
items={data?.items || []}
77+
/>
7778
</Group>
7879
<DataTable
80+
//@ts-ignore
7981
data={data?.items || []}
8082
columns={visibleColumns}
8183
sorting={{
Lines changed: 119 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,119 @@
1+
import TimestampZ from "@/components/Timestampz"
2+
import TruncatedTextWithCopy from "@/components/TruncatedTextWithCopy"
3+
import {Box, Text} from "@mantine/core"
4+
import Tags from "@/components/Tags"
5+
import {TFunction} from "i18next"
6+
import type {ColumnConfig} from "kommon"
7+
import type {
8+
DocumentByCategoryItem,
9+
Category
10+
} from "@/features/documents-by-category/types"
11+
import {ByUser, TagType} from "@/types"
12+
13+
export default function flatColumns(t?: TFunction) {
14+
const columns: ColumnConfig<DocumentByCategoryItem>[] = [
15+
{
16+
key: "title",
17+
label:
18+
t?.("documentsByCategory.title", {defaultValue: "Title"}) || "Title",
19+
sortable: true,
20+
filterable: true,
21+
width: 200,
22+
minWidth: 150,
23+
render: (value, row, onClick) => {
24+
return (
25+
<Box
26+
style={{cursor: "pointer"}}
27+
onClick={() => onClick?.(row, false)}
28+
>
29+
<Text component="a">{value as string}</Text>
30+
</Box>
31+
)
32+
}
33+
},
34+
{
35+
key: "id",
36+
label: t?.("documentsByCategory.id", {defaultValue: "ID"}) || "ID",
37+
sortable: true,
38+
filterable: true,
39+
visible: true,
40+
width: 200,
41+
minWidth: 100,
42+
render: value => <TruncatedTextWithCopy value={value as string} />
43+
},
44+
{
45+
key: "category",
46+
label:
47+
t?.("documentsByCategory.category", {defaultValue: "Category"}) ||
48+
"Category",
49+
sortable: true,
50+
filterable: true,
51+
width: 200,
52+
minWidth: 150,
53+
render: value => (
54+
<Text size="sm">{value && (value as Category).name}</Text>
55+
)
56+
},
57+
{
58+
key: "tags",
59+
label: t?.("documentsByCategory.tags", {defaultValue: "Tags"}) || "Tags",
60+
sortable: false,
61+
filterable: true,
62+
width: 200,
63+
minWidth: 150,
64+
render: value => <Tags items={value as TagType[]} />
65+
},
66+
{
67+
key: "created_at",
68+
label:
69+
t?.("documentsByCategory.created_at", {defaultValue: "Created At"}) ||
70+
"Created At",
71+
sortable: true,
72+
filterable: true,
73+
visible: true,
74+
width: 200,
75+
minWidth: 100,
76+
render: value => <TimestampZ value={value as string} />
77+
},
78+
{
79+
key: "created_by",
80+
label:
81+
t?.("documentsByCategory.created_by", {defaultValue: "Created By"}) ||
82+
"Created By",
83+
sortable: true,
84+
filterable: true,
85+
visible: true,
86+
width: 200,
87+
minWidth: 100,
88+
render: value => (
89+
<Text size="sm">{value && (value as ByUser).username}</Text>
90+
)
91+
},
92+
{
93+
key: "updated_at",
94+
label:
95+
t?.("documentsByCategory.updated_at", {defaultValue: "Updated At"}) ||
96+
"Updated At",
97+
sortable: true,
98+
filterable: true,
99+
visible: false,
100+
width: 200,
101+
minWidth: 100,
102+
render: value => <TimestampZ value={value as string} />
103+
},
104+
{
105+
key: "updated_by",
106+
label:
107+
t?.("documentsByCategory.updated_by", {defaultValue: "Updated By"}) ||
108+
"updated By",
109+
sortable: true,
110+
filterable: true,
111+
visible: false,
112+
width: 200,
113+
minWidth: 100,
114+
render: value => <Text size="sm">{(value as ByUser).username}</Text>
115+
}
116+
]
117+
118+
return columns
119+
}
Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
import {useAppSelector} from "@/app/hooks"
2+
import {selectDocumentCategoryID} from "@/features/documents-by-category/storage/documentsByCategory"
3+
import {useTranslation} from "react-i18next"
4+
import {ColumnConfig} from "kommon"
5+
import useDocumentsByCategoryTable from "@/features/documents-by-category/hooks/useDocumentsByCategoryTable"
6+
import documentByCategoryColumns from "@/features/documents-by-category/components/columns"
7+
import {DocumentByCategoryItem} from "@/features/documents-by-category/types"
8+
import flatColumns from "@/features/documents-by-category/components/flatColumns"
9+
10+
export default function useColumns(): ColumnConfig<DocumentByCategoryItem>[] {
11+
const {t} = useTranslation()
12+
const categoryID = useAppSelector(selectDocumentCategoryID)
13+
const {data} = useDocumentsByCategoryTable()
14+
15+
if (categoryID) {
16+
return documentByCategoryColumns({items: data?.items, t})
17+
}
18+
19+
return flatColumns(t)
20+
}
Lines changed: 53 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,53 @@
1+
import {useAppSelector} from "@/app/hooks"
2+
import {useGetPaginatedFlatDocumentsQuery} from "@/features/documents-by-category/storage/api"
3+
import type {
4+
FlatDocumentsQueryParams,
5+
FlatDocumentSortBy
6+
} from "@/features/documents-by-category/storage/api"
7+
import {usePanel} from "@/features/ui/hooks/usePanel"
8+
import {
9+
selectPanelFilters,
10+
selectPanelPageNumber,
11+
selectPanelPageSize,
12+
selectPanelSorting
13+
} from "@/features/ui/panelRegistry"
14+
import {selectDocumentCategoryID} from "../storage/documentsByCategory"
15+
16+
function useQueryParams(): FlatDocumentsQueryParams {
17+
const {panelId} = usePanel()
18+
19+
const pageSize = useAppSelector(s => selectPanelPageSize(s, panelId)) || 10
20+
const pageNumber = useAppSelector(s => selectPanelPageNumber(s, panelId)) || 1
21+
const sorting = useAppSelector(s => selectPanelSorting(s, panelId))
22+
const filters = useAppSelector(s => selectPanelFilters(s, panelId))
23+
24+
const column = sorting?.column as FlatDocumentSortBy | undefined
25+
26+
const queryParams: FlatDocumentsQueryParams = {
27+
page_size: pageSize,
28+
page_number: pageNumber,
29+
sort_by: column,
30+
sort_direction: sorting?.direction || undefined
31+
}
32+
33+
return queryParams
34+
}
35+
36+
export default function useFlatDocumentsTable() {
37+
const queryParams = useQueryParams()
38+
const categoryID = useAppSelector(selectDocumentCategoryID)
39+
40+
const {data, isLoading, isFetching, isError, error} =
41+
useGetPaginatedFlatDocumentsQuery(queryParams, {
42+
skip: !!categoryID // Skip when categoryID is present
43+
})
44+
45+
return {
46+
data,
47+
isLoading,
48+
isFetching,
49+
isError,
50+
error,
51+
queryParams
52+
}
53+
}

‎frontend/apps/ui/src/features/documents-by-category/hooks/useVisibleColumns.ts‎

Lines changed: 23 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,34 @@
11
import {useAppSelector} from "@/app/hooks"
22
import {usePanel} from "@/features/ui/hooks/usePanel"
3+
4+
import documentByCategoryColumns from "@/features/documents-by-category/components/columns"
5+
import flatColumns from "@/features/documents-by-category/components/flatColumns"
6+
import {DocumentByCategoryItem} from "../types"
7+
import {selectDocumentCategoryID} from "../storage/documentsByCategory"
8+
import useDocumentsByCategoryTable from "@/features/documents-by-category/hooks/useDocumentsByCategoryTable"
9+
310
import {selectPanelVisibleColumns} from "@/features/ui/panelRegistry"
411
import {ColumnConfig} from "kommon"
12+
import {useTranslation} from "react-i18next"
513

6-
export default function useVisibleColumns<T>(
7-
columns: ColumnConfig<T>[]
8-
): ColumnConfig<T>[] {
14+
export default function useVisibleColumns(): ColumnConfig<DocumentByCategoryItem>[] {
15+
const {t} = useTranslation()
916
const {panelId} = usePanel()
17+
const categoryID = useAppSelector(selectDocumentCategoryID)
1018
const selected = useAppSelector(s => selectPanelVisibleColumns(s, panelId))
19+
const {data} = useDocumentsByCategoryTable()
20+
1121
const hasSelection = selected && selected.length > 0
22+
let columns: ColumnConfig<DocumentByCategoryItem>[] = []
23+
24+
console.log(categoryID)
25+
if (categoryID) {
26+
// different set of columns depending on category ID
27+
columns = documentByCategoryColumns({items: data?.items, t})
28+
} else {
29+
// basic columns common for all categories i.e. id, title, tags, category etc
30+
columns = flatColumns(t)
31+
}
1232

1333
const visibleColumns = columns
1434
.filter(c => {

0 commit comments

Comments
(0)

AltStyle によって変換されたページ (->オリジナル) /