Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Content] Workflow status #3114

Open
wants to merge 85 commits into
base: dev
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from 1 commit
Commits
Show all changes
85 commits
Select commit Hold shift + click to select a range
113e190
task: create new version selector button
finnar-bin Nov 26, 2024
f5ea2b4
task: create version item component
finnar-bin Nov 26, 2024
828cf06
task: move menuItem to parent
finnar-bin Nov 26, 2024
ed0e32b
task: wire load version
finnar-bin Nov 27, 2024
323b451
task: render labels
finnar-bin Nov 27, 2024
25413ad
task: use new version selector
finnar-bin Nov 28, 2024
4c57890
task: create add label component
finnar-bin Dec 3, 2024
135d640
task: create rtk queries
finnar-bin Dec 3, 2024
9866289
task: virtualize list
finnar-bin Dec 4, 2024
485d34a
task: dynamically change row height
finnar-bin Dec 4, 2024
5160299
task: prevent jank when opening add label form
finnar-bin Dec 5, 2024
34800d0
task: add label select
finnar-bin Dec 5, 2024
18641fa
task: calculate max list height dynamically
finnar-bin Dec 5, 2024
1ac802f
task: remove ununsed hook
finnar-bin Dec 5, 2024
2c9ce2b
chore: cleanup
finnar-bin Dec 5, 2024
7113141
task: map an item's active status labels
finnar-bin Dec 6, 2024
02eccc1
chore: cleanup
finnar-bin Dec 10, 2024
243fe2c
Merge branch 'dev' into feature/2132-workflow-status
finnar-bin Dec 10, 2024
058d747
task: label mapping
finnar-bin Dec 10, 2024
f458535
task: add/remove status
finnar-bin Dec 11, 2024
ed32b1b
Merge branch 'dev' into feature/2132-workflow-status
finnar-bin Dec 11, 2024
c7c9b67
task: wire edit statuses button
finnar-bin Dec 11, 2024
40363e7
task: wire add/remove label
finnar-bin Dec 11, 2024
05029ae
task: invalidate itemworkflowstatus on content item update
finnar-bin Dec 12, 2024
1bf08ab
task: show most recent label on the header
finnar-bin Dec 12, 2024
fbe6ce3
task: change dropdown position
finnar-bin Dec 16, 2024
0aef49b
task: set max width for chip
finnar-bin Dec 16, 2024
7c4a6c0
task: show counter if active label is more than 1
finnar-bin Dec 16, 2024
75b35a9
task: add publish check
finnar-bin Dec 16, 2024
38a56c8
task: simplify row calculation
finnar-bin Dec 17, 2024
9bda0dc
task: optimize row height calculation
finnar-bin Dec 17, 2024
d2b7743
Merge branch 'dev' into feature/2132-workflow-status
finnar-bin Dec 18, 2024
3fee7d7
[feature/2132-workflow-status-labels]: Create workflows page | status…
geodem127 Dec 18, 2024
683c158
Merge branch 'dev' into feature/2132-workflow-status
finnar-bin Dec 20, 2024
dbff4de
fix: sort labels
finnar-bin Dec 20, 2024
0a2a67d
task: add e2e tests
finnar-bin Dec 20, 2024
5e4002c
Fix reorder trigger
geodem127 Dec 20, 2024
ec3e4f2
Added test cases
geodem127 Dec 20, 2024
c073edb
Added test cases
geodem127 Dec 20, 2024
0e7840b
Added test cases
geodem127 Dec 20, 2024
f9d76b8
Added test cases for reordering labels.
geodem127 Dec 22, 2024
ba438ed
Merge branch 'dev' into feature/2132-workflow-status
finnar-bin Jan 2, 2025
aea7d7b
task: update tests
finnar-bin Jan 2, 2025
00377ee
fix: filter out undefined workflow labels
finnar-bin Jan 2, 2025
6eda4c5
fix: update tests
finnar-bin Jan 2, 2025
296ac60
Added workflow labels test cases, added config to support ts in cypre…
geodem127 Jan 2, 2025
c96b661
Merge remote-tracking branch 'refs/remotes/origin/feature/2132-workfl…
geodem127 Jan 2, 2025
6cc3ae0
Merge remote-tracking branch 'refs/remotes/origin/feature/2132-workfl…
geodem127 Jan 2, 2025
a3ff119
Merge remote-tracking branch 'refs/remotes/origin/feature/2132-workfl…
geodem127 Jan 2, 2025
ce5ea6d
Merge remote-tracking branch 'refs/remotes/origin/feature/2132-workfl…
geodem127 Jan 2, 2025
b32086c
Merge remote-tracking branch 'refs/remotes/origin/feature/2132-workfl…
geodem127 Jan 2, 2025
acf1622
Merge remote-tracking branch 'refs/remotes/origin/feature/2132-workfl…
geodem127 Jan 2, 2025
8a487bf
Merge remote-tracking branch 'refs/remotes/origin/feature/2132-workfl…
geodem127 Jan 2, 2025
772715a
Merge remote-tracking branch 'refs/remotes/origin/feature/2132-workfl…
geodem127 Jan 2, 2025
deab34e
Merge remote-tracking branch 'refs/remotes/origin/feature/2132-workfl…
geodem127 Jan 2, 2025
e08647d
task: remove unused mocks
finnar-bin Jan 3, 2025
a5e8e81
task: fix cache invalidation
finnar-bin Jan 3, 2025
85de838
task: remove timeout
finnar-bin Jan 3, 2025
7eaeb71
Merge branch 'dev' into feature/2132-workflow-status
finnar-bin Jan 3, 2025
5695e41
Relocated prop types | refactored user role identifier - changed to s…
geodem127 Jan 3, 2025
78bb88b
Added test cases to cover important scenarios
geodem127 Jan 3, 2025
f434075
Added test cases to cover important scenarios
geodem127 Jan 3, 2025
3ec6c2b
Fix test errors in deactivating status label
geodem127 Jan 3, 2025
0cc2171
Refactored test cases to resolve flaky test issues
geodem127 Jan 6, 2025
73d5f57
Refactored test cases to resolve flaky test issues
geodem127 Jan 6, 2025
0371227
Merge branch 'dev' into feature/2132-workflow-status
finnar-bin Jan 7, 2025
860f490
Merge remote-tracking branch 'refs/remotes/origin/feature/2132-workfl…
geodem127 Jan 7, 2025
fca84d9
Merge branch 'dev' into feature/2132-workflow-status
finnar-bin Jan 8, 2025
b732280
fix: fixed broken tests
finnar-bin Jan 9, 2025
4559256
Fixed workflow status labels test cases
geodem127 Jan 9, 2025
3a3172e
Fixed workflow status labels test cases
geodem127 Jan 9, 2025
31c2e10
Merge remote-tracking branch 'refs/remotes/origin/feature/2132-workfl…
geodem127 Jan 9, 2025
ee05946
Fixed test cases
geodem127 Jan 9, 2025
f08c7ca
Fixed test cases
geodem127 Jan 9, 2025
914bf2a
Merge remote-tracking branch 'refs/remotes/origin/feature/2132-workfl…
geodem127 Jan 9, 2025
69ad65a
Fix flaky test
geodem127 Jan 9, 2025
560c6e8
Merge branch 'dev' into feature/2132-workflow-status
finnar-bin Jan 13, 2025
b2bdc55
Merge branch 'dev' into feature/2132-workflow-status
finnar-bin Jan 15, 2025
d116e98
Merge branch 'dev' into feature/2132-workflow-status
finnar-bin Jan 15, 2025
ee1fafe
Merge branch 'dev' into feature/2132-workflow-status
finnar-bin Jan 16, 2025
28f22eb
Merge branch 'dev' into feature/2132-workflow-status
finnar-bin Jan 27, 2025
60a48de
Merge branch 'dev' into feature/2132-workflow-status
finnar-bin Jan 27, 2025
bcdcfbe
Merge branch 'dev' into feature/2132-workflow-status
finnar-bin Feb 4, 2025
2c5b620
Resolve merge conflicts
finnar-bin Feb 7, 2025
40c5d17
Merge branch 'dev' into feature/2132-workflow-status
finnar-bin Feb 14, 2025
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Prev Previous commit
Next Next commit
task: add/remove status
  • Loading branch information
