@addev-be/ui 0.11.5 → 0.11.7

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@addev-be/ui",
-  "version": "0.11.5",
+  "version": "0.11.7",
   "type": "module",
   "scripts": {
     "watch": "tsc -b --watch",

package/src/components/data/DataGrid/DataGridFilterMenu/hooks.tsx

@@ -10,9 +10,11 @@ import { useDataGridContext } from '../hooks';
 export const useFilterModal = <R,>({
   columnKey,
   context,
+  onClose,
 }: {
   columnKey: string;
   context: DataGridContext<R>;
+  onClose?: () => void;
 }) => {
   const [isVisible, setIsVisible] = useState(false);
   const { filters = {}, columns, setFilters } = useDataGridContext<R>(context);
@@ -26,7 +28,8 @@ export const useFilterModal = <R,>({
   }, []);
   const closeModal = useCallback(() => {
     setIsVisible(false);
-  }, []);
+    onClose?.();
+  }, [onClose]);
 
   const onClearClicked = useCallback(() => {
     const newFilters = { ...filters };

package/src/components/data/DataGrid/DataGridFilterMenu/index.tsx

@@ -93,7 +93,7 @@ export const DataGridFilterMenu = <R,>({
   contextMenu = true,
   showTotalButton = true,
 }: FilterValuesProps<R>) => {
-  const { openModal, modal } = useFilterModal({ columnKey, context });
+  const { openModal, modal } = useFilterModal({ columnKey, context, onClose });
   const {
     filters = {},
     footers = {},

package/src/components/data/SqlRequestDataGrid/index.tsx

@@ -86,7 +86,6 @@ export const SqlRequestDataGridInner = <R,>(
   const refresh = useCallback(() => {
     setRows([]);
     setStart(0);
-    setLength(-1);
     setCount(-1);
   }, []);
 
@@ -125,30 +124,33 @@ export const SqlRequestDataGridInner = <R,>(
         length = 0,
         getCount = false
       ) => {
-        sqlRequest({
-          columns: columns.includes('Id') ? columns : [...columns, 'Id'],
-          returnColumns: returnColumns.includes('Id')
-            ? returnColumns
-            : [...returnColumns, 'Id'],
-          columnTypes: columnTypes.includes('Id')
-            ? columnTypes
-            : [...columnTypes, 'Id'],
-          conditions,
-          orderBy,
-          start,
-          length: Math.max(length, 0),
-          getCount,
-        }).then((response) => {
-          if (getCount) {
-            currentRows.current = Array(response.count).fill(null);
-            if (getCount) setCount(response.count ?? 0);
-          }
-          const parsedRows = props.parser
-            ? response.data.map(props.parser)
-            : (response.data as R[]);
-          currentRows.current.splice(start, length, ...parsedRows);
-          setRows([...currentRows.current]);
-        });
+        if (length > 0) {
+          sqlRequest({
+            columns: columns.includes('Id') ? columns : [...columns, 'Id'],
+            returnColumns: returnColumns.includes('Id')
+              ? returnColumns
+              : [...returnColumns, 'Id'],
+            columnTypes: columnTypes.includes('Id')
+              ? columnTypes
+              : [...columnTypes, 'Id'],
+            conditions,
+            orderBy,
+            start,
+            length,
+            getCount,
+          }).then((response) => {
+            if (getCount) {
+              currentRows.current = Array(response.count).fill(null);
+              if (getCount) setCount(response.count ?? 0);
+            }
+            const data = response.data ?? [];
+            const parsedRows = props.parser
+              ? data.map(props.parser)
+              : (data as R[]);
+            currentRows.current.splice(start, length, ...parsedRows);
+            setRows([...currentRows.current]);
+          });
+        }
       },
       100,
       {
@@ -192,7 +194,7 @@ export const SqlRequestDataGridInner = <R,>(
 
   useEffect(() => {
     if (
-      length < 0 ||
+      (!rows.length && count < 0) ||
       rows.slice(start, start + length).some((row) => row === null)
     ) {
       loadRows.current(

package/src/components/data/SqlRequestGrid/index.tsx

@@ -47,7 +47,7 @@ export const SqlRequestGridInner = <R, P extends object = {}>(
   const currentRows = useRef<R[]>([]);
   const [rows, setRows] = useState<R[]>([]);
   const [start, setStart] = useState(0);
-  const [length, setLength] = useState(50);
+  const [length, setLength] = useState(-1);
   const [count, setCount] = useState(-1);
   const [sqlRequest] = useSqlRequestHandler<R>(props.type);
   const [conditions, setConditions] = useState<Record<string, ConditionDTO>>(
@@ -97,30 +97,33 @@ export const SqlRequestGridInner = <R, P extends object = {}>(
         length = 100,
         getCount = false
       ) => {
-        sqlRequest({
-          columns: columns.includes('Id') ? columns : [...columns, 'Id'],
-          returnColumns: returnColumns.includes('Id')
-            ? returnColumns
-            : [...returnColumns, 'Id'],
-          columnTypes: columnTypes.includes('Id')
-            ? columnTypes
-            : [...columnTypes, 'Id'],
-          conditions,
-          orderBy,
-          start,
-          length,
-          getCount,
-        }).then((response) => {
-          if (getCount) {
-            currentRows.current = Array(response.count).fill(null);
-            if (getCount) setCount(response.count ?? 0);
-          }
-          const parsedRows = props.parser
-            ? response.data.map(props.parser)
-            : (response.data as R[]);
-          currentRows.current.splice(start, length, ...parsedRows);
-          setRows([...currentRows.current]);
-        });
+        if (length > 0) {
+          sqlRequest({
+            columns: columns.includes('Id') ? columns : [...columns, 'Id'],
+            returnColumns: returnColumns.includes('Id')
+              ? returnColumns
+              : [...returnColumns, 'Id'],
+            columnTypes: columnTypes.includes('Id')
+              ? columnTypes
+              : [...columnTypes, 'Id'],
+            conditions,
+            orderBy,
+            start,
+            length,
+            getCount,
+          }).then((response) => {
+            if (getCount) {
+              currentRows.current = Array(response.count).fill(null);
+              if (getCount) setCount(response.count ?? 0);
+            }
+            const data = response.data ?? [];
+            const parsedRows = props.parser
+              ? data.map(props.parser)
+              : (data as R[]);
+            currentRows.current.splice(start, length, ...parsedRows);
+            setRows([...currentRows.current]);
+          });
+        }
       },
       100,
       {
@@ -133,7 +136,6 @@ export const SqlRequestGridInner = <R, P extends object = {}>(
   const refresh = useCallback(() => {
     setRows([]);
     setStart(0);
-    setLength(50);
     setCount(-1);
   }, []);
 
@@ -195,7 +197,7 @@ export const SqlRequestGridInner = <R, P extends object = {}>(
 
   useEffect(() => {
     if (
-      !rows.length ||
+      (!rows.length && count < 0) ||
       rows.slice(start, start + length).some((row) => row === null)
     ) {
       loadRows.current(

package/src/providers/AuthenticationProvider/index.tsx

@@ -104,6 +104,7 @@ export const AuthenticationProvider: FC<AuthenticationProviderProps> = ({
   useEffect(() => {
     if (token) {
       sessionStorage.setItem('authToken', token);
+      authenticate();
     } else {
       sessionStorage.removeItem('authToken');
     }

package/src/providers/PortalsProvider/styles.ts

@@ -24,4 +24,8 @@ export const PortalsWrapper = styled.div.attrs({
 
 export const PortalContainer = styled.div.attrs({
   className: 'PortalContainer',
-})``;
+})`
+  z-index: 9999;
+  position: fixed;
+  inset: 0;
+`;