Update Collection

CodeForAfrica · Oct 10, 2023 · 725fc2e · 725fc2e
1 parent 2c8f4cf
commit 725fc2e
Show file tree

Hide file tree

Showing 5 changed files with 32 additions and 34 deletions.
diff --git a/apps/codeforafrica/src/components/AddressCard/AddressCard.js b/apps/codeforafrica/src/components/AddressCard/AddressCard.js
@@ -17,19 +17,18 @@ const AddressCard = React.forwardRef(function AddressCard(props, ref) {
     active,
     addressLine1,
     addressLine2,
-    zipcode,
+    zipCode,
     city,
     country,
     onClick,
-    title,
   } = props;
   const handleClick = (e) => {
     if (onClick) {
-      onClick(e, title);
+      onClick(e, city);
     }
   };
 
-  if (!title) {
+  if (!city) {
     return null;
   }
   const ownerState = { active };
@@ -44,7 +43,7 @@ const AddressCard = React.forwardRef(function AddressCard(props, ref) {
       <CardActionArea onClick={handleClick}>
         <CardContent sx={{ p: 0 }}>
           <RichTypography sx={{ color: "inherit" }} variant="body3Underline">
-            {title}
+            {city}
           </RichTypography>
           <RichTypography
             // In address, we treat <p> as a line i.e.no margins.
@@ -64,7 +63,8 @@ const AddressCard = React.forwardRef(function AddressCard(props, ref) {
             variant="body3"
             component="span"
           >
-            {zipcode},
+            {zipCode}
+            {zipCode ? "," : null}
           </RichTypography>
           <RichTypography
             component="span"

diff --git a/apps/codeforafrica/src/components/OfficeAddresses/OfficeAddresses.js b/apps/codeforafrica/src/components/OfficeAddresses/OfficeAddresses.js
@@ -22,10 +22,8 @@ const OfficeAddresses = React.forwardRef(function OfficeAddresses(props, ref) {
   const [activeAddress, setActiveAddress] = React.useState(
     addresses?.[0] ?? null,
   );
-  const handleClickAddress = (_, addressTitle) => {
-    setActiveAddress(
-      addresses.find((address) => address.title === addressTitle),
-    );
+  const handleClickAddress = (_, city) => {
+    setActiveAddress(addresses.find((address) => address.city === city));
   };
 
   if (!addresses?.length) {
@@ -50,7 +48,7 @@ const OfficeAddresses = React.forwardRef(function OfficeAddresses(props, ref) {
           zIndex: -1,
         }}
       >
-        <GoogleMap {...map} {...activeAddress} style={mapStyle} />
+        <GoogleMap {...map} {...activeAddress?.map} style={mapStyle} />
       </Box>
       <Section
         sx={{
@@ -89,11 +87,11 @@ const OfficeAddresses = React.forwardRef(function OfficeAddresses(props, ref) {
                 sm={5}
                 md={2}
                 sx={{ order: { xs: 2, md: 0 } }}
-                key={address.title}
+                key={address.city}
               >
                 <AddressCard
                   {...address}
-                  active={address.title === activeAddress.title}
+                  active={address.city === activeAddress.city}
                   onClick={handleClickAddress}
                 />
               </Grid>

diff --git a/apps/codeforafrica/src/lib/data/blockify/ourOffices.js b/apps/codeforafrica/src/lib/data/blockify/ourOffices.js
@@ -1,16 +1,20 @@
 function ourOffices(block) {
   const { offices } = block;
-  const addresses = offices?.map((item) => ({
-    ...item,
-    position: {
-      lng: item?.location?.[0],
-      lat: item?.location?.[1],
-    },
-    center: {
-      lng: item?.location?.[0],
-      lat: item?.location?.[1],
-    },
-  }));
+  const addresses =
+    offices?.map((item) => {
+      let location = null;
+      if (item?.location?.length) {
+        location = {
+          lng: item?.location?.[0],
+          lat: item?.location?.[1],
+        };
+      }
+      return {
+        ...item,
+        position: location,
+        center: location,
+      };
+    }) ?? null;
   return {
     ...block,
     slug: block.blockType,

diff --git a/apps/codeforafrica/src/payload/blocks/OurOffices.js b/apps/codeforafrica/src/payload/blocks/OurOffices.js
@@ -9,9 +9,9 @@ const OurOffices = {
       required: true,
     },
     {
+      hasMany: true,
       type: "relationship",
       relationTo: "offices",
-      hasMany: true,
       name: "offices",
       required: true,
     },

diff --git a/apps/codeforafrica/src/payload/collections/Offices.js b/apps/codeforafrica/src/payload/collections/Offices.js
@@ -1,13 +1,13 @@
 const Offices = {
   slug: "offices",
   admin: {
-    group: "Settings",
-    defaultColumns: ["title"],
-    useAsTitle: "title",
+    group: "Organisation",
+    defaultColumns: ["city", "country"],
+    useAsTitle: "city",
   },
   fields: [
     {
-      name: "title",
+      name: "city",
       type: "text",
       required: true,
     },
@@ -26,11 +26,7 @@ const Offices = {
       type: "text",
     },
     {
-      name: "zipcode",
-      type: "text",
-    },
-    {
-      name: "city",
+      name: "zipCode",
       type: "text",
     },
     {