formatting issue fix (#33)

Co-authored-by: orbelyan.suren <[email protected]>
BeverCRM · Apr 27, 2023 · c5d6e8f · c5d6e8f
1 parent cff7df0
commit c5d6e8f
Show file tree

Hide file tree

Showing 5 changed files with 20 additions and 16 deletions.
diff --git a/ScheduleBoard/components/DailyView.tsx b/ScheduleBoard/components/DailyView.tsx
@@ -144,12 +144,8 @@ export const DailyView: React.FC<IDailyView> = props => {
                             content={
                               <ul style={{ listStyleType: 'none', padding: 0 }}>
                                 <li>{booking.name}</li>
-                                <li>{new Date(booking.start).toLocaleTimeString([],
-                                  { year: 'numeric', month: 'numeric', day: 'numeric',
-                                    hour: '2-digit', minute: '2-digit' })}</li>
-                                <li>{new Date(booking.end).toLocaleTimeString([],
-                                  { year: 'numeric', month: 'numeric', day: 'numeric',
-                                    hour: '2-digit', minute: '2-digit' })}</li>
+                                <li>{booking.formattedStart}</li>
+                                <li>{booking.formattedEnd}</li>
                               </ul>
                             }
                             background={booking.color}

diff --git a/ScheduleBoard/components/MonthlyView.tsx b/ScheduleBoard/components/MonthlyView.tsx
@@ -121,12 +121,8 @@ export const MonthlyView: React.FC<IMonthlyView> = props => {
                                   content={
                                     <ul style={{ listStyleType: 'none', padding: 0 }}>
                                       <li>{booking.name}</li>
-                                      <li>{new Date(booking.start).toLocaleTimeString([],
-                                        { year: 'numeric', month: 'numeric', day: 'numeric',
-                                          hour: '2-digit', minute: '2-digit' })}</li>
-                                      <li>{new Date(booking.end).toLocaleTimeString([],
-                                        { year: 'numeric', month: 'numeric', day: 'numeric',
-                                          hour: '2-digit', minute: '2-digit' })}</li>
+                                      <li>{booking.formattedStart}</li>
+                                      <li>{booking.formattedEnd}</li>
                                     </ul>
                                   }
 

diff --git a/ScheduleBoard/index.ts b/ScheduleBoard/index.ts
@@ -43,7 +43,7 @@ implements ComponentFramework.ReactControl<IInputs, IOutputs> {
     }
     else {
       const { records } = context.parameters.DataSet;
-      fetchRecords(records, this._store);
+      fetchRecords(records, this._store, context);
     }
     return React.createElement(ScheduleBoard, { _service: this._dataverseService,
       store: this._store,

diff --git a/ScheduleBoard/store/services.ts b/ScheduleBoard/store/services.ts
@@ -1,6 +1,7 @@
 import { getValidColor } from '../utilities/utilities';
 import { setRecords, setRecordFieldSchemaNames } from './store';
 import { Booking, SchemaNames, Store } from '../utilities/types';
+import { IInputs } from '../generated/ManifestTypes';
 
 export function fetchRecordFieldSchemaNames(inputSchemaNames: (string | null)[], store: Store) {
   const schemaNames: SchemaNames = {
@@ -43,7 +44,8 @@ type InputRecords = {
   [id: string]: ComponentFramework.PropertyHelper.DataSetApi.EntityRecord;
 }
 
-export function fetchRecords(inputRecords: InputRecords, store: Store) {
+export function fetchRecords(inputRecords: InputRecords, store: Store,
+  context: ComponentFramework.Context<IInputs>) {
   const data: Booking[] = [];
   const schemaNames = store.getState().recordFieldSchemaNames;
   for (const ID in inputRecords) {
@@ -52,8 +54,16 @@ export function fetchRecords(inputRecords: InputRecords, store: Store) {
     const item: Booking = {
       id: ID,
       name: <string>record.getValue(schemaNames.name),
-      start: new Date(<string>(record.getFormattedValue(schemaNames.startDate))).getTime(),
-      end: new Date(<string>(record.getFormattedValue(schemaNames.endDate))).getTime(),
+      // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+      // @ts-ignore
+      start: context.formatting.formatUTCDateTimeToUserDate(record.getValue(schemaNames.startDate))
+        .getTime(),
+      // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+      // @ts-ignore
+      end: context.formatting.formatUTCDateTimeToUserDate(record.getValue(schemaNames.endDate))
+        .getTime(),
+      formattedStart: record.getFormattedValue(schemaNames.startDate),
+      formattedEnd: record.getFormattedValue(schemaNames.endDate),
       color,
       index: -1,
     };

diff --git a/ScheduleBoard/utilities/types.ts b/ScheduleBoard/utilities/types.ts
@@ -17,6 +17,8 @@ export type Booking = {
   name: string;
   start: number;
   end: number;
+  formattedStart: string;
+  formattedEnd: string;
   color: string;
   index: number;
 };