Merge pull request layer5io#896 from amitamrutiya/support-views

Add support for views in transferList
nebula-aac · Jan 23, 2025 · a54c20d · a54c20d
2 parents 93cf965 + a64543e
commit a54c20d
Show file tree

Hide file tree

Showing 8 changed files with 540 additions and 3 deletions.
diff --git a/src/custom/TransferModal/TransferList/TransferList.tsx b/src/custom/TransferModal/TransferList/TransferList.tsx
@@ -29,7 +29,7 @@ export function getFallbackImageBasedOnKind(kind: string | undefined): JSX.Eleme
 }
 
 export interface TransferListProps {
-  name: string;
+  name?: string;
   assignableData: ListItemType[];
   assignedData: (data: ListItemType[]) => void;
   originalAssignedData: ListItemType[];

diff --git a/src/custom/Workspaces/AssignmentModal.tsx b/src/custom/Workspaces/AssignmentModal.tsx
@@ -1,4 +1,5 @@
 /* eslint-disable @typescript-eslint/no-explicit-any */
+import { Divider } from '../../base';
 import { Modal, ModalBody, ModalButtonPrimary, ModalButtonSecondary, ModalFooter } from '../Modal';
 import { TransferList } from '../TransferModal/TransferList';
 import { ModalActionDiv } from './styles';
@@ -22,6 +23,21 @@ interface AssignmentModalProps {
   isAssignAllowed: boolean;
   isRemoveAllowed: boolean;
   helpText: string;
+  showViews?: boolean;
+  nameViews?: string;
+  assignableViewsData?: any[];
+  handleAssignedViewsData?: (data: any) => void;
+  originalAssignedViewsData?: any[];
+
+  emptyStateViewsIcon?: JSX.Element;
+  handleAssignableViewsPage?: () => void;
+  handleAssignedViewsPage?: () => void;
+  originalLeftViewsCount?: number;
+  originalRightViewsCount?: number;
+  onAssignViews?: () => void;
+  disableTransferViews?: boolean;
+  isAssignAllowedViews?: boolean;
+  isRemoveAllowedViews?: boolean;
 }
 
 const AssignmentModal: React.FC<AssignmentModalProps> = ({
@@ -42,7 +58,19 @@ const AssignmentModal: React.FC<AssignmentModalProps> = ({
   disableTransfer,
   isAssignAllowed,
   isRemoveAllowed,
-  helpText
+  helpText,
+  showViews,
+  nameViews,
+  assignableViewsData,
+  handleAssignedViewsData,
+  originalAssignedViewsData,
+  emptyStateViewsIcon,
+  handleAssignableViewsPage,
+  handleAssignedViewsPage,
+  originalLeftViewsCount,
+  originalRightViewsCount,
+  isAssignAllowedViews = false,
+  isRemoveAllowedViews = false
 }) => {
   return (
     <Modal
@@ -71,6 +99,33 @@ const AssignmentModal: React.FC<AssignmentModalProps> = ({
           rightPermission={isRemoveAllowed}
           transferComponentType={''}
         />
+        <Divider
+          style={{
+            margin: 'auto',
+            width: '80%',
+            marginTop: '22px',
+            marginBottom: '22px'
+          }}
+        />
+        {showViews && (
+          <TransferList
+            name={nameViews}
+            assignableData={assignableViewsData || []}
+            assignedData={handleAssignedViewsData || (() => {})}
+            originalAssignedData={originalAssignedViewsData || []}
+            emptyStateIconLeft={emptyStateViewsIcon || <></>}
+            emtyStateMessageLeft={`No views available`}
+            emptyStateIconRight={emptyStateViewsIcon || <></>}
+            emtyStateMessageRight={`No views assigned`}
+            assignablePage={handleAssignableViewsPage || (() => {})}
+            assignedPage={handleAssignedViewsPage || (() => {})}
+            originalLeftCount={originalLeftViewsCount ?? 0}
+            originalRightCount={originalRightViewsCount ?? 0}
+            leftPermission={isAssignAllowedViews}
+            rightPermission={isRemoveAllowedViews}
+            transferComponentType={''}
+          />
+        )}
       </ModalBody>
       <ModalFooter variant="filled" helpText={helpText}>
         <ModalActionDiv>

diff --git a/src/custom/Workspaces/DesignTable.tsx b/src/custom/Workspaces/DesignTable.tsx
@@ -264,6 +264,7 @@ const DesignTable: React.FC<DesignTableProps> = ({
         helpText={`Assign Designs to ${workspaceName}`}
         isAssignAllowed={isAssignAllowed}
         isRemoveAllowed={isRemoveAllowed}
+        showViews={false}
       />
       <GenericRJSFModal
         open={publishModal.open}