Merge pull request #705 from jembi/CI-86c0qwr3h-users-updates

feat: ability to delete user.

Author: drizzentic

packages/channels-app/src/components/dialogs/basic.dialog.component.tsx

@@ -8,6 +8,7 @@ export type BasicDialogProps = {
   children: React.ReactNode
   size?: DialogProps['maxWidth']
   defaultContentWrapper?: boolean
+  sx?: DialogProps['sx']
 }
 
 export function BasicDialog(props: BasicDialogProps) {
@@ -16,6 +17,7 @@ export function BasicDialog(props: BasicDialogProps) {
       open={props.open}
       onClose={props.onClose}
       maxWidth={props.size ?? 'lg'}
+      sx={props.sx}
     >
       {props.title && <DialogTitle>{props.title}</DialogTitle>}
       <DialogContent>{props.children}</DialogContent>

packages/channels-app/src/contexts/dialog.context.tsx

@@ -1,11 +1,15 @@
 import React, {createContext, useContext, useState, ReactNode} from 'react'
-import {BasicDialog} from '../components/dialogs/basic.dialog.component'
+import {
+  BasicDialog,
+  BasicDialogProps
+} from '../components/dialogs/basic.dialog.component'
 
 interface BasicDialogContextProps {
   showBasicDialog: (
     children: ReactNode,
     title?: string,
-    size?: 'xs' | 'sm' | 'md' | 'lg' | 'xl'
+    size?: 'xs' | 'sm' | 'md' | 'lg' | 'xl',
+    sx?: BasicDialogProps['sx']
   ) => void
   hideBasicDialog: () => void
 }
@@ -22,19 +26,22 @@ export const BasicDialogProvider: React.FC<{children: ReactNode}> = ({
     children: ReactNode
     open: boolean
     size?: 'xs' | 'sm' | 'md' | 'lg' | 'xl'
+    sx?: BasicDialogProps['sx']
   }>({
     title: '',
     children: null,
     open: false,
-    size: 'xs'
+    size: 'xs',
+    sx: undefined
   })
 
   const showBasicDialog = (
     children: ReactNode,
     title?: string,
-    size: 'xs' | 'sm' | 'md' | 'lg' | 'xl' = 'xs'
+    size: 'xs' | 'sm' | 'md' | 'lg' | 'xl' = 'xs',
+    sx?: BasicDialogProps['sx']
   ) => {
-    setDialogProps({title, children, open: true, size})
+    setDialogProps({title, children, open: true, size, sx})
   }
 
   const hideBasicDialog = () => {
@@ -49,6 +56,7 @@ export const BasicDialogProvider: React.FC<{children: ReactNode}> = ({
         open={dialogProps.open}
         onClose={hideBasicDialog}
         size={dialogProps.size}
+        sx={dialogProps.sx}
       >
         {dialogProps.children}
       </BasicDialog>

packages/channels-app/src/screens/manage.channels.screen.tsx

@@ -154,6 +154,7 @@ const ManageChannelsScreen: React.FC = () => {
         )
       }
     },
+    {field: 'type', headerName: 'Type', flex: 0.5},
     {field: 'priority', headerName: 'Priority', flex: 0.5},
     {field: 'allow', headerName: 'Access', flex: 1},
     {
@@ -203,6 +204,7 @@ const ManageChannelsScreen: React.FC = () => {
     id: index,
     name: channel.name,
     urlPattern: channel.urlPattern,
+    type: channel.type,
     status: channel.status,
     priority: channel.priority ?? '',
     allow: channel.allow.join(', ')
@@ -268,6 +270,12 @@ const ManageChannelsScreen: React.FC = () => {
             },
             '& .MuiDataGrid-columnHeaders': {
               borderBottom: 'none'
+            },
+            '& .MuiDataGrid-cell:focus': {
+              outline: 'none'
+            },
+            '& .MuiDataGrid-columnHeaderTitle': {
+              fontWeight: 'bold'
             }
           }}
         />