feat(doc-full-view): init

src/client/dd-hub-react/src/sections/document/doc-item.tsx

@@ -44,6 +44,8 @@ export function DocItem({
     // );
     //#endregion
 
+    const [openViewDoc, setOpenViewDoc] = useState(false);
+    
     const renderTitle = (
         <Link
             color="inherit"

src/client/dd-hub-react/src/sections/document/view/create-filter-modal.tsx

@@ -51,7 +51,6 @@ export default function CreateFilterModal({ open, handleClose }: ModalProps) {
   }
 
   return (
-    <div>
     <Modal
       open={open}
       onClose={closeReset}
@@ -78,6 +77,5 @@ export default function CreateFilterModal({ open, handleClose }: ModalProps) {
         </Button>
       </Box>
     </Modal>
-    </div>
   );
 }

src/client/dd-hub-react/src/sections/document/view/doc-full-view.tsx

@@ -0,0 +1,44 @@
+import { useState } from 'react';
+
+import Box from '@mui/material/Box';
+import Modal from '@mui/material/Modal';
+import { TextField } from '@mui/material';
+
+import { Type } from 'src/api/attribute-service';
+
+type DocFullViewProps = {
+    data: Uint8Array;
+    open: boolean;
+    handleClose: () => void;
+}
+
+const style = {
+    position: 'absolute',
+    top: '50%',
+    left: '50%',
+    transform: 'translate(-50%, -50%)',
+    width: 400,
+    bgcolor: 'background.paper',
+    border: '2px solid #000',
+    boxShadow: 24,
+    p: 4,
+};
+
+export default function DocFullView({ data, open, handleClose }: DocFullViewProps) {
+    const [name, setName] = useState<string | undefined>('');
+    const [label, setLabel] = useState<string | undefined>('');
+    const [selectedType, setSelectedType] = useState<Type | null>(null);
+
+    return (
+        <Modal
+            open={open}
+            aria-labelledby="modal-modal-title"
+            aria-describedby="modal-modal-description"
+        >
+            <Box sx={style}>
+                <TextField label="Label" variant="filled" value={name} onChange={e => setName(e.target.value)} />
+                <TextField label="Name" variant="filled" value={label} onChange={e => setLabel(e.target.value)} />
+            </Box>
+        </Modal>
+    );
+}