@movalib/movalib-commons 1.68.28 → 1.68.30

package/dist/src/components/MovaTableBack/MovaTableBack.d.ts

@@ -21,7 +21,12 @@ type TMovaTable<T> = {
     onRowDoubleClick?: (data: T) => void;
     filterChildren?: React.ReactNode;
     asSearchSection?: boolean;
+    cardRenderer?: ComponentType<{
+        element: T;
+        onClick?: () => void;
+    }>;
+    forceCardRender?: boolean;
     placeHolderNoData?: React.ReactNode;
 };
-export default function MovaTableBack<T>({ useDataHook, displayedColumns, pagination, compact, onRowClick, onRowRightClick, onRowDoubleClick, isClickable, filterChildren, asSearchSection, placeHolderNoData, }: TMovaTable<T>): import("react/jsx-runtime").JSX.Element;
+export default function MovaTableBack<T>({ useDataHook, displayedColumns, pagination, compact, onRowClick, onRowRightClick, onRowDoubleClick, isClickable, filterChildren, asSearchSection, placeHolderNoData, cardRenderer, forceCardRender, }: TMovaTable<T>): import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/src/components/MovaTableBack/MovaTableBack.js

@@ -9,13 +9,18 @@ var icons_material_1 = require("@mui/icons-material");
 var Search_1 = __importDefault(require("@mui/icons-material/Search"));
 var material_1 = require("@mui/material");
 var react_1 = require("react");
