sevago-sso-fe 1.0.76 → 1.0.78

package/dist/index.esm.js

@@ -51,27 +51,27 @@ const APP_GROUP_COLOR = {
   [
     "Workflow Engine"
     /* WORKFLOW_ENGINE */
-  ]: "#2E76FF",
+  ]: "linear-gradient(180deg, #3990FF 0%, #2662FF 100%)",
   [
     "HRM"
     /* HRM */
-  ]: "#09A569",
+  ]: "linear-gradient(180deg, #09D47B 0%, #07554B 100%)",
   [
     "Platform & Info"
     /* PLATFORM_AND_INFO */
-  ]: "#FF9454",
+  ]: "linear-gradient(180deg, #FF9A56 0%, #FF6A43 100%)",
   [
     "B2B"
     /* B2B */
-  ]: "#EB6262",
+  ]: "linear-gradient(180deg, #FF9A56 0%, #EB6262 100%)",
   [
     "Web"
     /* CLIENT */
-  ]: "#FF9454",
+  ]: "linear-gradient(180deg, #FF9A56 0%, #FF6A43 100%)",
   [
     "Khác"
     /* OTHER */
-  ]: "#EB6262"
+  ]: "linear-gradient(180deg, #A509D4 0%, #1B0755 100%)"
 };
 const SSO = {
   local: "http://localhost:6000",
@@ -327,7 +327,7 @@ const APP_OBJ = {
     },
     // E-Catalogue
     icon: sevagoIcon,
-    content: "Sevago - E-Catalogue",
+    content: "E-Catalogue",
     group: "B2B",
     color: APP_GROUP_COLOR[
       "B2B"
@@ -344,7 +344,7 @@ const APP_OBJ = {
     },
     // Landing page
     icon: sevagoIcon,
-    content: "Sevago - Landing page",
+    content: "Landing page",
     group: "Khác",
     color: APP_GROUP_COLOR[
       "Khác"
@@ -7198,8 +7198,10 @@ const AppGrid = ({
   const start = page * pageSize;
   const end = start + pageSize;
   const visibleApps = totalPages > 1 ? apps.slice(start, end) : apps;
+  const placeholdersCount = Math.max(0, pageSize - visibleApps.length);
+  const placeholderHeight = iconSize + 48;
   return /* @__PURE__ */ jsxs(Box, { sx: { position: "relative" }, children: [
-    /* @__PURE__ */ jsx(
+    /* @__PURE__ */ jsxs(
       Box,
       {
         sx: {
@@ -7207,48 +7209,61 @@ const AppGrid = ({
           gridTemplateColumns: `repeat(${columns}, 1fr)`,
           gap: gap2
         },
-        children: visibleApps.map((app, index) => {
-          return /* @__PURE__ */ jsxs(
-            MotionBox,
+        children: [
+          visibleApps.map((app, index) => {
+            return /* @__PURE__ */ jsxs(
+              MotionBox,
+              {
+                preset: "staggerItem",
+                index,
+                hover: true,
+                sx: {
+                  cursor: "pointer",
+                  display: "flex",
+                  flex: 1,
+                  alignItems: "center",
+                  flexDirection: "column"
+                },
+                onClick: () => onClickApp(app),
+                children: [
+                  /* @__PURE__ */ jsx(
+                    StackRowAlignJustCenter,
+                    {
+                      sx: {
+                        width: iconSize,
+                        height: iconSize,
+                        borderRadius: iconRadius,
+                        mb: 1.5,
+                        background: app.color
+                      },
+                      children: /* @__PURE__ */ jsx(
+                        ImageElement,
+                        {
+                          sx: { width: iconSize * 0.56, height: iconSize * 0.56 },
+                          url: app.icon,
+                          sizeType: ImageSizeType.SQUARE
+                        }
+                      )
+                    }
+                  ),
+                  /* @__PURE__ */ jsx(Typography, { variant: titleVariant, sx: { color: titleColor ?? theme.palette.common.white }, children: app.content })
+                ]
+              },
+              index
+            );
+          }),
+          placeholdersCount > 0 && Array.from({ length: placeholdersCount }).map((_, fillerIndex) => /* @__PURE__ */ jsx(
+            Box,
             {
-              preset: "staggerItem",
-              index,
-              hover: true,
               sx: {
-                cursor: "pointer",
-                display: "flex",
-                flex: 1,
-                alignItems: "center",
-                flexDirection: "column"
-              },
-              onClick: () => onClickApp(app),
-              children: [
-                /* @__PURE__ */ jsx(
-                  StackRowAlignJustCenter,
-                  {
-                    sx: {
-                      width: iconSize,
-                      height: iconSize,
-                      borderRadius: iconRadius,
-                      mb: 1.5,
-                      background: app.color
-                    },
-                    children: /* @__PURE__ */ jsx(
-                      ImageElement,
-                      {
-                        sx: { width: iconSize * 0.56, height: iconSize * 0.56 },
-                        url: app.icon,
-                        sizeType: ImageSizeType.SQUARE
-                      }
-                    )
-                  }
-                ),
-                /* @__PURE__ */ jsx(Typography, { variant: titleVariant, sx: { color: titleColor ?? theme.palette.common.white }, children: app.content })
-              ]
+                visibility: "hidden",
+                width: 1,
+                minHeight: placeholderHeight
+              }
             },
-            index
-          );
-        })
+            `placeholder-${fillerIndex}`
+          ))
+        ]
       }
     ),
     showPagination && totalPages > 1 && /* @__PURE__ */ jsxs(Fragment, { children: [