From c3964d06f96d8dcecb28623c4096cfda2bbcac1d Mon Sep 17 00:00:00 2001 From: "ITHQ1947\\saritha.pillai" Date: Mon, 24 Jun 2024 18:43:14 +0530 Subject: [PATCH] Loading changes for portal screen --- src/components/NavigationLayout.tsx | 4 +- src/components/Participant.tsx | 2 +- src/components/Prevent.tsx | 4 +- src/components/PreventSelectedActivities.tsx | 152 +++++++++++-------- 4 files changed, 90 insertions(+), 72 deletions(-) diff --git a/src/components/NavigationLayout.tsx b/src/components/NavigationLayout.tsx index 86400324..a7d17754 100755 --- a/src/components/NavigationLayout.tsx +++ b/src/components/NavigationLayout.tsx @@ -246,7 +246,9 @@ export default function NavigationLayout({ } else { setLoading(false) } - refresh() + if (!!isMounted) { + refresh() + } } return () => { isMounted = false diff --git a/src/components/Participant.tsx b/src/components/Participant.tsx index 46ddcb0c..b8d292c0 100644 --- a/src/components/Participant.tsx +++ b/src/components/Participant.tsx @@ -260,7 +260,7 @@ export default function Participant({ return ( - + {activities !== null && !loading && ( diff --git a/src/components/Prevent.tsx b/src/components/Prevent.tsx index 14bca6f9..6f6448dd 100644 --- a/src/components/Prevent.tsx +++ b/src/components/Prevent.tsx @@ -254,9 +254,9 @@ export default function Prevent({ if (gActivities.length > 0) { Service.getAllTags("activitytags").then((data) => { setTag((data || []).filter((x: any) => !!x?.category && x?.category.includes("prevent"))) - setLoading(false) }) } + setLoading(false) } React.useEffect(() => { @@ -279,7 +279,6 @@ export default function Prevent({ let disabled = ((await LAMP.Type.getAttachment(participant.id, "lamp.dashboard.disable_data")) as any)?.data ?? false if (!disabled) await loadActivityEvents() - loadVisualizations() })() } @@ -292,7 +291,6 @@ export default function Prevent({ .reduce((prev, curr) => ({ ...prev, [curr]: 1 }), {}) setVisualCounts(Object.assign({}, visualizationCount)) setCortex(Object.keys(data).map((x) => x.replace("lamp.dashboard.experimental.", ""))) - setLoading(false) }) } diff --git a/src/components/PreventSelectedActivities.tsx b/src/components/PreventSelectedActivities.tsx index 3b4b4804..5a1b1989 100644 --- a/src/components/PreventSelectedActivities.tsx +++ b/src/components/PreventSelectedActivities.tsx @@ -212,13 +212,29 @@ export const strategies = { "lamp.spin_wheel": (slices, activity, scopedItem) => slices[slices.length - 1]?.type ?? 0, "lamp.jewels_a": (slices, activity, scopedItem) => - (parseInt(slices.score ?? 0).toFixed(1) || 0) > 100 ? 100 : parseInt(slices.score ?? 0).toFixed(1) || 0, + slices.score == "NaN" + ? 0 + : (parseInt(slices.score ?? 0).toFixed(1) || 0) > 100 + ? 100 + : parseInt(slices.score ?? 0).toFixed(1) || 0, "lamp.jewels_b": (slices, activity, scopedItem) => - (parseInt(slices.score ?? 0).toFixed(1) || 0) > 100 ? 100 : parseInt(slices.score ?? 0).toFixed(1) || 0, + slices.score == "NaN" + ? 0 + : (parseInt(slices.score ?? 0).toFixed(1) || 0) > 100 + ? 100 + : parseInt(slices.score ?? 0).toFixed(1) || 0, "lamp.symbol_digit_substitution": (slices, activity, scopedItem) => - (parseInt(slices.score ?? 0).toFixed(1) || 0) > 100 ? 100 : parseInt(slices.score ?? 0).toFixed(1) || 0, + slices.score == "NaN" + ? 0 + : (parseInt(slices.score ?? 0).toFixed(1) || 0) > 100 + ? 100 + : parseInt(slices.score ?? 0).toFixed(1) || 0, "lamp.spatial_span": (slices, activity, scopedItem) => - (parseInt(slices.score ?? 0).toFixed(1) || 0) > 100 ? 100 : parseInt(slices.score ?? 0).toFixed(1) || 0, + slices.score == "NaN" + ? 0 + : (parseInt(slices.score ?? 0).toFixed(1) || 0) > 100 + ? 100 + : parseInt(slices.score ?? 0).toFixed(1) || 0, "lamp.balloon_risk": (slices, activity, scopedItem) => parseInt(slices.points ?? 0).toFixed(1) || 0, "lamp.pop_the_bubbles": (slices, activity, scopedItem) => { let temporalSlices = slices.filter(function (data) { @@ -459,72 +475,74 @@ export default function PreventSelectedActivities({ )} */} - ({ - x: new Date(d.timestamp), - y: strategies[activity.spec] - ? strategies[activity.spec]( - activity.spec === "lamp.survey" || - activity.spec === "lamp.pop_the_bubbles" || - activity.spec === "lamp.maze_game" || - activity.spec === "lamp.emotion_recognition" - ? d?.temporal_slices ?? d["temporal_slices"] - : activity.spec === "lamp.scratch_image" || - activity.spec === "lamp.breathe" || - activity.spec === "lamp.tips" - ? d - : d.static_data, - activity, - undefined - ) - : 0, - })), - }, - width: 300, - height: 70, - background: "#00000000", - config: { - view: { stroke: "transparent" }, - title: { - color: "rgba(0, 0, 0, 0.75)", - fontSize: 25, - font: "Inter", - fontWeight: 600, - align: "left", - anchor: "start", - }, - legend: { - title: null, - orient: "bottom", - columns: 2, - labelColor: "rgba(0, 0, 0, 0.75)", - labelFont: "Inter", - labelFontSize: 14, - labelFontWeight: 600, - symbolStrokeWidth: 12, - symbolSize: 150, - symbolType: "circle", - offset: 0, + {!!activityEvents?.[activity.name] && ( + ({ + x: new Date(d.timestamp), + y: strategies[activity.spec] + ? strategies[activity.spec]( + activity.spec === "lamp.survey" || + activity.spec === "lamp.pop_the_bubbles" || + activity.spec === "lamp.maze_game" || + activity.spec === "lamp.emotion_recognition" + ? d?.temporal_slices ?? d["temporal_slices"] + : activity.spec === "lamp.scratch_image" || + activity.spec === "lamp.breathe" || + activity.spec === "lamp.tips" + ? d + : d.static_data, + activity, + undefined + ) + : 0, + })), }, - axisX: { - disable: true, + width: 300, + height: 70, + background: "#00000000", + config: { + view: { stroke: "transparent" }, + title: { + color: "rgba(0, 0, 0, 0.75)", + fontSize: 25, + font: "Inter", + fontWeight: 600, + align: "left", + anchor: "start", + }, + legend: { + title: null, + orient: "bottom", + columns: 2, + labelColor: "rgba(0, 0, 0, 0.75)", + labelFont: "Inter", + labelFontSize: 14, + labelFontWeight: 600, + symbolStrokeWidth: 12, + symbolSize: 150, + symbolType: "circle", + offset: 0, + }, + axisX: { + disable: true, + }, + axisY: { + disable: true, + }, }, - axisY: { - disable: true, + mark: { type: "line", interpolate: "cardinal", tension: 0.8, color: "#3C5DDD" }, + encoding: { + x: { field: "x", type: "ordinal", timeUnit: "utcyearmonthdate" }, + y: { field: "y", type: "quantitative" }, + strokeWidth: { value: 2 }, }, - }, - mark: { type: "line", interpolate: "cardinal", tension: 0.8, color: "#3C5DDD" }, - encoding: { - x: { field: "x", type: "ordinal", timeUnit: "utcyearmonthdate" }, - y: { field: "y", type: "quantitative" }, - strokeWidth: { value: 2 }, - }, - }} - /> + }} + /> + )} {timeAgo.format(timeSpans[activity.name]?.timestamp)}