Merge branch 'develop' into 11/improve-multi-filters

rad10wave · Sep 4, 2023 · e53638c · e53638c
2 parents 7aed17b + a2806a7
commit e53638c
Show file tree

Hide file tree

Showing 6 changed files with 59 additions and 7 deletions.
diff --git a/src/components/Table/useMenuAction.tsx b/src/components/Table/useMenuAction.tsx
@@ -61,6 +61,7 @@ export const SUPPORTED_TYPES_COPY = new Set([
   FieldType.updatedAt,
   // CONNECTION
   FieldType.reference,
+  FieldType.id,
 ]);
 
 export const SUPPORTED_TYPES_PASTE = new Set([
@@ -98,7 +99,16 @@ export function useMenuAction(
 
   const handleCopy = useCallback(async () => {
     try {
-      if (cellValue !== undefined && cellValue !== null && cellValue !== "") {
+      if (selectedCol?.type === FieldType.id && selectedCell?.path) {
+        await navigator.clipboard.writeText(
+          selectedCell?.path.split("/").pop() || ""
+        );
+        enqueueSnackbar("Copied");
+      } else if (
+        cellValue !== undefined &&
+        cellValue !== null &&
+        cellValue !== ""
+      ) {
         const value = getValue(cellValue);
         await navigator.clipboard.writeText(value);
         enqueueSnackbar("Copied");

diff --git a/src/components/fields/Array/Filter.tsx b/src/components/fields/Array/Filter.tsx
@@ -0,0 +1,20 @@
+import { IFilterOperator } from "@src/components/fields/types";
+
+export const operators: IFilterOperator[] = [
+  {
+    label: "equals",
+    value: "==",
+  },
+  {
+    label: "not equals",
+    value: "!=",
+  },
+  {
+    label: "contains the following",
+    value: "array-contains",
+  },
+  {
+    label: "contains atleast one of the following",
+    value: "array-contains-any",
+  },
+];
diff --git a/src/components/fields/Array/SideDrawerField/index.tsx b/src/components/fields/Array/SideDrawerField/index.tsx
@@ -120,7 +120,7 @@ export default function ArraySideDrawerField({
 }: ISideDrawerFieldProps) {
   const handleAddNew = (fieldType: ArraySupportedFiledTypes) => {
     onChange([...(value || []), SupportedTypes[fieldType].initialValue]);
-    onDirty(true);
+    if (onDirty) onDirty(true);
   };
   const handleChange = (newValue_: any, indexUpdated: number) => {
     onChange(
@@ -137,13 +137,13 @@ export default function ArraySideDrawerField({
   const handleRemove = (index: number) => {
     value.splice(index, 1);
     onChange([...value]);
-    onDirty(true);
+    if (onDirty) onDirty(true);
     onSubmit();
   };
 
   const handleClearField = () => {
     onChange([]);
-    onSubmit();
+    if (onSubmit) onSubmit();
   };
 
   function handleOnDragEnd(result: DropResult) {
@@ -157,7 +157,7 @@ export default function ArraySideDrawerField({
     const [removed] = list.splice(result.source.index, 1);
     list.splice(result.destination.index, 0, removed);
     onChange(list);
-    onSubmit();
+    if (onSubmit) onSubmit();
   }
 
   if (value === undefined || Array.isArray(value)) {
@@ -166,7 +166,11 @@ export default function ArraySideDrawerField({
         <DragDropContext onDragEnd={handleOnDragEnd}>
           <Droppable droppableId="columns_manager" direction="vertical">
             {(provided) => (
-              <List {...provided.droppableProps} ref={provided.innerRef}>
+              <List
+                sx={{ padding: 0 }}
+                {...provided.droppableProps}
+                ref={provided.innerRef}
+              >
                 {(value || []).map((v: any, index: number) => (
                   <ArrayFieldInput
                     key={`index-${index}-value`}
@@ -185,7 +189,15 @@ export default function ArraySideDrawerField({
             )}
           </Droppable>
         </DragDropContext>
-        <AddButton handleAddNew={handleAddNew} />
+        {props.operator === "array-contains" ? (
+          value?.length < 1 ? (
+            <AddButton handleAddNew={handleAddNew} />
+          ) : (
+            <></>
+          )
+        ) : (
+          <AddButton handleAddNew={handleAddNew} />
+        )}
       </>
     );
   }

diff --git a/src/components/fields/Array/index.tsx b/src/components/fields/Array/index.tsx
@@ -5,6 +5,7 @@ import { IFieldConfig, FieldType } from "@src/components/fields/types";
 import withRenderTableCell from "@src/components/Table/TableCell/withRenderTableCell";
 
 import DisplayCell from "./DisplayCell";
+import { operators } from "./Filter";
 
 import BasicContextMenuActions from "@src/components/Table/ContextMenu/BasicCellContextMenuActions";
 
@@ -27,6 +28,7 @@ export const config: IFieldConfig = {
     popoverProps: { PaperProps: { sx: { p: 1, minWidth: "200px" } } },
   }),
   SideDrawerField,
+  filter: { operators, defaultValue: [] },
   requireConfiguration: false,
   contextMenuActions: BasicContextMenuActions,
 };

diff --git a/src/components/fields/types.ts b/src/components/fields/types.ts
@@ -94,6 +94,8 @@ export interface ISideDrawerFieldProps<T = any> {
   disabled: boolean;
 
   row: TableRow;
+
+  operator?: TableFilter["operator"];
 }
 
 export interface ISettingsProps {

diff --git a/src/hooks/useFirestoreCollectionWithAtom.ts b/src/hooks/useFirestoreCollectionWithAtom.ts
@@ -437,6 +437,12 @@ export const tableFiltersToFirestoreFilters = (filters: TableFilter[]) => {
       continue;
     } else if (filter.operator === "is-not-empty") {
       firestoreFilters.push(where(filter.key, "!=", ""));
+    } else if (filter.operator === "array-contains") {
+      if (!filter.value || !filter.value.length) continue;
+      // make the value as a singular string
+      firestoreFilters.push(
+        where(filter.key, filter.operator as WhereFilterOp, filter.value[0])
+      );
       continue;
     }