Merge pull request #635 from mapswipe/fix/date-seconds-reset

Manually set hours, minutes, seconds and milliseconds to zero
mapswipe · Jan 16, 2023 · 03dc36f · 03dc36f
2 parents 9c2e001 + eaf18e8
commit 03dc36f
Show file tree

Hide file tree

Showing 10 changed files with 112 additions and 57 deletions.
diff --git a/community-dashboard/app/Base/utils/temporal.ts b/community-dashboard/app/Base/utils/temporal.ts
@@ -12,7 +12,10 @@ export function resolveTime(date: Date | number | string, resolution: 'day' | 'm
     const newDate = getDateSafe(date);
 
     if (resolution === 'day' || resolution === 'month' || resolution === 'year') {
-        newDate.setUTCHours(0, 0, 0, 0);
+        newDate.setHours(0);
+        newDate.setMinutes(0);
+        newDate.setSeconds(0);
+        newDate.setMilliseconds(0);
     }
     if (resolution === 'month' || resolution === 'year') {
         newDate.setDate(1);
@@ -45,7 +48,10 @@ export function getTimestamps(
         } else {
             myDate.setDate(sanitizedStartDate.getDate() + increment);
         }
-        myDate.setUTCHours(0, 0, 0, 0);
+        myDate.setHours(0);
+        myDate.setMinutes(0);
+        myDate.setSeconds(0);
+        myDate.setMilliseconds(0);
 
         if (myDate > sanitizedEndDate) {
             break;

diff --git a/community-dashboard/app/components/CalendarHeatMapContainer/index.tsx b/community-dashboard/app/components/CalendarHeatMapContainer/index.tsx
@@ -85,22 +85,29 @@ function CalendarHeatMapContainer(props: Props) {
             label="Contributions"
             variant="stat"
             className={styles.chartContainer}
+            contentClassName={styles.content}
         >
-            <CalendarHeatmap
-                startDate={range.startDate}
-                endDate={range.endDate}
-                values={data ?? []}
-                classForValue={getClassForValue}
-                tooltipDataAttrs={(value: { date?: string, count?: string }) => {
-                    if (value?.count && value?.date) {
-                        return { 'data-tip': `${value?.count} swipes on ${value?.date}` };
-                    }
-                    return undefined;
-                }}
-                showWeekdayLabels
-            />
+            <div className={styles.calendar}>
+                <CalendarHeatmap
+                    startDate={range.startDate}
+                    endDate={range.endDate}
+                    values={data ?? []}
+                    classForValue={getClassForValue}
+                    tooltipDataAttrs={(value: { date?: string, count?: string }) => {
+                        if (value?.count && value?.date) {
+                            return { 'data-tip': `${value?.count} swipes on ${value?.date}` };
+                        }
+                        return undefined;
+                    }}
+                    showWeekdayLabels
+                    showMonthLabels
+                    showOutOfRangeDays
+                />
+            </div>
             <div className={styles.heatMapLegend}>
-                <div>Low Contribution</div>
+                <div>
+                    Low Contribution
+                </div>
                 <svg
                     width="90"
                     height="15"
@@ -133,7 +140,9 @@ function CalendarHeatMapContainer(props: Props) {
                         );
                     })}
                 </svg>
-                <div>High Contribution</div>
+                <div>
+                    High Contribution
+                </div>
             </div>
             <ReactTooltip />
         </InformationCard>

diff --git a/community-dashboard/app/components/CalendarHeatMapContainer/styles.css b/community-dashboard/app/components/CalendarHeatMapContainer/styles.css
@@ -2,14 +2,35 @@
     display: flex;
     flex-grow: 1;
 
-    .heat-map-legend {
+    .content {
         display: flex;
-        gap: var(--spacing-small);
-        align-items: center;
-        justify-content: flex-end;
+        flex-direction: column;
+        gap: var(--spacing-medium);
+
+        .calendar {
+            overflow-x: hidden;
+            overflow-y: hidden;
+
+            &:hover {
+                overflow-x: auto;
+            }
+        }
+
+        .heat-map-legend {
+            display: flex;
+            gap: var(--spacing-small);
+            align-items: center;
+            justify-content: flex-end;
+        }
     }
 
+
     :global {
+        .react-calendar-heatmap {
+            margin-bottom: -2.4rem;
+            min-height: 10rem;
+        }
+
         .react-calendar-heatmap text {
             font-size: var(--font-size-extra-small);
             fill: var(--color-text);

diff --git a/community-dashboard/app/components/InformationCard/styles.css b/community-dashboard/app/components/InformationCard/styles.css
@@ -80,6 +80,9 @@
         }
 
         .value-container {
+            display: flex;
+            align-items: baseline;
+            justify-content: space-between;
             color: var(--color-primary);
             font-size: var(--font-size-super-large);
             font-weight: var(--font-weight-bold);

diff --git a/community-dashboard/app/components/SelectInput/SearchSelectInput.tsx b/community-dashboard/app/components/SelectInput/SearchSelectInput.tsx
@@ -32,7 +32,11 @@ function Option(props: OptionProps) {
     );
 }
 
-type Def = { containerClassName?: string, title?: string };
+type Def = {
+    containerClassName?: string,
+    children?: React.ReactNode,
+    title?: string,
+};
 type OptionKey = string | number;
 
 export type SearchSelectInputProps<
@@ -41,7 +45,7 @@ export type SearchSelectInputProps<
     O extends object, // eslint-disable-line
     P extends Def,
     OMISSION extends string,
-    > = Omit<{
+> = Omit<{
         value: T | undefined | null;
         options: O[] | undefined | null;
         searchOptions?: O[] | undefined | null;
@@ -55,7 +59,7 @@ export type SearchSelectInputProps<
         onSearchValueChange?: (value: string) => void;
         onShowDropdownChange?: (value: boolean) => void;
         optionRenderer?: (props: Pick<P, Exclude<keyof P, 'containerClassName' | 'title'>>) => React.ReactNode;
-        optionRendererParams?: (optionKey: OptionKey, option: O) => P;
+        optionRendererParams?: (optionKey: T, option: O) => P;
     }, OMISSION> & (
         SelectInputContainerProps<T, K, O, P,
             'name'
@@ -218,7 +222,7 @@ function SearchSelectInput<
     );
 
     const optionRendererParamsDefault = useCallback(
-        (key: OptionKey, option: O) => {
+        (key: T, option: O) => {
             const isActive = key === value;
 
             return {

diff --git a/community-dashboard/app/views/StatsBoard/index.tsx b/community-dashboard/app/views/StatsBoard/index.tsx
@@ -601,23 +601,20 @@ function StatsBoard(props: Props) {
                 </InformationCard>
                 <div className={styles.statsCardContainer}>
                     <InformationCard
-                        icon={(<img src={areaSvg} alt="user icon" />)}
-                        value={(
-                            <NumberOutput
-                                className={styles.numberOutput}
-                                value={buildAreaTotalSwipes}
-                                normal
-                                invalidText={0}
+                        icon={(
+                            <img
+                                src={areaSvg}
+                                alt="user icon"
                             />
                         )}
-                        label={(
-                            <div className={styles.infoLabel}>
-                                Area Reviewed
-                            </div>
-                        )}
-                        subHeading={(
+                        value={(
                             <>
-                                Build Area
+                                <NumberOutput
+                                    className={styles.numberOutput}
+                                    value={buildAreaTotalSwipes}
+                                    normal
+                                    invalidText={0}
+                                />
                                 <NumberOutput
                                     className={styles.areaOutput}
                                     value={buildAreaTotalArea}
@@ -627,10 +624,21 @@ function StatsBoard(props: Props) {
                                 />
                             </>
                         )}
+                        label={(
+                            <div className={styles.infoLabel}>
+                                Area Swipes
+                            </div>
+                        )}
+                        subHeading="Build Area"
                         variant="stat"
                     />
                     <InformationCard
-                        icon={(<img src={featureSvg} alt="group icon" />)}
+                        icon={(
+                            <img
+                                src={featureSvg}
+                                alt="group icon"
+                            />
+                        )}
                         value={(
                             <NumberOutput
                                 className={styles.numberOutput}
@@ -648,23 +656,20 @@ function StatsBoard(props: Props) {
                         variant="stat"
                     />
                     <InformationCard
-                        icon={(<img src={sceneSvg} alt="swipe icon" />)}
-                        value={(
-                            <NumberOutput
-                                className={styles.numberOutput}
-                                value={changeDetectionTotalSwipes}
-                                normal
-                                invalidText={0}
+                        icon={(
+                            <img
+                                src={sceneSvg}
+                                alt="swipe icon"
                             />
                         )}
-                        label={(
-                            <div className={styles.infoLabel}>
-                                Scene Comparision
-                            </div>
-                        )}
-                        subHeading={(
+                        value={(
                             <>
-                                Change Detection
+                                <NumberOutput
+                                    className={styles.numberOutput}
+                                    value={changeDetectionTotalSwipes}
+                                    normal
+                                    invalidText={0}
+                                />
                                 <NumberOutput
                                     className={styles.areaOutput}
                                     value={changeDetectionTotalArea}
@@ -674,6 +679,12 @@ function StatsBoard(props: Props) {
                                 />
                             </>
                         )}
+                        label={(
+                            <div className={styles.infoLabel}>
+                                Scene Compared
+                            </div>
+                        )}
+                        subHeading="Change Detection"
                         variant="stat"
                     />
                 </div>

diff --git a/community-dashboard/app/views/StatsBoard/styles.css b/community-dashboard/app/views/StatsBoard/styles.css
@@ -182,6 +182,7 @@
         justify-content: flex-end;
         color: var(--color-text-light);
         font-size: var(--font-size-small);
+        font-weight: var(--font-weight-medium);
     }
 
     .info-label {

diff --git a/community-dashboard/app/views/UserGroupDashboard/index.tsx b/community-dashboard/app/views/UserGroupDashboard/index.tsx
@@ -280,7 +280,7 @@ function UserGroupDashboard(props: Props) {
                         <Button
                             disabled={userGroupStatsDownloadLoading}
                             onClick={getUserGroupStatsDownload}
-                            name="export"
+                            name={undefined}
                         >
                             { userGroupStatsDownloadLoading ? 'Exporting' : 'Export' }
                         </Button>

diff --git a/django/apps/existing_database/query.py b/django/apps/existing_database/query.py
@@ -155,7 +155,7 @@ async def organization_type_stats(self) -> list[OrganizationSwipeStatsType]:
         )
         return [
             OrganizationSwipeStatsType(
-                organization_name=organization or "N/A",
+                organization_name=organization or "MapSwipe",
                 total_swipes=swipes_sum,
             )
             async for organization, swipes_sum in qs

diff --git a/django/apps/existing_database/types.py b/django/apps/existing_database/types.py
@@ -225,7 +225,7 @@ async def swipe_by_organization_name(self) -> list[OrganizationSwipeStatsType]:
         )
         return [
             OrganizationSwipeStatsType(
-                organization_name=organization_name or "N/A",
+                organization_name=organization_name or "MapSwipe",
                 total_swipes=total_swipes,
             )
             async for organization_name, total_swipes in qs