Merge branch 'feature/create-main-components-and-layout' into feature…

…/create-performance-overview-table
EyeSeeTea · Jul 8, 2024 · 0520e0d · 0520e0d
2 parents c01d60e + 2433a0b
commit 0520e0d
Show file tree

Hide file tree

Showing 41 changed files with 473 additions and 690 deletions.
diff --git a/i18n/en.pot b/i18n/en.pot
@@ -5,8 +5,8 @@ msgstr ""
 "Content-Type: text/plain; charset=utf-8\n"
 "Content-Transfer-Encoding: 8bit\n"
 "Plural-Forms: nplurals=2; plural=(n != 1)\n"
-"POT-Creation-Date: 2024-07-03T10:20:12.524Z\n"
-"PO-Revision-Date: 2024-07-03T10:20:12.524Z\n"
+"POT-Creation-Date: 2024-07-04T13:31:07.802Z\n"
+"PO-Revision-Date: 2024-07-04T13:31:07.802Z\n"
 
 msgid "Add new option"
 msgstr ""
@@ -23,9 +23,6 @@ msgstr ""
 msgid "Create Event"
 msgstr ""
 
-msgid "N/A"
-msgstr ""
-
 msgid "Close"
 msgstr ""
 
@@ -35,70 +32,22 @@ msgstr ""
 msgid "Last updated: "
 msgstr ""
 
-msgid "Incident Management Team Builder"
-msgstr ""
-
-msgid "Cholera in NW Province, June 2023"
-msgstr ""
-
-msgid "Incident Action Plan"
-msgstr ""
-
-msgid "Create Risk Assessment"
-msgstr ""
-
 msgid "Dashboard"
 msgstr ""
 
 msgid "Respond, alert, watch"
 msgstr ""
 
-msgid "All public health events"
-msgstr ""
-
-msgid "7-1-7 performance"
-msgstr ""
-
-msgid "Performance overview"
-msgstr ""
-
 msgid "Event Tracker"
 msgstr ""
 
-msgid "Edit Details"
-msgstr ""
-
-msgid "Districts affected"
-msgstr ""
-
-msgid "Overview"
-msgstr ""
-
-msgid "Risk Assessment"
-msgstr ""
-
-msgid "Risk assessment incomplete"
-msgstr ""
-
-msgid "Risks associated with this event have not yet been assessed."
-msgstr ""
-
-msgid "Response actions"
-msgstr ""
-
-msgid "Edit Response Actions"
-msgstr ""
-
-msgid "Action plan"
-msgstr ""
-
-msgid "Edit Action Plan"
+msgid "Incident Action Plan"
 msgstr ""
 
-msgid "Team"
+msgid "Cholera in NW Province, June 2023"
 msgstr ""
 
-msgid "Edit Team"
+msgid "Incident Management Team Builder"
 msgstr ""
 
 msgid "Resources"

diff --git a/i18n/es.po b/i18n/es.po
@@ -1,7 +1,7 @@
 msgid ""
 msgstr ""
 "Project-Id-Version: i18next-conv\n"
-"POT-Creation-Date: 2024-07-03T10:20:12.524Z\n"
+"POT-Creation-Date: 2024-07-04T13:31:07.802Z\n"
 "PO-Revision-Date: 2018-10-25T09:02:35.143Z\n"
 "MIME-Version: 1.0\n"
 "Content-Type: text/plain; charset=UTF-8\n"
@@ -23,9 +23,6 @@ msgstr ""
 msgid "Create Event"
 msgstr ""
 
-msgid "N/A"
-msgstr ""
-
 msgid "Close"
 msgstr ""
 
@@ -35,86 +32,23 @@ msgstr ""
 msgid "Last updated: "
 msgstr ""
 
-msgid "Incident Management Team Builder"
-msgstr ""
-
-msgid "Cholera in NW Province, June 2023"
-msgstr ""
-
-msgid "Incident Action Plan"
-msgstr ""
-
-msgid "Create Risk Assessment"
-msgstr ""
-
 msgid "Dashboard"
 msgstr ""
 
 msgid "Respond, alert, watch"
 msgstr ""
 
-msgid "All public health events"
-msgstr ""
-
-msgid "7-1-7 performance"
-msgstr ""
-
-msgid "Performance overview"
-msgstr ""
-
 msgid "Event Tracker"
 msgstr ""
 
-msgid "Edit Details"
-msgstr ""
-
-msgid "Districts affected"
-msgstr ""
-
-msgid "Overview"
-msgstr ""
-
-msgid "Risk Assessment"
-msgstr ""
-
-msgid "Risk assessment incomplete"
-msgstr ""
-
-msgid "Risks associated with this event have not yet been assessed."
-msgstr ""
-
-msgid "Response actions"
-msgstr ""
-
-msgid "Edit Response Actions"
-msgstr ""
-
-msgid "Action plan"
-msgstr ""
-
-msgid "Edit Action Plan"
+msgid "Incident Action Plan"
 msgstr ""
 
-msgid "Team"
+msgid "Cholera in NW Province, June 2023"
 msgstr ""
 
-msgid "Edit Team"
+msgid "Incident Management Team Builder"
 msgstr ""
 
 msgid "Resources"
 msgstr ""
-
-#~ msgid "Add"
-#~ msgstr "Añadir"
-
-#~ msgid "List"
-#~ msgstr "Listar"
-
-#~ msgid "Back"
-#~ msgstr "Volver"
-
-#~ msgid "Help"
-#~ msgstr "Ayuda"
-
-#~ msgid "Hello {{name}}"
-#~ msgstr "Hola {{name}}"
diff --git a/package.json b/package.json
@@ -30,7 +30,6 @@
         "d2": "31.10.2",
         "d2-manifest": "1.0.0",
         "font-awesome": "4.7.0",
