Fix conversation duration display; fix insights section ordering; upd…

…ate package versions (#29)
aws-samples · Jun 21, 2024 · 9c9e14d · 9c9e14d
1 parent 5edfd45
commit 9c9e14d
Show file tree

Hide file tree

Showing 5 changed files with 1,982 additions and 1,553 deletions.
diff --git a/package.json b/package.json
@@ -11,53 +11,53 @@
         "type-check": "tsc"
     },
     "dependencies": {
-        "@aws-amplify/ui-react": "^6.1.8",
-        "@aws-sdk/client-comprehendmedical": "^3.556.0",
-        "@aws-sdk/client-polly": "^3.556.0",
-        "@aws-sdk/client-s3": "^3.556.0",
-        "@aws-sdk/client-transcribe": "^3.556.0",
-        "@aws-sdk/lib-storage": "^3.556.0",
-        "@aws-sdk/s3-request-presigner": "^3.556.0",
-        "@cloudscape-design/collection-hooks": "^1.0.45",
-        "@cloudscape-design/components": "^3.0.615",
-        "@cloudscape-design/design-tokens": "^3.0.35",
+        "@aws-amplify/ui-react": "^6.1.12",
+        "@aws-sdk/client-comprehendmedical": "^3.600.0",
+        "@aws-sdk/client-polly": "^3.600.0",
+        "@aws-sdk/client-s3": "^3.600.0",
+        "@aws-sdk/client-transcribe": "^3.600.0",
+        "@aws-sdk/lib-storage": "^3.600.0",
+        "@aws-sdk/s3-request-presigner": "^3.600.0",
+        "@cloudscape-design/collection-hooks": "^1.0.48",
+        "@cloudscape-design/components": "^3.0.664",
+        "@cloudscape-design/design-tokens": "^3.0.38",
         "@cloudscape-design/global-styles": "^1.0.27",
-        "ace-builds": "^1.33.0",
-        "aws-amplify": "^6.0.28",
+        "ace-builds": "^1.35.0",
+        "aws-amplify": "^6.3.7",
         "crunker": "^2.4.0",
-        "dayjs": "^1.11.10",
-        "framer-motion": "^11.1.7",
+        "dayjs": "^1.11.11",
+        "framer-motion": "^11.2.11",
         "lodash": "^4.17.21",
-        "react": "^18.2.0",
+        "react": "^18.3.1",
         "react-ace": "^11.0.1",
-        "react-dom": "^18.2.0",
+        "react-dom": "^18.3.1",
         "react-dropzone": "^14.2.3",
         "react-hot-toast": "^2.4.1",
-        "react-router-dom": "^6.22.3",
+        "react-router-dom": "^6.23.1",
         "timekeeper": "^2.3.1",
-        "use-debounce": "^10.0.0",
+        "use-debounce": "^10.0.1",
         "uuid4": "^2.0.3",
-        "wavesurfer.js": "7.7.11"
+        "wavesurfer.js": "7.7.15"
     },
     "devDependencies": {
         "@trivago/prettier-plugin-sort-imports": "^4.3.0",
-        "@types/lodash": "^4.17.0",
-        "@types/node": "^20.12.7",
-        "@types/react": "^18.2.79",
-        "@types/react-dom": "^18.2.25",
+        "@types/lodash": "^4.17.5",
+        "@types/node": "^20.14.7",
+        "@types/react": "^18.3.3",
+        "@types/react-dom": "^18.3.0",
         "@types/uuid4": "^2.0.3",
         "@types/wavesurfer.js": "^6.0.12",
-        "@typescript-eslint/eslint-plugin": "^7.7.0",
-        "@typescript-eslint/parser": "^7.7.0",
-        "@vitejs/plugin-react": "^4.2.1",
+        "@typescript-eslint/eslint-plugin": "^7.13.1",
+        "@typescript-eslint/parser": "^7.13.1",
+        "@vitejs/plugin-react": "^4.3.1",
         "eslint": "^8.57.0",
         "eslint-config-prettier": "^9.1.0",
         "eslint-plugin-prettier": "^5.1.3",
-        "eslint-plugin-react": "^7.34.1",
+        "eslint-plugin-react": "^7.34.3",
         "pre-commit": "^1.2.2",
-        "prettier": "^3.2.5",
-        "typescript": "^5.4.5",
-        "vite": "^5.2.10",
+        "prettier": "^3.3.2",
+        "typescript": "^5.5.2",
+        "vite": "^5.3.1",
         "vite-plugin-optimize-css-modules": "^1.0.6"
     },
     "pre-commit": "lint",

