change arrangement of elements of user accodrion in mobile view

Gozargah · May 1, 2023 · 613f1a3 · 613f1a3
1 parent 672e112
commit 613f1a3
Show file tree

Hide file tree

Showing 5 changed files with 37 additions and 54 deletions.
diff --git a/app/dashboard/build/404.html b/app/dashboard/build/404.html
@@ -33,7 +33,7 @@
     <meta name="msapplication-TileColor" content="#2b5797" />
     <meta name="msapplication-config" content="/favicon/browserconfig.xml" />
     <meta name="theme-color" content="#3B81F6" />
-    <script type="module" crossorigin src="/dashboard/assets/index.56da4779.js"></script>
+    <script type="module" crossorigin src="/dashboard/assets/index.31644f25.js"></script>
     <link rel="modulepreload" crossorigin href="/dashboard/assets/vendor.8e672767.js">
     <link rel="stylesheet" href="/dashboard/assets/index.16216361.css">
   </head>

diff --git a/app/dashboard/build/assets/index.31644f25.js b/app/dashboard/build/assets/index.31644f25.js
diff --git a/app/dashboard/build/assets/index.56da4779.js b/app/dashboard/build/assets/index.56da4779.js
diff --git a/app/dashboard/build/index.html b/app/dashboard/build/index.html
@@ -33,7 +33,7 @@
     <meta name="msapplication-TileColor" content="#2b5797" />
     <meta name="msapplication-config" content="/favicon/browserconfig.xml" />
     <meta name="theme-color" content="#3B81F6" />
-    <script type="module" crossorigin src="/dashboard/assets/index.56da4779.js"></script>
+    <script type="module" crossorigin src="/dashboard/assets/index.31644f25.js"></script>
     <link rel="modulepreload" crossorigin href="/dashboard/assets/vendor.8e672767.js">
     <link rel="stylesheet" href="/dashboard/assets/index.16216361.css">
   </head>

diff --git a/app/dashboard/src/components/UsersTable.tsx b/app/dashboard/src/components/UsersTable.tsx
@@ -150,10 +150,10 @@ const UsageSlider: FC<UsageSliderProps> = (props) => {
             formatBytes(total) +
             (dataLimitResetStrategy && dataLimitResetStrategy !== "no_reset"
               ? " " +
-                t(
-                  "userDialog.resetStrategy" +
-                    getResetStrategy(dataLimitResetStrategy)
-                )
+              t(
+                "userDialog.resetStrategy" +
+                getResetStrategy(dataLimitResetStrategy)
+              )
               : "")
           )}
         </Text>
@@ -343,30 +343,6 @@ export const UsersTable: FC<UsersTableProps> = (props) => {
                             py={3}
                           >
                             <VStack justifyContent="space-between" spacing="4">
-                              <VStack
-                                alignItems="flex-start"
-                                w="full"
-                                spacing={2}
-                              >
-                                <Text
-                                  textTransform="capitalize"
-                                  fontSize="xs"
-                                  fontWeight="bold"
-                                  color="gray.600"
-                                  _dark={{
-                                    color: "gray.400",
-                                  }}
-                                >
-                                  {t("usersTable.status")}
-                                </Text>
-                                <Box width="full" minW="230px">
-                                  <StatusBadge
-                                    compact
-                                    expiryDate={user.expire}
-                                    status={user.status}
-                                  />
-                                </Box>
-                              </VStack>
                               <VStack
                                 alignItems="flex-start"
                                 w="full"
@@ -400,29 +376,36 @@ export const UsersTable: FC<UsersTableProps> = (props) => {
                                 </Box>
                               </VStack>
                               <HStack w="full" justifyContent="space-between">
-                                <Box>
-                                  <ActionButtons user={user} />
+                                <Box width="full" minW="230px">
+                                  <StatusBadge
+                                    compact
+                                    expiryDate={user.expire}
+                                    status={user.status}
+                                  />
                                 </Box>
-                                <Tooltip
-                                  label={t("userDialog.editUser")}
-                                  placement="top"
-                                >
-                                  <IconButton
-                                    aria-label="Edit user"
-                                    bg="transparent"
-                                    _dark={{
-                                      _hover: {
-                                        bg: "gray.700",
-                                      },
-                                    }}
-                                    onClick={(e) => {
-                                      e.stopPropagation();
-                                      onEditingUser(user);
-                                    }}
+                                <HStack>
+                                  <ActionButtons user={user} />
+                                  <Tooltip
+                                    label={t("userDialog.editUser")}
+                                    placement="top"
                                   >
-                                    <EditIcon />
-                                  </IconButton>
-                                </Tooltip>
+                                    <IconButton
+                                      aria-label="Edit user"
+                                      bg="transparent"
+                                      _dark={{
+                                        _hover: {
+                                          bg: "gray.700",
+                                        },
+                                      }}
+                                      onClick={(e) => {
+                                        e.stopPropagation();
+                                        onEditingUser(user);
+                                      }}
+                                    >
+                                      <EditIcon />
+                                    </IconButton>
+                                  </Tooltip>
+                                </HStack>
                               </HStack>
                             </VStack>
                           </AccordionPanel>