+var material_2 = require("@mui/material");
 function MovaTableBack(_a) {
-    var useDataHook = _a.useDataHook, displayedColumns = _a.displayedColumns, pagination = _a.pagination, compact = _a.compact, onRowClick = _a.onRowClick, onRowRightClick = _a.onRowRightClick, onRowDoubleClick = _a.onRowDoubleClick, isClickable = _a.isClickable, filterChildren = _a.filterChildren, _b = _a.asSearchSection, asSearchSection = _b === void 0 ? true : _b, placeHolderNoData = _a.placeHolderNoData;
-    var _c = (0, react_1.useState)(0), currentPageIndex = _c[0], setCurrentPageIndex = _c[1];
-    var _d = (0, react_1.useState)(25), rowsPerPage = _d[0], setRowsPerPage = _d[1];
-    var _e = (0, react_1.useState)(""), search = _e[0], setSearch = _e[1];
+    var useDataHook = _a.useDataHook, displayedColumns = _a.displayedColumns, pagination = _a.pagination, compact = _a.compact, onRowClick = _a.onRowClick, onRowRightClick = _a.onRowRightClick, onRowDoubleClick = _a.onRowDoubleClick, isClickable = _a.isClickable, filterChildren = _a.filterChildren, _b = _a.asSearchSection, asSearchSection = _b === void 0 ? true : _b, placeHolderNoData = _a.placeHolderNoData, cardRenderer = _a.cardRenderer, _c = _a.forceCardRender, forceCardRender = _c === void 0 ? false : _c;
+    var _d = (0, react_1.useState)(0), currentPageIndex = _d[0], setCurrentPageIndex = _d[1];
+    var _e = (0, react_1.useState)(25), rowsPerPage = _e[0], setRowsPerPage = _e[1];
+    var _f = (0, react_1.useState)(""), search = _f[0], setSearch = _f[1];
     var clickTimeout = (0, react_1.useRef)(null);
-    var _f = useDataHook(currentPageIndex, rowsPerPage, search), data = _f.data, totalElements = _f.totalElements, isLoading = _f.isLoading, refresh = _f.refresh;
+    var theme = (0, material_2.useTheme)();
+    var isMobile = (0, material_2.useMediaQuery)(theme.breakpoints.down("md"));
+    var showCards = (isMobile || forceCardRender) && !!cardRenderer;
+    var CardComponent = cardRenderer;
+    var _g = useDataHook(currentPageIndex, rowsPerPage, search), data = _g.data, totalElements = _g.totalElements, isLoading = _g.isLoading, refresh = _g.refresh;
     var handleDoubleClick = (0, react_1.useCallback)(function (element) {
         if (!onRowDoubleClick)
             return;
@@ -61,7 +66,7 @@ function MovaTableBack(_a) {
                     gap: 2,
                 }, children: [(0, jsx_runtime_1.jsx)(material_1.TextField, { size: "small", type: "search", onChange: handleSearchChange, inputProps: {
                             startAdornment: ((0, jsx_runtime_1.jsx)(material_1.InputAdornment, { position: "start", children: (0, jsx_runtime_1.jsx)(Search_1.default, {}) })),
-                        }, sx: { width: "100%" }, placeholder: "Rechercher" }), refresh && ((0, jsx_runtime_1.jsx)(material_1.Button, { size: "small", onClick: refresh, variant: "contained", children: (0, jsx_runtime_1.jsx)(icons_material_1.Refresh, {}) }))] }), filterChildren && filterChildren, (0, jsx_runtime_1.jsx)(material_1.TableContainer, { sx: { height: "100%" }, component: material_1.Paper, children: (0, jsx_runtime_1.jsxs)(material_1.Table, { size: compact ? "small" : "medium", sx: { height: "100%" }, stickyHeader: true, children: [(0, jsx_runtime_1.jsx)(material_1.TableHead, { children: (0, jsx_runtime_1.jsx)(material_1.TableRow, { children: displayedColumns.map(function (column, index) { return ((0, jsx_runtime_1.jsx)(material_1.TableCell, { children: column.displayName }, index)); }) }) }), (0, jsx_runtime_1.jsxs)(material_1.TableBody, { sx: { overflowY: "auto" }, children: [isLoading && ((0, jsx_runtime_1.jsx)(material_1.TableRow, { children: (0, jsx_runtime_1.jsx)(material_1.TableCell, { colSpan: 5, sx: { padding: 0 }, children: (0, jsx_runtime_1.jsx)(material_1.LinearProgress, {}) }) })), !isLoading && (data === null || data === void 0 ? void 0 : data.length) === 0 && placeHolderNoData && ((0, jsx_runtime_1.jsx)(material_1.TableRow, { children: (0, jsx_runtime_1.jsx)(material_1.TableCell, { colSpan: displayedColumns.length, sx: { textAlign: "center", color: "grey.400" }, children: placeHolderNoData }) })), (data === null || data === void 0 ? void 0 : data.length) !== 0 &&
+                        }, sx: { width: "100%" }, placeholder: "Rechercher" }), refresh && ((0, jsx_runtime_1.jsx)(material_1.Button, { size: "small", onClick: refresh, variant: "contained", children: (0, jsx_runtime_1.jsx)(icons_material_1.Refresh, {}) }))] }), filterChildren && filterChildren, showCards ? ((0, jsx_runtime_1.jsxs)(material_1.Box, { sx: { flex: 1, minHeight: 0, display: "flex", flexDirection: "column" }, children: [(0, jsx_runtime_1.jsxs)(material_1.Box, { sx: { flex: 1, minHeight: 0, overflow: "auto", display: "flex", flexDirection: "column", gap: 1, p: 1 }, children: [isLoading && (0, jsx_runtime_1.jsx)(material_1.LinearProgress, {}), !isLoading && (data === null || data === void 0 ? void 0 : data.length) === 0 && placeHolderNoData, data === null || data === void 0 ? void 0 : data.map(function (element, index) { return ((0, jsx_runtime_1.jsx)(CardComponent, { element: element, onClick: function () { return onRowClick === null || onRowClick === void 0 ? void 0 : onRowClick(element); } }, index)); })] }), pagination && pagination.length > 0 && ((0, jsx_runtime_1.jsx)(material_1.Box, { sx: { flexShrink: 0, borderTop: 1, borderColor: "divider", backgroundColor: "white" }, children: (0, jsx_runtime_1.jsx)(material_1.TablePagination, { sx: { minHeight: "52px" }, component: "div", count: totalElements, onPageChange: handlePageChange, page: currentPageIndex, rowsPerPage: rowsPerPage, labelRowsPerPage: "Par page :", onRowsPerPageChange: handleRowsPerPageChange, rowsPerPageOptions: pagination }) }))] })) : ((0, jsx_runtime_1.jsx)(material_1.TableContainer, { sx: { height: "100%" }, component: material_1.Paper, children: (0, jsx_runtime_1.jsxs)(material_1.Table, { size: compact ? "small" : "medium", sx: { height: "100%" }, stickyHeader: true, children: [(0, jsx_runtime_1.jsx)(material_1.TableHead, { children: (0, jsx_runtime_1.jsx)(material_1.TableRow, { children: displayedColumns.map(function (column, index) { return ((0, jsx_runtime_1.jsx)(material_1.TableCell, { children: column.displayName }, index)); }) }) }), (0, jsx_runtime_1.jsxs)(material_1.TableBody, { sx: { overflowY: "auto" }, children: [isLoading && ((0, jsx_runtime_1.jsx)(material_1.TableRow, { children: (0, jsx_runtime_1.jsx)(material_1.TableCell, { colSpan: 5, sx: { padding: 0 }, children: (0, jsx_runtime_1.jsx)(material_1.LinearProgress, {}) }) })), !isLoading && (data === null || data === void 0 ? void 0 : data.length) === 0 && placeHolderNoData && ((0, jsx_runtime_1.jsx)(material_1.TableRow, { children: (0, jsx_runtime_1.jsx)(material_1.TableCell, { colSpan: displayedColumns.length, sx: { textAlign: "center", color: "grey.400" }, children: placeHolderNoData }) })), (data === null || data === void 0 ? void 0 : data.length) !== 0 &&
                                     (data === null || data === void 0 ? void 0 : data.map(function (element, index) { return ((0, jsx_runtime_1.jsx)(material_1.TableRow, { onDoubleClick: function () {
                                             handleDoubleClick(element);
                                         }, onClick: function () { return handleRowClick(element); }, onContextMenu: function (event) {
@@ -80,5 +85,5 @@ function MovaTableBack(_a) {
                                                     width: "1%",
                                                     maxWidth: "fit-content",
                                                 }
-                                                : {}, children: column.component && ((0, jsx_runtime_1.jsx)(column.component, { element: element })) }, index)); }) }, index)); })), (0, jsx_runtime_1.jsx)(material_1.TableRow, { sx: { height: "100%" } })] }), pagination && pagination.length > 0 && ((0, jsx_runtime_1.jsx)(material_1.TableFooter, { sx: { position: "sticky", bottom: 0, backgroundColor: "white" }, children: (0, jsx_runtime_1.jsx)(material_1.TableRow, { children: (0, jsx_runtime_1.jsx)(material_1.TablePagination, { count: totalElements, onPageChange: handlePageChange, page: currentPageIndex, rowsPerPage: rowsPerPage, labelRowsPerPage: "Lignes par page :", onRowsPerPageChange: handleRowsPerPageChange, rowsPerPageOptions: pagination }) }) }))] }) })] }));
+                                                : {}, children: column.component && ((0, jsx_runtime_1.jsx)(column.component, { element: element })) }, index)); }) }, index)); })), (0, jsx_runtime_1.jsx)(material_1.TableRow, { sx: { height: "100%" } })] }), pagination && pagination.length > 0 && ((0, jsx_runtime_1.jsx)(material_1.TableFooter, { sx: { position: "sticky", bottom: 0, backgroundColor: "white" }, children: (0, jsx_runtime_1.jsx)(material_1.TableRow, { children: (0, jsx_runtime_1.jsx)(material_1.TablePagination, { count: totalElements, onPageChange: handlePageChange, page: currentPageIndex, rowsPerPage: rowsPerPage, labelRowsPerPage: "Lignes par page :", onRowsPerPageChange: handleRowsPerPageChange, rowsPerPageOptions: pagination }) }) }))] }) }))] }));
 }

