React Animal History - Search By Id

ehr/resources/queries/study/aliasIdMatches.sql

@@ -0,0 +1,9 @@
+
+SELECT
+    a.Id as resolvedId,
+    a.alias as inputId,
+    'alias' as resolvedBy,
+    a.category as aliasType,
+    LOWER(a.alias) as lowerAliasForMatching
+FROM study.alias a
+INNER JOIN study.demographics d ON a.Id = d.Id

ehr/resources/queries/study/directIdMatches.sql

@@ -0,0 +1,8 @@
+
+SELECT
+    Id as resolvedId,
+    Id as inputId,
+    'direct' as resolvedBy,
+    NULL as aliasType,
+    LOWER(Id) as lowerIdForMatching
+FROM study.demographics

labkey-ui-ehr/.gitignore

@@ -1,2 +1,3 @@
 /node_modules
-/dist
+/dist
+/coverage

labkey-ui-ehr/README.md

@@ -24,11 +24,31 @@ To install using npm
 ```
 npm install @labkey/ehr
 ```
-You can then import `@labkey/ehr` in your application as follows:
+
+## Usage
+
+### ParticipantHistory Module
+
+The `participanthistory` export provides the `ParticipantReports` component for displaying animal history data with search, filtering, and reporting capabilities.
+
 ```js
-import { TestComponent } from '@labkey/ehr';
+import { ParticipantReports } from '@labkey/ehr/participanthistory';
+
+export const AnimalHistoryPage = () => {
+    return (
+        <div>
+            <ParticipantReports />
+        </div>
+    );
+};
 ```
 
+**Features:**
+- Multi-mode filtering (ID Search, All Animals, Alive at Center, URL Params)
+- ID and alias resolution
+- Tabbed report interface with category grouping
+- URL-based state persistence for shareable links
+
 ## Development
 
 ### Getting Started

labkey-ui-ehr/jest.config.js

@@ -51,4 +51,7 @@ module.exports = {
     transformIgnorePatterns: [
         'node_modules/(?!(lib0|y-protocols))'
     ],
+    moduleNameMapper: {
+        '\\.(css|scss|sass)$': '<rootDir>/src/test/styleMock.js'
+    },
 };

labkey-ui-ehr/package.json

@@ -31,6 +31,7 @@
     "prepublishOnly": "npm install --legacy-peer-deps && cross-env WEBPACK_STATS=errors-only npm run build",
     "test": "cross-env NODE_ENV=test jest --maxWorkers=6 --silent",
     "test-ci": "cross-env NODE_ENV=test jest --ci --silent",
+    "test-coverage": "cross-env NODE_ENV=test jest --maxWorkers=6 --coverage",
     "lint": "npx eslint",
     "lint-fix": "npx eslint --fix",
     "lint-precommit": "node lint.diff.mjs",

labkey-ui-ehr/src/ParticipantHistory/ParticipantReports.test.tsx

@@ -36,12 +36,22 @@ const mockExt4Container = {
     },
 };
 