finnar-bin committed Dec 11, 2024
commit f458535af278b072d898f9d482a6b5086c16eb57
Original file line number Diff line number Diff line change
@@ -0,0 +1,37 @@
import { Button, Box, Stack, Typography } from "@mui/material";
import { Search } from "@mui/icons-material";

import noResults from "../../../../../../../../../../public/images/noSearchResults.jpg";

type NoResultsProps = {
query: string;
onSearchAgain: () => void;
};
export const NoResults = ({ query, onSearchAgain }: NoResultsProps) => {
return (
<Stack gap={2.5} alignItems="center" p={2.5}>
<img
src={noResults}
alt="No Search Results"
loading="lazy"
height={120}
/>
<Box width={339} sx={{ whiteSpace: "break-spaces", textAlign: "center" }}>
<Typography variant="h5" fontWeight={600}>
Your search <strong>"{query}"</strong> could not find any results
</Typography>
<Typography variant="body2" color="text.secondary">
Try adjusting your search. We suggest check all words are spelled
correctly or try using different keywords.
</Typography>
</Box>
<Button
variant="contained"
startIcon={<Search />}
onClick={onSearchAgain}
>
Search Again
</Button>
</Stack>
);
};
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import { useState, forwardRef, useRef, ForwardedRef } from "react";
import { useState, forwardRef, useRef, ForwardedRef, useMemo } from "react";
import {
Box,
MenuItem,
Expand All @@ -20,15 +20,17 @@ import {
Check,
} from "@mui/icons-material";
import { useSelector } from "react-redux";
import { useDebounce } from "react-use";

import { useGetWorkflowStatusLabelsQuery } from "../../../../../../../../../shell/services/instance";
import {
User,
WorkflowStatusLabel,
} from "../../../../../../../../../shell/services/types";
import { WORKFLOW_LABELS as statusLabels } from "./mocks";
// import { WORKFLOW_LABELS as statusLabels } from "./mocks";
import { AppState } from "../../../../../../../../../shell/store/types";
import { useGetUsersRolesQuery } from "../../../../../../../../../shell/services/accounts";
import { NoResults } from "./NoResults";

const BG_COLOR_MAPPING: Record<string, string> = {
"#0ba5ec": "blue.100",
Expand Down Expand Up @@ -65,15 +67,35 @@ export const VersionItem = forwardRef(
const user: User = useSelector((state: AppState) => state.user);
const addNewLabelRef = useRef<HTMLDivElement>(null);
const searchRef = useRef<HTMLDivElement>(null);
const { data: statusLabelsxx } = useGetWorkflowStatusLabelsQuery();
const { data: statusLabels } = useGetWorkflowStatusLabelsQuery();
const { data: usersRoles } = useGetUsersRolesQuery();
const [isAddNewLabelOpen, setIsAddNewLabelOpen] = useState(false);
const [filterKeyword, setFilterKeyword] = useState("");
const [debouncedFilterKeyword, setDebouncedFilterKeyword] = useState("");
const [activeLabels, setActiveLabels] = useState(
data?.labels?.map((label) => label.ZUID)
);

const currentUserRoleZUID = usersRoles?.find(
(userWithRole) => userWithRole.ZUID === user.ZUID
)?.role?.ZUID;

useDebounce(() => setDebouncedFilterKeyword(filterKeyword), 200, [
filterKeyword,
]);

const filteredStatusLabels = useMemo(() => {
onUpdateElementHeight();

if (!debouncedFilterKeyword) return statusLabels;

return statusLabels?.filter((label) =>
label.name
?.toLowerCase()
.includes(debouncedFilterKeyword?.toLowerCase()?.trim())
);
}, [statusLabels, debouncedFilterKeyword]);

const handleOpenAddNewLabel = (evt: any) => {
evt.stopPropagation();

Expand All @@ -89,6 +111,14 @@ export const VersionItem = forwardRef(
}
};

const handleToggleLabel = (ZUID: string) => {
if (activeLabels?.includes(ZUID)) {
setActiveLabels(activeLabels.filter((label) => label !== ZUID));
} else {
setActiveLabels([...activeLabels, ZUID]);
}
};

return (
<Stack ref={ref} width="100%">
<Stack
Expand Down Expand Up @@ -144,26 +174,32 @@ export const VersionItem = forwardRef(
pt={1.25}
pb={2}
>
{data.labels?.map((label) => (
<Chip
key={label.ZUID}
clickable
onClick={handleOpenAddNewLabel}
label={label.name}
size="small"
sx={{
color: label.color,
bgcolor: BG_COLOR_MAPPING[label.color.toLowerCase()],
{activeLabels?.map((labelZUID) => {
const labelData = statusLabels?.find(
(status) => status.ZUID === labelZUID
);

"&:hover": {
bgcolor: BG_COLOR_MAPPING[label.color.toLowerCase()],
},
"&:focus": {
bgcolor: BG_COLOR_MAPPING[label.color.toLowerCase()],
},
}}
/>
))}
return (
<Chip
key={labelData.ZUID}
clickable
onClick={handleOpenAddNewLabel}
label={labelData.name}
size="small"
sx={{
color: labelData.color,
bgcolor: BG_COLOR_MAPPING[labelData.color.toLowerCase()],

"&:hover": {
bgcolor: BG_COLOR_MAPPING[labelData.color.toLowerCase()],
},
"&:focus": {
bgcolor: BG_COLOR_MAPPING[labelData.color.toLowerCase()],
},
}}
/>
);
})}
{isActive && (
<Chip
clickable
Expand Down Expand Up @@ -206,20 +242,29 @@ export const VersionItem = forwardRef(
px: 1,
}}
/>
{statusLabels?.map((label, index) => {
{!filteredStatusLabels?.length && filterKeyword && (
<NoResults
query={filterKeyword}
onSearchAgain={() => {
setFilterKeyword("");
searchRef.current?.querySelector("input").focus();
}}
/>
)}
{filteredStatusLabels?.map((label, index) => {
let title = "";
const canRemove = label.removePermissionRoles?.length
? label.removePermissionRoles.includes(currentUserRoleZUID)
: true;
const canAdd = label.addPermissionRoles?.length
? label.addPermissionRoles.includes(currentUserRoleZUID)
: true;

if (
label.addPermissionRoles?.length &&
!label.addPermissionRoles.includes(currentUserRoleZUID)
) {
if (!canAdd) {
title = "Do not have permission to add this status";
}

if (
label.removePermissionRoles?.length &&
!label.removePermissionRoles.includes(currentUserRoleZUID)
) {
if (!canRemove) {
title = "Do not have permission to remove this status";
}

Expand All @@ -235,9 +280,25 @@ export const VersionItem = forwardRef(
borderBottom: index + 1 < statusLabels?.length ? 1 : 0,
borderColor: "border",
}}
onClick={() => {
if (
(activeLabels.includes(label.ZUID) && canRemove) ||
(!activeLabels.includes(label.ZUID) && canAdd)
) {
handleToggleLabel(label.ZUID);
}
}}
>
<Stack direction="row" gap={1}>
<Check fontSize="small" color="action" />
<Check
fontSize="small"
color="action"
sx={{
visibility: activeLabels?.includes(label.ZUID)
? "visible"
: "hidden",
}}
/>
<Stack gap={0.5} direction="row" alignItems="baseline">
<Box
width={12}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,7 @@ import { VariableSizeList } from "react-window";
import AutoSizer from "react-virtualized-auto-sizer";

import { Row } from "./Row";
import { WORKFLOW_LABELS as statusLabels, WORKFLOW_LABELS } from "./mocks";
// import { WORKFLOW_LABELS as statusLabels, WORKFLOW_LABELS } from "./mocks";

const dummyLabels = [
"Approved",
Expand Down Expand Up @@ -71,7 +71,7 @@ export const VersionSelector = memo(
modelZUID: string;
itemZUID: string;
}>();
const { data: statusLabelsxx, isLoading: isLoadingStatusLabels } =
const { data: statusLabels, isLoading: isLoadingStatusLabels } =
useGetWorkflowStatusLabelsQuery();
const { data: itemWorkflowStatus, isLoading: isLoadingItemWorkflowStatus } =
useGetItemWorkflowStatusQuery(
Expand Down Expand Up @@ -109,19 +109,19 @@ export const VersionSelector = memo(
);

return versions.map((v) => {
// let labels: WorkflowStatusLabel[] = [];
let labels: WorkflowStatusLabel[] = [];

// if (statusLabels?.length && itemWorkflowStatus?.length) {
// const labelZUIDs = itemWorkflowStatus.find(
// (status) => status.itemVersion === v.meta?.version
// )?.labelZUIDs;
if (statusLabels?.length && itemWorkflowStatus?.length) {
const labelZUIDs = itemWorkflowStatus.find(
(status) => status.itemVersion === v.meta?.version
)?.labelZUIDs;

// labels = labelZUIDs?.map((labelZUID) =>
// statusLabels.find((statusLabel) => statusLabel.ZUID === labelZUID)
// );
// }
labels = labelZUIDs?.map((labelZUID) =>
statusLabels.find((statusLabel) => statusLabel.ZUID === labelZUID)
);
}

const labels = WORKFLOW_LABELS;
// const labels = WORKFLOW_LABELS;

return {
itemZUID: v.meta?.ZUID,
Expand Down