Merge pull request #776 from gravitl/kwesi/net-1598-all-delete-btns-a…

…nd-sub-menu-items-shou style(NET-1598): use danger color for delete actions, adjust paginations
gravitl · Sep 18, 2024 · 6ae4bd2 · 6ae4bd2
2 parents af5d38f + 3ac40f4
commit 6ae4bd2
Show file tree

Hide file tree

Showing 5 changed files with 17 additions and 5 deletions.
diff --git a/src/layouts/MainLayout.tsx b/src/layouts/MainLayout.tsx
@@ -550,7 +550,7 @@ export default function MainLayout() {
                   {canUpgrade && <CloudSyncOutlined style={{ marginLeft: '.5rem' }} className="update-btn" />}
                 </Typography.Text>
                 <br />
-                <Typography.Text style={{ fontSize: 'inherit' }} type="secondary">
+                <Typography.Text style={{ fontSize: 'inherit' }}>
                   Server: {store.serverConfig?.Version ?? 'n/a'}
                 </Typography.Text>
               </div>

diff --git a/src/pages/enrollment-keys/EnrollmentKeysPage.tsx b/src/pages/enrollment-keys/EnrollmentKeysPage.tsx
@@ -416,6 +416,7 @@ export default function EnrollmentKeysPage(props: PageProps) {
                       };
                     }}
                     ref={enrollmentKeysTableRef}
+                    pagination={{ size: 'small', hideOnSinglePage: true, pageSize: 50 }}
                   />
                 </div>
               </Col>

diff --git a/src/pages/networks/NetworkDetailsPage.tsx b/src/pages/networks/NetworkDetailsPage.tsx
@@ -1351,10 +1351,11 @@ export default function NetworkDetailsPage(props: PageProps) {
                 items: [
                   {
                     key: 'delete',
+                    danger: true,
                     label: (
-                      <Typography.Text>
+                      <>
                         <DeleteOutlined /> Stop being relayed
-                      </Typography.Text>
+                      </>
                     ),
                     onClick: (info) => {
                       confirmRemoveRelayed(
@@ -2391,6 +2392,7 @@ export default function NetworkDetailsPage(props: PageProps) {
     confirmNodeFailoverStatusChange,
     disconnectNodeFromNetwork,
     removeNodeFromNetwork,
+    store.currentTheme,
   ]);
 
   const getDnsContent = useCallback(() => {
@@ -3613,6 +3615,7 @@ export default function NetworkDetailsPage(props: PageProps) {
     relays.length,
     getRelayContent,
     internetGatewaysCount,
+    isAddInternetGatewayModalOpen,
   ]);
 
   const loadMetrics = useCallback(async () => {

diff --git a/src/pages/networks/NetworksPage.tsx b/src/pages/networks/NetworksPage.tsx
@@ -409,6 +409,7 @@ export default function NetworksPage(props: PageProps) {
                       };
                     }}
                     ref={tableColumnsNameRow}
+                    pagination={{ size: 'small', hideOnSinglePage: true, pageSize: 50 }}
                   />
                 </div>
               </Col>

diff --git a/src/pages/users/UsersPage.tsx b/src/pages/users/UsersPage.tsx
@@ -377,6 +377,7 @@ export default function UsersPage(props: PageProps) {
                   const items = [
                     {
                       key: 'delete',
+                      danger: true,
                       disabled: !canDeleteUser(user)[0],
                       title: canDeleteUser(user)[0] ? canDeleteUser(user)[1] : '',
                       label: 'Delete',
@@ -390,6 +391,7 @@ export default function UsersPage(props: PageProps) {
                       ? [
                           {
                             key: 'transfer',
+                            danger: false,
                             label: 'Transfer Super Admin Rights',
                             disabled: false,
                             title: '',
@@ -405,6 +407,7 @@ export default function UsersPage(props: PageProps) {
                   if (!isSaasBuild) {
                     items?.unshift({
                       key: 'edit',
+                      danger: false,
                       label: 'Change Password',
                       disabled: !canChangePassword(user)[0],
                       title: canChangePassword(user)[0] ? canChangePassword(user)[1] : '',
@@ -501,7 +504,7 @@ export default function UsersPage(props: PageProps) {
                 </Tooltip>
               </Col> */}
               <Col>
-                <Button onClick={() => confirmDeleteInvite(invite)}>
+                <Button danger onClick={() => confirmDeleteInvite(invite)}>
                   <DeleteOutlined /> Delete
                 </Button>
               </Col>
@@ -534,7 +537,7 @@ export default function UsersPage(props: PageProps) {
                 </Button>
               </Col>
               <Col>
-                <Button onClick={() => confirmDenyUser(user)}>
+                <Button danger onClick={() => confirmDenyUser(user)}>
                   <StopOutlined /> Deny
                 </Button>
               </Col>
@@ -668,6 +671,7 @@ export default function UsersPage(props: PageProps) {
                 }}
                 ref={usersTableRef}
                 loading={isLoadingUsers}
+                pagination={{ size: 'small', hideOnSinglePage: true, pageSize: 50 }}
               />
             </div>
           </Col>
@@ -736,6 +740,7 @@ export default function UsersPage(props: PageProps) {
                 scroll={{
                   x: true,
                 }}
+                pagination={{ size: 'small', hideOnSinglePage: true, pageSize: 50 }}
               />
             </div>
           </Col>
@@ -800,10 +805,12 @@ export default function UsersPage(props: PageProps) {
                 columns={pendingUsersTableColumns}
                 dataSource={filteredPendingUsers}
                 rowKey="username"
+                size="small"
                 scroll={{
                   x: true,
                 }}
                 ref={pendingUsersTableRef}
+                pagination={{ size: 'small', hideOnSinglePage: true, pageSize: 50 }}
               />
             </div>
           </Col>