fix: minor color stuff

spect-ai · Mar 28, 2023 · 783def8 · 783def8
1 parent a2199fd
commit 783def8
Show file tree

Hide file tree

Showing 5 changed files with 59 additions and 17 deletions.
diff --git a/app/modules/Collection/Context/LocalCollectionContext.tsx b/app/modules/Collection/Context/LocalCollectionContext.tsx
@@ -41,6 +41,9 @@ type LocalCollectionContextType = {
   };
   currentPage: string;
   setCurrentPage: React.Dispatch<React.SetStateAction<string>>;
+  colorMapping: {
+    [key: string]: string;
+  };
 };
 
 export const LocalCollectionContext = createContext<LocalCollectionContextType>(
@@ -92,6 +95,9 @@ export function useProviderLocalCollection() {
       [key: string]: string;
     }
   );
+  const [colorMapping, setColorMapping] = useState(
+    {} as { [key: string]: string }
+  );
 
   const [currentPage, setCurrentPage] = useState("start");
 
@@ -146,6 +152,23 @@ export function useProviderLocalCollection() {
     });
     setFieldNeedsAttention(fieldsThatNeedAttention);
     setReasonFieldNeedsAttention(reasonFieldNeedsAttention);
+
+    let colorMapping = {};
+    Object.entries(localCollection.properties || {}).forEach(([key, value]) => {
+      if (["singleSelect", "multiSelect"].includes(value.type)) {
+        if (value.options && value.options.length > 0) {
+          const colorMap = value.options.reduce((acc, option) => {
+            if (option.color) acc[option.value] = option.color;
+            return acc;
+          }, {} as { [key: string]: string });
+          colorMapping = {
+            ...colorMapping,
+            ...(colorMap || {}),
+          };
+        }
+      }
+    });
+    setColorMapping(colorMapping);
   }, [localCollection.properties]);
 
   useEffect(() => {
@@ -249,6 +272,7 @@ export function useProviderLocalCollection() {
     getIfFieldNeedsAttention,
     currentPage,
     setCurrentPage,
+    colorMapping,
   };
 }
 

diff --git a/app/modules/CollectionProject/CardDrawer/CardOptions.tsx b/app/modules/CollectionProject/CardDrawer/CardOptions.tsx
@@ -128,13 +128,6 @@ export default function CardOptions({
                 }}
                 onClick={() => {
                   setIsOpen(false);
-
-                  if (!circle?.snapshot?.id) {
-                    toast.error(
-                      "Please integrate your Snapshot in the Governance Center first"
-                    );
-                    return;
-                  }
                   setDiscordThreadModal(true);
                 }}
               >

diff --git a/app/modules/CollectionProject/CardDrawer/index.tsx b/app/modules/CollectionProject/CardDrawer/index.tsx
@@ -133,6 +133,7 @@ export default function CardDrawer({ handleClose, defaultValue }: Props) {
       res = await updateCollectionDataGuarded(collection.id, slug, update);
       if (!res) {
         updateCollection(tempColl);
+        return;
       }
       if (res.id) {
         updateCollection(res);

diff --git a/app/modules/CollectionProject/KanbanView/Column.tsx b/app/modules/CollectionProject/KanbanView/Column.tsx
@@ -37,8 +37,11 @@ export default function Column({
   setDefaultValue,
   cardIds,
 }: Props) {
-  const { localCollection: collection, updateCollection } =
-    useLocalCollection();
+  const {
+    localCollection: collection,
+    updateCollection,
+    colorMapping,
+  } = useLocalCollection();
   const { getMemberDetails } = useModalOptions();
 
   const [columnName, setColumnName] = useState(column.label);
@@ -158,8 +161,17 @@ export default function Column({
                         if (property.type === "singleSelect") {
                           return (
                             <Box key={propertyId}>
-                              {/* <Text weight="semiBold">{property.name}</Text> */}
-                              <Text variant="label">{value.label}</Text>
+                              <Stack direction="horizontal" wrap space="1">
+                                {" "}
+                                <CustomTag
+                                  key={propertyId}
+                                  mode={mode}
+                                  borderCol={colorMapping[value.value]}
+                                >
+                                  {/* <Text weight="semiBold">{property.name}</Text> */}
+                                  <Text variant="label">{value.label}</Text>
+                                </CustomTag>
+                              </Stack>
                             </Box>
                           );
                         }
@@ -172,7 +184,7 @@ export default function Column({
                                   <CustomTag
                                     key={value.value}
                                     mode={mode}
-                                    borderCol={value.color}
+                                    borderCol={colorMapping[value.value]}
                                   >
                                     <Text>{value.label}</Text>
                                   </CustomTag>

diff --git a/app/modules/CollectionProject/ListView/Column.tsx b/app/modules/CollectionProject/ListView/Column.tsx
@@ -37,8 +37,11 @@ export default function Column({
   setDefaultValue,
   cardIds,
 }: Props) {
-  const { localCollection: collection, updateCollection } =
-    useLocalCollection();
+  const {
+    localCollection: collection,
+    updateCollection,
+    colorMapping,
+  } = useLocalCollection();
   const { getMemberDetails } = useModalOptions();
   const [columnName, setColumnName] = useState(column.label);
   const { mode } = useTheme();
@@ -155,8 +158,17 @@ export default function Column({
                           if (property.type === "singleSelect") {
                             return (
                               <Box key={propertyId}>
-                                {/* <Text weight="semiBold">{property.name}</Text> */}
-                                <Text variant="label">{value.label}</Text>
+                                <Stack direction="horizontal" wrap space="1">
+                                  {" "}
+                                  <CustomTag
+                                    key={propertyId}
+                                    mode={mode}
+                                    borderCol={colorMapping[value.value]}
+                                  >
+                                    {/* <Text weight="semiBold">{property.name}</Text> */}
+                                    <Text variant="label">{value.label}</Text>
+                                  </CustomTag>
+                                </Stack>
                               </Box>
                             );
                           }
@@ -169,7 +181,7 @@ export default function Column({
                                     <CustomTag
                                       key={value.value}
                                       mode={mode}
-                                      borderCol={value.color}
+                                      borderCol={colorMapping[value.value]}
                                     >
                                       <Text> {value.label}</Text>
                                     </CustomTag>