package/dist/src/models/Settings.d.ts

@@ -1,7 +1,8 @@
 export declare enum SettingsEnumCode {
     STOCK_MODULE_ENABLED = "STOCK_MODULE_ENABLED",
     NO_PHONE_CUSTOMER_CREATION = "NO_PHONE_CUSTOMER_CREATION",
-    DOCUMENT_PRODUCT_CREATION = "DOCUMENT_PRODUCT_CREATION"
+    DOCUMENT_PRODUCT_CREATION = "DOCUMENT_PRODUCT_CREATION",
+    DOCUMENT_PRODUCT_UPDATE = "DOCUMENT_PRODUCT_UPDATE"
 }
 export default class Settings {
     code: SettingsEnumCode;

package/dist/src/models/Settings.js

@@ -6,6 +6,7 @@ var SettingsEnumCode;
     SettingsEnumCode["STOCK_MODULE_ENABLED"] = "STOCK_MODULE_ENABLED";
     SettingsEnumCode["NO_PHONE_CUSTOMER_CREATION"] = "NO_PHONE_CUSTOMER_CREATION";
     SettingsEnumCode["DOCUMENT_PRODUCT_CREATION"] = "DOCUMENT_PRODUCT_CREATION";
+    SettingsEnumCode["DOCUMENT_PRODUCT_UPDATE"] = "DOCUMENT_PRODUCT_UPDATE";
 })(SettingsEnumCode || (exports.SettingsEnumCode = SettingsEnumCode = {}));
 var Settings = /** @class */ (function () {
     function Settings(code, valueBoolean, valueText, valueNumber) {

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@movalib/movalib-commons",
-	"version": "1.68.28",
+	"version": "1.68.30",
 	"description": "Bibliothèque d'objets communs à l'ensemble des projets React de Movalib",
 	"main": "dist/index.js",
 	"types": "dist/index.d.ts",

package/src/components/MovaTableBack/MovaTableBack.tsx

@@ -25,6 +25,7 @@ import {
   useRef,
   useState,
 } from "react";
+import { useMediaQuery, useTheme } from "@mui/material";
 
 type TMovaTable<T> = {
   useDataHook: (
@@ -50,6 +51,8 @@ type TMovaTable<T> = {
   onRowDoubleClick?: (data: T) => void;
   filterChildren?: React.ReactNode;
   asSearchSection?: boolean;
+  cardRenderer?: ComponentType<{ element: T; onClick?: () => void }>;
+  forceCardRender?:boolean;
   placeHolderNoData?: React.ReactNode;
 };
 
@@ -65,12 +68,17 @@ export default function MovaTableBack<T>({
   filterChildren,
   asSearchSection = true,
   placeHolderNoData,
+  cardRenderer,
+  forceCardRender = false,
 }: TMovaTable<T>) {
   const [currentPageIndex, setCurrentPageIndex] = useState<number>(0);
   const [rowsPerPage, setRowsPerPage] = useState<number>(25);
   const [search, setSearch] = useState("");
   const clickTimeout = useRef<ReturnType<typeof setTimeout> | null>(null);
-
+  const theme = useTheme();
+  const isMobile = useMediaQuery(theme.breakpoints.down("md"));
+  const showCards = (isMobile || forceCardRender) && !!cardRenderer;
+  const CardComponent = cardRenderer as ComponentType<{ element: T; onClick?: () => void }>;
   const { data, totalElements, isLoading, refresh } = useDataHook(
     currentPageIndex,
     rowsPerPage,
@@ -161,6 +169,38 @@ export default function MovaTableBack<T>({
         )}
       </Box>}
       {filterChildren && filterChildren}
+
+     {showCards ? (
+      <Box sx={{ flex: 1, minHeight: 0, display: "flex", flexDirection: "column" }}>
+        {/* Zone scrollable */}
+        <Box sx={{ flex: 1, minHeight: 0, overflow: "auto", display: "flex", flexDirection: "column", gap: 1, p: 1 }}>
+          {isLoading && <LinearProgress />}
+          {!isLoading && data?.length === 0 && placeHolderNoData}
+          {data?.map((element, index) => (
+            <CardComponent key={index} element={element} onClick={() => onRowClick?.(element)} />
+          ))}
+        </Box>
+
+        {/* Pagination fixe en bas */}
+        {pagination && pagination.length > 0 && (
+          <Box sx={{ flexShrink: 0, borderTop: 1, borderColor: "divider", backgroundColor: "white" }}>
+            <TablePagination
+              sx={{ minHeight: "52px" }}
+              component="div"
+              count={totalElements}
+              onPageChange={handlePageChange}
+              page={currentPageIndex}
+              rowsPerPage={rowsPerPage}
+              labelRowsPerPage="Par page :"
+              onRowsPerPageChange={handleRowsPerPageChange}
+              rowsPerPageOptions={pagination}
+            />
+          </Box>
+        )}
+      </Box>
+    ) : (
+
+
       <TableContainer sx={{ height: "100%" }} component={Paper}>
         <Table
           size={compact ? "small" : "medium"}
@@ -258,6 +298,7 @@ export default function MovaTableBack<T>({
           )}
         </Table>
       </TableContainer>
+    )}
     </div>
   );
 }

package/src/models/Settings.ts

@@ -1,7 +1,8 @@
 export enum SettingsEnumCode {
     STOCK_MODULE_ENABLED = "STOCK_MODULE_ENABLED",
     NO_PHONE_CUSTOMER_CREATION = "NO_PHONE_CUSTOMER_CREATION",
-    DOCUMENT_PRODUCT_CREATION = "DOCUMENT_PRODUCT_CREATION"
+    DOCUMENT_PRODUCT_CREATION = "DOCUMENT_PRODUCT_CREATION",
+    DOCUMENT_PRODUCT_UPDATE ="DOCUMENT_PRODUCT_UPDATE"
 }
 export default class Settings {