-        "lodash": "^4.17.21",
         "purify-ts": "1.2.0",
         "purify-ts-extra-codec": "0.6.0",
         "react": "^18.2.0",
@@ -50,7 +49,6 @@
         "@testing-library/react": "^14.0.0",
         "@types/classnames": "2.3.1",
         "@types/isomorphic-fetch": "^0.0.36",
-        "@types/lodash": "^4.17.5",
         "@types/material-ui": "^0.21.12",
         "@types/node": "18",
         "@types/node-localstorage": "^1.3.0",

diff --git a/src/webapp/components/add-new-option/AddNewOption.tsx b/src/webapp/components/add-new-option/AddNewOption.tsx
@@ -11,7 +11,7 @@ type AddNewOptionProps = {
 };
 
 export const AddNewOption: React.FC<AddNewOptionProps> = React.memo(
-    ({ id, label = "", onAddNewOption }) => {
+    ({ id, label, onAddNewOption }) => {
         return (
             <Container onClick={onAddNewOption}>
                 <StyledAddIcon id={id} aria-label="Add new option" />

diff --git a/src/webapp/components/avatar-card/AvatarCard.tsx b/src/webapp/components/avatar-card/AvatarCard.tsx
@@ -16,6 +16,7 @@ export const AvatarCard: React.FC<AvatarCardProps> = React.memo(
                 <AvatarContainer $size={avatarSize}>
                     <Avatar alt={alt} src={src} />
                 </AvatarContainer>
+
                 <StyledCardContent>{children}</StyledCardContent>
             </StyledCard>
         );

diff --git a/src/webapp/components/button/Button.tsx b/src/webapp/components/button/Button.tsx
@@ -1,11 +1,10 @@
 import React from "react";
 import { Button as MUIButton } from "@material-ui/core";
-import styled from "styled-components";
 
 type ButtonProps = {
     children?: React.ReactNode;
     variant?: "contained" | "outlined";
-    color?: "primary" | "secondary" | "dark-secondary";
+    color?: "primary" | "secondary";
     disabled?: boolean;
     startIcon?: React.ReactNode;
     onClick: () => void;
@@ -21,22 +20,16 @@ export const Button: React.FC<ButtonProps> = React.memo(
         onClick,
     }) => {
         return (
-            <StyledButton
+            <MUIButton
                 variant={variant}
-                color={color === "dark-secondary" ? "secondary" : color}
+                color={color}
                 disabled={disabled}
                 startIcon={startIcon}
                 disableElevation
-                $darkBorder={color === "dark-secondary"}
                 onClick={onClick}
             >
                 {children}
-            </StyledButton>
+            </MUIButton>
         );
     }
 );
-
-const StyledButton = styled(MUIButton)<{ $darkBorder: boolean }>`
-    border-color: ${props =>
-        props.$darkBorder ? props.theme.palette.button.borderDarkSecondary : "initial"};
-`;
diff --git a/...ts/not-applicable-checkbox/NACheckbox.tsx → src/webapp/components/checkbox/Checkbox.tsx b/...ts/not-applicable-checkbox/NACheckbox.tsx → src/webapp/components/checkbox/Checkbox.tsx
@@ -1,23 +1,24 @@
-import React, { useCallback } from "react";
-import { Checkbox, InputLabel, FormHelperText } from "@material-ui/core";
+import React, { useCallback, useMemo } from "react";
+import { Checkbox as MUICheckbox, InputLabel, FormHelperText } from "@material-ui/core";
 import styled from "styled-components";
 
-import i18n from "../../../utils/i18n";
-
-type NACheckboxProps = {
+type CheckboxProps = {
     id: string;
     label?: string;
     checked: boolean;
     onChange: (isChecked: boolean) => void;
     helperText?: string;
     disabled?: boolean;
     indeterminate?: boolean;
+    errorText?: string;
+    error?: boolean;
+    required?: boolean;
 };
 
-export const NACheckbox: React.FC<NACheckboxProps> = React.memo(
+export const Checkbox: React.FC<CheckboxProps> = React.memo(
     ({
         id,
-        label = "",
+        label,
         checked,
         onChange,
         helperText = "",
@@ -31,22 +32,26 @@ export const NACheckbox: React.FC<NACheckboxProps> = React.memo(
             [onChange]
         );
 
+        const inputProps = useMemo(() => ({ "aria-label": label || `${id}-label` }), [id, label]);
+
         return (
             <Container>
                 <CheckboxWrapper>
-                    <Checkbox
+                    <MUICheckbox
                         id={id}
                         checked={checked}
                         indeterminate={indeterminate}
                         onChange={handleChange}
                         disabled={disabled}
                         size="small"
-                        inputProps={{ "aria-label": label || `${id}-label` }}
+                        inputProps={inputProps}
                     />
+
                     <Label htmlFor={id} disabled={disabled}>
-                        {label || i18n.t("N/A")}
+                        {label}
                     </Label>
                 </CheckboxWrapper>
+
                 <StyledFormHelperText id={`${id}-helper-text`}>{helperText}</StyledFormHelperText>
             </Container>
         );

diff --git a/src/webapp/components/date-picker/DatePicker.tsx b/src/webapp/components/date-picker/DatePicker.tsx
@@ -20,8 +20,8 @@ type DatePickerProps = {
 
 export const DatePicker: React.FC<DatePickerProps> = React.memo(
     ({
-        id = "",
-        label = "",
+        id,
+        label,
         value,
         onChange,
         disabled = false,
@@ -37,6 +37,7 @@ export const DatePicker: React.FC<DatePickerProps> = React.memo(
                         {label}
                     </Label>
                 )}
+
                 <LocalizationProvider dateAdapter={AdapterDateFns}>
                     <StyledDatePicker
                         value={value}