feat(ui): Make settings pages look more consistent (#720)

TracecatHQ · Jan 9, 2025 · 47c9e52 · 47c9e52
1 parent 62abbd2
commit 47c9e52
Show file tree

Hide file tree

Showing 6 changed files with 38 additions and 50 deletions.
diff --git a/frontend/src/app/organization/settings/auth/page.tsx b/frontend/src/app/organization/settings/auth/page.tsx
@@ -1,25 +1,22 @@
 "use client"
 
-import { Separator } from "@/components/ui/separator"
 import { OrgSettingsAuthForm } from "@/components/organization/org-settings-auth"
 
 export default function AuthSettingsPage() {
   return (
     <div className="size-full overflow-auto">
       <div className="container flex h-full max-w-[1000px] flex-col space-y-12">
-        <div className="space-y-8">
-          <div className="flex w-full">
-            <div className="items-start space-y-3 text-left">
-              <h2 className="text-2xl font-semibold tracking-tight">
-                Authentication
-              </h2>
-              <p className="text-md text-muted-foreground">
-                View and manage your organization authentication settings here.
-              </p>
-            </div>
+        <div className="flex w-full">
+          <div className="items-start space-y-3 text-left">
+            <h2 className="text-2xl font-semibold tracking-tight">
+              Authentication
+            </h2>
+            <p className="text-md text-muted-foreground">
+              View and manage your organization authentication settings here.
+            </p>
           </div>
-          <Separator />
         </div>
+
         <OrgSettingsAuthForm />
       </div>
     </div>

diff --git a/frontend/src/app/organization/settings/git/page.tsx b/frontend/src/app/organization/settings/git/page.tsx
@@ -1,25 +1,22 @@
 "use client"
 
-import { Separator } from "@/components/ui/separator"
 import { OrgSettingsGitForm } from "@/components/organization/org-settings-git"
 
 export default function GitSettingsPage() {
   return (
     <div className="size-full overflow-auto">
       <div className="container flex h-full max-w-[1000px] flex-col space-y-12">
-        <div className="space-y-8">
-          <div className="flex w-full">
-            <div className="items-start space-y-3 text-left">
-              <h2 className="text-2xl font-semibold tracking-tight">
-                Git Repository
-              </h2>
-              <p className="text-md text-muted-foreground">
-                View and manage your organization Git settings here.
-              </p>
-            </div>
+        <div className="flex w-full">
+          <div className="items-start space-y-3 text-left">
+            <h2 className="text-2xl font-semibold tracking-tight">
+              Git Repository
+            </h2>
+            <p className="text-md text-muted-foreground">
+              View and manage your organization Git settings here.
+            </p>
           </div>
-          <Separator />
         </div>
+
         <OrgSettingsGitForm />
       </div>
     </div>

diff --git a/frontend/src/app/organization/settings/oauth/page.tsx b/frontend/src/app/organization/settings/oauth/page.tsx
@@ -1,25 +1,22 @@
 "use client"
 
-import { Separator } from "@/components/ui/separator"
 import { OrgSettingsOAuthForm } from "@/components/organization/org-settings-oauth"
 
 export default function OAuthSettingsPage() {
   return (
     <div className="size-full overflow-auto">
       <div className="container flex h-full max-w-[1000px] flex-col space-y-12">
-        <div className="space-y-8">
-          <div className="flex w-full">
-            <div className="items-start space-y-3 text-left">
-              <h2 className="text-2xl font-semibold tracking-tight">
-                OAuth Settings
-              </h2>
-              <p className="text-md text-muted-foreground">
-                View and manage your organization OAuth settings here.
-              </p>
-            </div>
+        <div className="flex w-full">
+          <div className="items-start space-y-3 text-left">
+            <h2 className="text-2xl font-semibold tracking-tight">
+              OAuth Settings
+            </h2>
+            <p className="text-md text-muted-foreground">
+              View and manage your organization OAuth settings here.
+            </p>
           </div>
-          <Separator />
         </div>
+
         <OrgSettingsOAuthForm />
       </div>
     </div>

diff --git a/frontend/src/app/organization/settings/sso/page.tsx b/frontend/src/app/organization/settings/sso/page.tsx
@@ -1,25 +1,22 @@
 "use client"
 
-import { Separator } from "@/components/ui/separator"
 import { OrgSettingsSsoForm } from "@/components/organization/org-settings-sso"
 
 export default function SsoSettingsPage() {
   return (
     <div className="size-full overflow-auto">
       <div className="container flex h-full max-w-[1000px] flex-col space-y-12">
-        <div className="space-y-8">
-          <div className="flex w-full">
-            <div className="items-start space-y-3 text-left">
-              <h2 className="text-2xl font-semibold tracking-tight">
-                SAML Single Sign-On
-              </h2>
-              <p className="text-md text-muted-foreground">
-                View and manage your organization SAML SSO settings here.
-              </p>
-            </div>
+        <div className="flex w-full">
+          <div className="items-start space-y-3 text-left">
+            <h2 className="text-2xl font-semibold tracking-tight">
+              SAML Single Sign-On
+            </h2>
+            <p className="text-md text-muted-foreground">
+              View and manage your organization SAML SSO settings here.
+            </p>
           </div>
-          <Separator />
         </div>
+
         <OrgSettingsSsoForm />
       </div>
     </div>

diff --git a/frontend/src/app/registry/sidebar-nav.tsx b/frontend/src/app/registry/sidebar-nav.tsx
@@ -32,7 +32,7 @@ interface SidebarNavProps extends React.HTMLAttributes<HTMLElement> {
 
 export function RegistrySidebarNav() {
   return (
-    <div className="h-full space-y-4 border-r pr-4 pt-16">
+    <div className="h-full space-y-4 pr-4 pt-16">
       <div className="space-y-0.5">
         <h2 className="text-xl font-bold tracking-tight">Registry</h2>
       </div>

diff --git a/frontend/src/app/workspaces/[workspaceId]/settings/sidebar-nav.tsx b/frontend/src/app/workspaces/[workspaceId]/settings/sidebar-nav.tsx
@@ -42,7 +42,7 @@ interface SidebarNavProps extends React.HTMLAttributes<HTMLElement> {
 
 export function SidebarNav() {
   return (
-    <div className="h-full space-y-4 border-r pr-4 pt-16">
+    <div className="h-full space-y-4 pr-4 pt-16">
       <div className="space-y-0.5">
         <h2 className="text-xl font-bold tracking-tight">Settings</h2>
       </div>