-// Mock LABKEY.WebPart for OtherReportWrapper
+// Mock LABKEY API for OtherReportWrapper and ParticipantReports
+const mockSelectRows = jest.fn();
 (global as any).LABKEY = {
     ...(global as any).LABKEY,
     WebPart: jest.fn().mockImplementation(() => ({
         render: jest.fn(),
     })),
+    Query: {
+        selectRows: mockSelectRows,
+    },
+    Filter: {
+        create: jest.fn((field, value, type) => ({ field, value, type })),
+        Types: {
+            EQUAL: 'EQUAL',
+        },
+    },
 };
 
 describe('ParticipantReports', () => {
@@ -52,6 +62,15 @@ describe('ParticipantReports', () => {
         jest.clearAllMocks();
         mockExt4Container.isDestroyed = false;
 
+        // Mock LABKEY.Query.selectRows with default behavior (returns supportsnonidfilters: true)
+        mockSelectRows.mockImplementation((config: any) => {
+            if (config.success) {
+                config.success({
+                    rows: [{ supportsnonidfilters: true }],
+                });
+            }
+        });
+
         // Save and reset document.location.hash and search before each test
         originalHash = window.location.hash;
         originalSearch = window.location.search;
@@ -275,4 +294,252 @@ describe('ParticipantReports', () => {
             expect(screen.getByText('Loading reports...')).toBeVisible();
         });
     });
+
+    describe('Search By Id integration', () => {
+        describe('initial filter type from URL', () => {
+            test('initializes with ID Search mode when filterType:idSearch in hash', () => {
+                window.location.hash = '#filterType:idSearch&subjects:ID123%3BID456';
+
+                renderWithServerContext(<ParticipantReports />, defaultServerContext());
+
+                // Component should render with subjects from hash
+                expect(screen.getByText('Loading reports...')).toBeVisible();
+            });
+
+            test('initializes with All Records mode when filterType:all in hash', () => {
+                window.location.hash = '#filterType:all';
+
+                renderWithServerContext(<ParticipantReports />, defaultServerContext());
+
+                expect(screen.getByText('Loading reports...')).toBeVisible();
+            });
+
+            test('initializes with Alive at Center mode when filterType:aliveAtCenter in hash', () => {
+                window.location.hash = '#filterType:aliveAtCenter';
+
+                renderWithServerContext(<ParticipantReports />, defaultServerContext());
+
+                expect(screen.getByText('Loading reports...')).toBeVisible();
+            });
+
+            test('defaults to ID Search mode when no filterType in hash', () => {
+                window.location.hash = '';
+
+                renderWithServerContext(<ParticipantReports />, defaultServerContext());
+
+                expect(screen.getByText('Loading reports...')).toBeVisible();
+            });
+        });
+
+        describe('URL Params mode (readOnly)', () => {
+            test('activates URL Params mode when readOnly:true in URL with subjects', () => {
+                window.location.hash = '#subjects:ID123%3BID456&readOnly:true';
+
+                renderWithServerContext(<ParticipantReports />, defaultServerContext());
+
+                // Component should render in URL Params mode
+                expect(screen.getByText('Loading reports...')).toBeVisible();
+            });
+
+            test('ignores readOnly:true when no subjects in URL', () => {
+                window.location.hash = '#readOnly:true';
+
+                renderWithServerContext(<ParticipantReports />, defaultServerContext());
+
+                // Should default to a safe mode (likely All Records or ID Search)
+                expect(screen.getByText('Loading reports...')).toBeVisible();
+            });
+
+            test('readOnly parameter takes priority over filterType parameter', () => {
+                window.location.hash = '#filterType:all&subjects:ID123&readOnly:true';
+
+                renderWithServerContext(<ParticipantReports />, defaultServerContext());
+
+                // Should use URL Params mode, not All Records mode
+                expect(screen.getByText('Loading reports...')).toBeVisible();
+            });
+        });
+
+        describe('filter state management', () => {
+            test('manages subjects state from URL hash', () => {
+                window.location.hash = '#subjects:ID123%3BID456%3BID789';
+
+                renderWithServerContext(<ParticipantReports />, defaultServerContext());
+
+                // Verify component renders with subjects
+                expect(screen.getByText('Loading reports...')).toBeVisible();
+            });
+
+            test('manages filterType state from URL hash', () => {
+                window.location.hash = '#filterType:aliveAtCenter';
+
+                renderWithServerContext(<ParticipantReports />, defaultServerContext());
+
+                expect(screen.getByText('Loading reports...')).toBeVisible();
+            });
+        });
+
+        describe('URL hash updates', () => {
+            test('updates URL hash when filter mode changes', () => {
+                window.location.hash = '';
+
+                renderWithServerContext(<ParticipantReports />, defaultServerContext());
+
+                // After component mounts, simulate filter change
+                // Note: This would require exposing handleFilterChange or testing through UI interaction
+                expect(screen.getByText('Loading reports...')).toBeVisible();
+            });
+
+            test('includes subjects in URL hash for ID Search mode', () => {
+                window.location.hash = '#filterType:idSearch&subjects:ID123%3BID456';
+
+                renderWithServerContext(<ParticipantReports />, defaultServerContext());
+
+                expect(window.location.hash).toContain('subjects:');
+            });
+
+            test('removes subjects from URL hash for All Records mode', () => {
+                window.location.hash = '#filterType:all';
+
+                renderWithServerContext(<ParticipantReports />, defaultServerContext());
+
+                expect(window.location.hash).not.toContain('subjects:');
+            });
+
+            test('removes readOnly parameter when switching from URL Params to ID Search', () => {
+                window.location.hash = '#subjects:ID123&readOnly:true';
+
+                renderWithServerContext(<ParticipantReports />, defaultServerContext());
+
+                // Component should be in URL Params mode initially
+                // After switching to ID Search (would require UI interaction), readOnly should be removed
+                expect(screen.getByText('Loading reports...')).toBeVisible();
+            });
+        });
+
+        describe('activeReportSupportsNonIdFilters query', () => {
+            test('queries report metadata for supportsNonIdFilters field', () => {
+                window.location.hash = '#activeReport:test-report';
+
+                renderWithServerContext(<ParticipantReports />, defaultServerContext());
+
+                // Component should query ehr.reports for the active report's metadata
+                expect(screen.getByText('Loading reports...')).toBeVisible();
+            });
+
+            test('updates activeReportSupportsNonIdFilters when switching report tabs', () => {
+                window.location.hash = '#activeReport:report1';
+
+                renderWithServerContext(<ParticipantReports />, defaultServerContext());
+
+                // After switching to different report tab, should re-query metadata
+                expect(screen.getByText('Loading reports...')).toBeVisible();
+            });
+
+            test('defaults to false when no active report selected', () => {
+                window.location.hash = '';
+
+                renderWithServerContext(<ParticipantReports />, defaultServerContext());
+
+                // Should handle no active report gracefully
+                expect(screen.getByText('Loading reports...')).toBeVisible();
+            });
+        });
+
+        describe('race conditions', () => {
+            test('handles rapid filter mode changes before state updates', () => {
+                window.location.hash = '';
+
+                renderWithServerContext(<ParticipantReports />, defaultServerContext());
+
+                // Simulate rapid filter changes
+                // This would require UI interaction or exposing handleFilterChange
+                expect(screen.getByText('Loading reports...')).toBeVisible();
+            });
+        });
+
+        describe('malformed URL hash', () => {
+            test('handles malformed URL hash gracefully', () => {
+                window.location.hash = '#malformed&invalid::data';
+
+                renderWithServerContext(<ParticipantReports />, defaultServerContext());
+
+                // Should fall back to default state without crashing
+                expect(screen.getByText('Loading reports...')).toBeVisible();
+            });
+
+            test('handles URL hash with missing values', () => {
+                window.location.hash = '#filterType:&subjects:';
+
+                renderWithServerContext(<ParticipantReports />, defaultServerContext());
+
+                // Should handle empty values gracefully
+                expect(screen.getByText('Loading reports...')).toBeVisible();
+            });
+        });
+
+        describe('filter integration with TabbedReportPanel', () => {
+            test('passes filters prop to TabbedReportPanel', () => {
+                window.location.hash = '#filterType:idSearch&subjects:ID123';
+
+                renderWithServerContext(<ParticipantReports />, defaultServerContext());
+
+                // TabbedReportPanel should receive filters prop with filterType and subjects
+                expect(screen.getByText('Loading reports...')).toBeVisible();
+            });
+
+            test('passes undefined subjects for All Records mode', () => {
+                window.location.hash = '#filterType:all';
+
+                renderWithServerContext(<ParticipantReports />, defaultServerContext());
+
+                // filters.subjects should be undefined for All Records
+                expect(screen.getByText('Loading reports...')).toBeVisible();
+            });
+
+            test('passes subjects for URL Params mode', () => {
+                window.location.hash = '#subjects:ID123&readOnly:true';
+
+                renderWithServerContext(<ParticipantReports />, defaultServerContext());
+
+                // filters.subjects should be populated for URL Params mode
+                expect(screen.getByText('Loading reports...')).toBeVisible();
+            });
+        });
+
+        describe('LABKEY query error handling', () => {
+            test('handles LABKEY query failure gracefully', () => {
+                // Mock the selectRows to call the failure callback
+                mockSelectRows.mockImplementationOnce((config: any) => {
+                    if (config.failure) {
+                        config.failure({ message: 'Query failed' });
+                    }
+                });
+
+                window.location.hash = '#activeReport:demographics';
+
+                renderWithServerContext(<ParticipantReports />, defaultServerContext());
+
+                // Component should render without crashing despite the query failure
+                // The error will be logged to console but shouldn't break the UI
+                expect(screen.queryByText('Loading reports...')).toBeInTheDocument();
+            });
+
+            test('defaults to supporting all filters when report metadata not found', () => {
+                // Mock the selectRows to return empty rows
+                mockSelectRows.mockImplementationOnce((config: any) => {
+                    if (config.success) {
+                        config.success({ rows: [] });
+                    }
+                });
+
+                window.location.hash = '#activeReport:nonexistent';
+
+                renderWithServerContext(<ParticipantReports />, defaultServerContext());
+
+                // Component should render with default behavior (all filters supported)
+                expect(screen.queryByText('Loading reports...')).toBeInTheDocument();
+            });
+        });
+    });
 });