diff --git a/src/components/Conversation/RightPanel/SummarizedConcepts.tsx b/src/components/Conversation/RightPanel/SummarizedConcepts.tsx
@@ -50,6 +50,13 @@ export default function SummarizedConcepts({
         [sections, extractedHealthData]
     );
 
+    /**
+     * Handles the click event on a summarized segment in the UI.
+     *
+     * @param SummarizedSegment - The text of the summarized segment that was clicked.
+     * @param EvidenceLinks - An array of objects containing the SegmentId for each evidence link associated with the summarized segment.
+     * @returns void
+     */
     function handleSegmentClick(SummarizedSegment: string, EvidenceLinks: { SegmentId: string }[]) {
         let currentIdLocal = currentId;
         if (currentSegment !== SummarizedSegment) {
@@ -89,31 +96,33 @@ export default function SummarizedConcepts({
         }
     }
 
+    const sortedSections = useMemo(() => {
+        return sections.sort(
+            (a, b) => SECTION_ORDER.indexOf(a.SectionName) - SECTION_ORDER.indexOf(b.SectionName) || 1
+        );
+    }, [sections]);
+
     return (
         <>
-            {sections
-                .sort((a, b) => SECTION_ORDER.indexOf(a.SectionName) - SECTION_ORDER.indexOf(b.SectionName) || 1)
-                .map(({ SectionName, Summary }, i) => {
-                    // Match this section name to the Comprehend Medical extracted data. Returns undefined if the section doesn't exist
-                    const sectionExtractedHealthData = sectionsWithExtractedData.find(
-                        (s) => s.SectionName === SectionName
-                    );
-                    return (
-                        <div key={`insightsSection_${i}`}>
-                            <TextContent>
-                                <h3>{toTitleCase(SectionName.replace(/_/g, ' '))}</h3>
-                            </TextContent>
-                            <SummaryListDefault
-                                sectionName={SectionName}
-                                summary={Summary}
-                                summaryExtractedHealthData={sectionExtractedHealthData?.Summary}
-                                acceptableConfidence={acceptableConfidence}
-                                currentSegment={currentSegment}
-                                handleSegmentClick={handleSegmentClick}
-                            />
-                        </div>
-                    );
-                })}
+            {sortedSections.map(({ SectionName, Summary }, i) => {
+                // Match this section name to the Comprehend Medical extracted data. Returns undefined if the section doesn't exist
+                const sectionExtractedHealthData = sectionsWithExtractedData.find((s) => s.SectionName === SectionName);
+                return (
+                    <div key={`insightsSection_${i}`}>
+                        <TextContent>
+                            <h3>{toTitleCase(SectionName.replace(/_/g, ' '))}</h3>
+                        </TextContent>
+                        <SummaryListDefault
+                            sectionName={SectionName}
+                            summary={Summary}
+                            summaryExtractedHealthData={sectionExtractedHealthData?.Summary}
+                            acceptableConfidence={acceptableConfidence}
+                            currentSegment={currentSegment}
+                            handleSegmentClick={handleSegmentClick}
+                        />
+                    </div>
+                );
+            })}
         </>
     );
 }
diff --git a/src/components/Conversation/RightPanel/sectionOrder.ts b/src/components/Conversation/RightPanel/sectionOrder.ts
@@ -1,9 +1,12 @@
 export const SECTION_ORDER = [
-    'CHEF_COMPLIANT',
+    'CHIEF_COMPLIANT',
     'HISTORY_OF_PRESENT_ILLNESS',
-    'REVIEW_OF_SYSTEMS',
     'PAST_MEDICAL_HISTORY',
+    'PAST_FAMILY_HISTORY',
+    'PAST_SOCIAL_HISTORY',
+    'REVIEW_OF_SYSTEMS',
     'PHYSICAL_EXAMINATION',
+    'DIAGNOSTIC_TESTING',
     'ASSESSMENT',
     'PLAN',
 ];
diff --git a/src/components/Conversations/tableColumnDefs.tsx b/src/components/Conversations/tableColumnDefs.tsx
@@ -9,9 +9,12 @@ import StatusIndicator from '@cloudscape-design/components/status-indicator';
 
 import { MedicalScribeJobSummary } from '@aws-sdk/client-transcribe';
 import dayjs from 'dayjs';
+import duration from 'dayjs/plugin/duration';
 
 import toTitleCase from '@/utils/toTitleCase';
 
+dayjs.extend(duration);
+
 function JobName(healthScribeJob: MedicalScribeJobSummary) {
     const navigate = useNavigate();
 
@@ -86,9 +89,9 @@ export const columnDefs = [
         id: 'Duration',
         header: 'Duration',
         cell: (e: MedicalScribeJobSummary) =>
-            Number.isNaN(e.CompletionTime!.getDate() - e.CreationTime!.getDate())
-                ? '-'
-                : Math.ceil(e.CompletionTime!.getDate() - e.CreationTime!.getDate()) || '-',
+            typeof e.CompletionTime?.getTime === 'function' && typeof e.StartTime?.getTime === 'function'
+                ? dayjs.duration(e.CompletionTime!.getTime() - e.CreationTime!.getTime()).format('mm:ss')
+                : '-',
         sortingField: 'Duration',
     },
     {