Merge pull request #71 from helsingborg-stad/feature/os-session-column

Add new column and types for sessions and os-version
helsingborg-stad · Mar 11, 2024 · 56565b4 · 56565b4
2 parents 94734ff + db8a6ad
commit 56565b4
Show file tree

Hide file tree

Showing 6 changed files with 19 additions and 15 deletions.
diff --git a/src/modules/Delivery/components/DeliveryList/ListContent/ListContent.tsx b/src/modules/Delivery/components/DeliveryList/ListContent/ListContent.tsx
@@ -31,9 +31,9 @@ export const ListContent: FC<ListContentProps> = ({ events, resetFilters }) => {
       {
       events.map((event) => (
         <Styled.Container key={event.id}>
-          <Styled.DayColumn>
+          <Styled.Column>
             {getWeekday(event.enteredAt)}
-          </Styled.DayColumn>
+          </Styled.Column>
           <Styled.PlaceColumn>
             {event.name}
             <Styled.SmallLabel>{event.address}</Styled.SmallLabel>
@@ -51,7 +51,8 @@ export const ListContent: FC<ListContentProps> = ({ events, resetFilters }) => {
               </Styled.InfoText>
             </Styled.IconInfo>
           </Styled.TypeColumn>
-          <Styled.TimeOutColumn>{getHourAndMin(event.exitedAt)}</Styled.TimeOutColumn>
+          <Styled.Column>{getHourAndMin(event.enteredAt)}</Styled.Column>
+          <Styled.Column>{getHourAndMin(event.exitedAt)}</Styled.Column>
           <Styled.CarrierColumn>
             {event.distributionOrganisation ? event.distributionOrganisation.name : ''}
             {event.distributionOrganisation?.name && (
@@ -80,8 +81,10 @@ export const ListContent: FC<ListContentProps> = ({ events, resetFilters }) => {
               <Styled.InfoText>{event.organisation.mobileNumber}</Styled.InfoText>
             </Styled.InfoBox>
           </Styled.CarrierColumn>
-          <Styled.AreaColumn>{event.area}</Styled.AreaColumn>
-          <Styled.DateColumn>{getYYYYMMDD(event.enteredAt)}</Styled.DateColumn>
+          <Styled.Column>{event.area}</Styled.Column>
+          <Styled.Column>{getYYYYMMDD(event.enteredAt)}</Styled.Column>
+          <Styled.Column>{event.sessionId}</Styled.Column>
+          <Styled.Column>{event.os}</Styled.Column>
         </Styled.Container>
       ))
       }

diff --git a/src/modules/Delivery/components/DeliveryList/ListContent/styled.ts b/src/modules/Delivery/components/DeliveryList/ListContent/styled.ts
@@ -12,20 +12,14 @@ export const SmallLabel = styled.p`
   font-weight: var(--font-weight-400);
 `;
 
-const Column = styled.div`
+export const Column = styled.div`
   display: flex;
   font-size: var(--font-size-body-xs);
   font-weight: var(--font-weight-400);
   line-height: var(--line-height-xxxs);
   margin: auto 0;
 `;
 
-export const DayColumn = styled(Column)``;
-export const TimeInColumn = styled(Column)``;
-export const TimeOutColumn = styled(Column)``;
-export const AreaColumn = styled(Column)``;
-export const DateColumn = styled(Column)``;
-
 export const PlaceColumn = styled(Column)`
   flex-direction: column;
 `;

diff --git a/src/modules/Delivery/components/DeliveryList/ListHeader/ListHeader.tsx b/src/modules/Delivery/components/DeliveryList/ListHeader/ListHeader.tsx
@@ -5,10 +5,13 @@ export const ListHeader = () => (
     <Styled.Label>Dag</Styled.Label>
     <Styled.Label>Plats</Styled.Label>
     <Styled.Label>Typ</Styled.Label>
-    <Styled.Label>Tid</Styled.Label>
+    <Styled.Label>Tid in</Styled.Label>
+    <Styled.Label>Tid ut</Styled.Label>
     <Styled.Label>Leverantör</Styled.Label>
     <Styled.Label>Transportör</Styled.Label>
     <Styled.Label>Område</Styled.Label>
     <Styled.Label>Datum</Styled.Label>
+    <Styled.Label>Session</Styled.Label>
+    <Styled.Label>Plattform/OS-version</Styled.Label>
   </Styled.Container>
 );
diff --git a/src/modules/Delivery/components/DeliveryList/styled.ts b/src/modules/Delivery/components/DeliveryList/styled.ts
@@ -2,7 +2,6 @@ import styled from 'styled-components';
 
 export const Container = styled.div`
   width: 100%;
-  max-width: 1300px;
 `;
 
 export const ErrorContainer = styled.div`

diff --git a/src/modules/Delivery/layouts/TableGrid/TableGrid.tsx b/src/modules/Delivery/layouts/TableGrid/TableGrid.tsx
@@ -8,6 +8,9 @@ export const tableGrid = css`
     minmax(180px, 1fr) 
     minmax(60px, 1fr) 
     minmax(80px, 1fr) 
+    minmax(80px, 1fr) 
+    minmax(120px, 1fr)
+    minmax(120px, 1fr)
     minmax(120px, 1fr)
     minmax(120px, 1fr)
     minmax(120px, 1fr)

diff --git a/src/types/event.ts b/src/types/event.ts
@@ -2,8 +2,10 @@ import { ZoneType } from './zone';
 import { Organisation } from './organisation';
 
 export type Event = {
-  trackingId: string;
   id: string;
+  sessionId: string;
+  deviceId: string | null;
+  os: string | null;
   organisation: Organisation;
   distributionOrganisation: Organisation | null;
   zoneType: ZoneType;