Skip to content

Commit 1f8f8fa

Browse files
yasellyasell
committed
feat: update profile-settings page
1 parent cd59477 commit 1f8f8fa

32 files changed

+825
-900
lines changed

‎apps/gitness/src/pages-v2/profile-settings/profile-settings-general-container.tsx

+2-2
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { useEffect, useState } from 'react'
1+
import { FC, useEffect, useState } from 'react'
22

33
import {
44
GetUserErrorResponse,
@@ -17,7 +17,7 @@ import {
1717
import { useTranslationStore } from '../../i18n/stores/i18n-store'
1818
import { useProfileSettingsStore } from './stores/profile-settings-store'
1919

20-
export const SettingsProfileGeneralPage: React.FC = () => {
20+
export const SettingsProfileGeneralPage: FC = () => {
2121
const { setUserData } = useProfileSettingsStore()
2222
const [apiError, setApiError] = useState<{ type: ProfileSettingsErrorType; message: string } | null>(null)
2323

‎apps/gitness/src/pages-v2/profile-settings/profile-settings-keys-container.tsx

+12-11
Original file line numberDiff line numberDiff line change
@@ -22,19 +22,17 @@ import { DeleteAlertDialog } from '@harnessio/ui/components'
2222
import {
2323
AlertDeleteParams,
2424
ApiErrorType,
25+
ProfileSettingsKeysCreateDialog,
26+
ProfileSettingsTokenCreateDialog,
27+
ProfileSettingsTokenSuccessDialog,
2528
SettingsAccountKeysPage,
26-
SshKeyCreateDialog,
27-
TokenCreateDialog,
28-
TokensList,
29-
TokenSuccessDialog
29+
TokensList
3030
} from '@harnessio/ui/views'
3131

3232
import { useTranslationStore } from '../../i18n/stores/i18n-store'
3333
import { useProfileSettingsStore } from './stores/profile-settings-store'
3434

3535
export const SettingsProfileKeysPage = () => {
36-
const CONVERT_DAYS_TO_NANO_SECONDS = 24 * 60 * 60 * 1000 * 1000000
37-
3836
const {
3937
createdTokenData,
4038
setCreatedTokenData,
@@ -51,6 +49,7 @@ export const SettingsProfileKeysPage = () => {
5149
const [isAlertDeleteDialogOpen, setIsAlertDeleteDialogOpen] = useState(false)
5250
const [alertParams, setAlertParams] = useState<AlertDeleteParams | null>(null)
5351
const [searchParams] = useSearchParams()
52+
const CONVERT_DAYS_TO_NANO_SECONDS = 24 * 60 * 60 * 1000 * 1000000
5453

5554
const [apiError, setApiError] = useState<{
5655
type: ApiErrorType
@@ -63,15 +62,18 @@ export const SettingsProfileKeysPage = () => {
6362
setCreateTokenDialog(true)
6463
setApiError(null)
6564
}
65+
6666
const closeTokenDialog = () => setCreateTokenDialog(false)
6767

6868
const openSshKeyDialog = () => {
6969
setSshKeyDialog(true)
7070
setApiError(null)
7171
}
72+
7273
const closeSshKeyDialog = () => setSshKeyDialog(false)
7374

7475
const closeAlertDeleteDialog = () => setIsAlertDeleteDialogOpen(false)
76+
7577
const openAlertDeleteDialog = ({ identifier, type }: AlertDeleteParams) => {
7678
setIsAlertDeleteDialogOpen(true)
7779
setAlertParams({ identifier, type })
@@ -193,8 +195,7 @@ export const SettingsProfileKeysPage = () => {
193195
}
194196

195197
if (tokenData.lifetime.toLowerCase() !== 'never') {
196-
const convertedLifetime = parseInt(tokenData.lifetime, 10) * CONVERT_DAYS_TO_NANO_SECONDS
197-
body.lifetime = convertedLifetime
198+
body.lifetime = parseInt(tokenData.lifetime, 10) * CONVERT_DAYS_TO_NANO_SECONDS
198199
}
199200

200201
createTokenMutation.mutate({ body })
@@ -225,22 +226,22 @@ export const SettingsProfileKeysPage = () => {
225226
headers={headers}
226227
useTranslationStore={useTranslationStore}
227228
/>
228-
<TokenCreateDialog
229+
<ProfileSettingsTokenCreateDialog
229230
open={openCreateTokenDialog}
230231
onClose={closeTokenDialog}
231232
handleCreateToken={handleCreateToken}
232233
error={apiError}
233234
isLoading={createTokenMutation.isLoading}
234235
useTranslationStore={useTranslationStore}
235236
/>
236-
<SshKeyCreateDialog
237+
<ProfileSettingsKeysCreateDialog
237238
open={saveSshKeyDialog}
238239
onClose={closeSshKeyDialog}
239240
handleCreateSshKey={handleCreateSshKey}
240241
error={apiError}
241242
useTranslationStore={useTranslationStore}
242243
/>
243-
<TokenSuccessDialog
244+
<ProfileSettingsTokenSuccessDialog
244245
open={openSuccessTokenDialog && !!createdTokenData}
245246
onClose={closeSuccessTokenDialog}
246247
useProfileSettingsStore={useProfileSettingsStore}

‎apps/gitness/src/pages-v2/profile-settings/settings-layout.tsx

-19
This file was deleted.

‎apps/gitness/src/routes.tsx

+5-24
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@ import { ReactElement } from 'react'
22
import { Navigate } from 'react-router-dom'
33

44
import { Breadcrumb, Text } from '@harnessio/ui/components'
5-
import { EmptyPage, RepoSettingsLayout, SandboxLayout } from '@harnessio/ui/views'
5+
import { EmptyPage, ProfileSettingsLayout, RepoSettingsLayout, SandboxLayout } from '@harnessio/ui/views'
66

77
import { AppShell, AppShellMFE } from './components-v2/app-shell'
88
import { ProjectDropdown } from './components-v2/breadcrumbs/project-dropdown'
@@ -17,7 +17,6 @@ import ProjectPipelineListPage from './pages-v2/pipeline/project-pipeline-list-p
1717
import { SettingsProfileGeneralPage } from './pages-v2/profile-settings/profile-settings-general-container'
1818
import { SettingsProfileKeysPage } from './pages-v2/profile-settings/profile-settings-keys-container'
1919
import { ProfileSettingsThemePage } from './pages-v2/profile-settings/profile-settings-theme-page'
20-
import { SettingsLayout as ProfileSettingsLayout } from './pages-v2/profile-settings/settings-layout'
2120
import { ProjectGeneralSettingsPageContainer } from './pages-v2/project/project-general-settings-container'
2221
import { ProjectLabelsList } from './pages-v2/project/project-labels-list-container'
2322
import { ProjectMemberListPage } from './pages-v2/project/project-member-list'
@@ -760,37 +759,19 @@ export const routes: CustomRouteObject[] = [
760759
},
761760
{
762761
path: 'profile-settings',
763-
element: <ProfileSettingsLayout />,
764-
handle: {
765-
breadcrumb: () => (
766-
<>
767-
<Text>User</Text>
768-
<Breadcrumb.Separator className="mx-2.5" />
769-
<Text>Settings</Text>
770-
</>
771-
)
772-
},
762+
element: <ProfileSettingsLayout useTranslationStore={useTranslationStore} />,
773763
children: [
774764
{
775765
index: true,
776-
element: <SettingsProfileGeneralPage />,
777-
handle: {
778-
breadcrumb: () => <Text>General</Text>
779-
}
766+
element: <Navigate to="general" replace />
780767
},
781768
{
782769
path: 'general',
783-
element: <SettingsProfileGeneralPage />,
784-
handle: {
785-
breadcrumb: () => <Text>General</Text>
786-
}
770+
element: <SettingsProfileGeneralPage />
787771
},
788772
{
789773
path: 'keys',
790-
element: <SettingsProfileKeysPage />,
791-
handle: {
792-
breadcrumb: () => <Text>Keys</Text>
793-
}
774+
element: <SettingsProfileKeysPage />
794775
}
795776
]
796777
}

‎packages/ui/locales/en/views.json

+8-6
Original file line numberDiff line numberDiff line change
@@ -10,6 +10,8 @@
1010
"pull-requests": "Pull Requests",
1111
"branches": "Branches",
1212
"settings": "Settings",
13+
"generalTab": "General",
14+
"keysTab": "Keys and tokens",
1315
"error": "Error:",
1416
"cancel": "Cancel",
1517
"tags": "Tags",
@@ -282,12 +284,12 @@
282284
"token": "Token",
283285
"tokenSuccessDescription": "Your token has been generated. Please make sure to copy and store your token somewhere safe, you won’t beable to see it again.",
284286
"gotItButton": "Got it",
285-
"general": "General",
287+
"accountSettings": "Account settings",
286288
"personalInfo": "Personal information",
287289
"enterUsernamePlaceholder": "Enter your username",
288290
"username": "Username",
289291
"accountEmail": "Account email",
290-
"upatingProfileButton": "Updating...",
292+
"updatingProfileButton": "Updating...",
291293
"updateProfileButton": "Update profile",
292294
"updatedButton": "Updated",
293295
"passwordSettingsTitle": "Password settings",
@@ -296,17 +298,17 @@
296298
"newPassword": "New password",
297299
"confirmPasswordPlaceholder": "Confirm your new password",
298300
"confirmPassword": "Confirm password",
299-
"upadtingPasswordButton": "Updating...",
301+
"updatingPasswordButton": "Updating...",
300302
"updatePasswordButton": "Update password",
301303
"keysAndTokens": "Keys and Tokens",
302304
"personalAccessToken": "Personal access token",
303305
"addToken": "Add new token",
304306
"addTokenDescription": "Personal access tokens allow you to authenticate with the API.",
305307
"sshKeys": "My SSH keys",
306-
"addSshKey": "Add new SSH key",
307308
"addSshKeyDescription": "SSH keys allow you to establish a secure connection to your code repository.",
308-
"GeneralTab": "General",
309-
"KeysTab": "Keys and Tokens"
309+
"addSshKey": "Add new SSH key",
310+
"generalTab": "General",
311+
"keysTab": "Keys and Tokens"
310312
},
311313
"forms": {
312314
"selectMemberError": "Member is required",

‎packages/ui/locales/es/views.json

+8-6
Original file line numberDiff line numberDiff line change
@@ -10,6 +10,8 @@
1010
"pull-requests": "Pull Requests",
1111
"branches": "Branches",
1212
"settings": "Settings",
13+
"generalTab": "General",
14+
"keysTab": "Keys and tokens",
1315
"error": "Error:",
1416
"cancel": "Cancel",
1517
"tags": "Tags",
@@ -277,12 +279,12 @@
277279
"token": "Token",
278280
"tokenSuccessDescription": "Your token has been generated. Please make sure to copy and store your token somewhere safe, you won’t beable to see it again.",
279281
"gotItButton": "Got it",
280-
"general": "General",
282+
"accountSettings": "Account settings",
281283
"personalInfo": "Personal information",
282284
"enterUsernamePlaceholder": "Enter your username",
283285
"username": "Username",
284286
"accountEmail": "Account email",
285-
"upatingProfileButton": "Updating...",
287+
"updatingProfileButton": "Updating...",
286288
"updateProfileButton": "Update profile",
287289
"updatedButton": "Updated",
288290
"passwordSettingsTitle": "Password settings",
@@ -291,17 +293,17 @@
291293
"newPassword": "New password",
292294
"confirmPasswordPlaceholder": "Confirm your new password",
293295
"confirmPassword": "Confirm password",
294-
"upadtingPasswordButton": "Updating...",
296+
"updatingPasswordButton": "Updating...",
295297
"updatePasswordButton": "Update password",
296298
"keysAndTokens": "Keys and Tokens",
297299
"personalAccessToken": "Personal access token",
298300
"addToken": "Add new token",
299301
"addTokenDescription": "Personal access tokens allow you to authenticate with the API.",
300302
"sshKeys": "My SSH keys",
301-
"addSshKey": "Add new SSH key",
302303
"addSshKeyDescription": "SSH keys allow you to establish a secure connection to your code repository.",
303-
"GeneralTab": "General",
304-
"KeysTab": "Keys and Tokens"
304+
"addSshKey": "Add new SSH key",
305+
"generalTab": "General",
306+
"keysTab": "Keys and Tokens"
305307
},
306308
"forms": {
307309
"selectMemberError": "",

‎packages/ui/locales/fr/views.json

+8-6
Original file line numberDiff line numberDiff line change
@@ -10,6 +10,8 @@
1010
"pull-requests": "Requêtes de tirage",
1111
"branches": "Branches",
1212
"settings": "Paramètres",
13+
"generalTab": "General",
14+
"keysTab": "Keys and tokens",
1315
"error": "Erreur :",
1416
"cancel": "Annuler",
1517
"tags": "Étiquettes",
@@ -278,12 +280,12 @@
278280
"token": "Jeton",
279281
"tokenSuccessDescription": "Votre jeton a été généré. Assurez-vous de copier et de stocker votre jeton en lieu sûr, car vous ne pourrez plus le voir.",
280282
"gotItButton": "Compris",
281-
"general": "Général",
283+
"accountSettings": "Paramètres du compte",
282284
"personalInfo": "Informations personnelles",
283285
"enterUsernamePlaceholder": "Entrez votre nom d'utilisateur",
284286
"username": "Nom d'utilisateur",
285287
"accountEmail": "Email du compte",
286-
"upatingProfileButton": "Mise à jour...",
288+
"updatingProfileButton": "Mise à jour...",
287289
"updateProfileButton": "Mettre à jour le profil",
288290
"updatedButton": "Mis à jour",
289291
"passwordSettingsTitle": "Paramètres du mot de passe",
@@ -292,17 +294,17 @@
292294
"newPassword": "Nouveau mot de passe",
293295
"confirmPasswordPlaceholder": "Confirmez votre nouveau mot de passe",
294296
"confirmPassword": "Confirmer le mot de passe",
295-
"upadtingPasswordButton": "Mise à jour...",
297+
"updatingPasswordButton": "Mise à jour...",
296298
"updatePasswordButton": "Mettre à jour le mot de passe",
297299
"keysAndTokens": "Clés et jetons",
298300
"personalAccessToken": "Jeton d'accès personnel",
299301
"addToken": "Ajouter un nouveau jeton",
300302
"addTokenDescription": "Les jetons d'accès personnels vous permettent de vous authentifier avec l'API.",
301303
"sshKeys": "Mes clés SSH",
302-
"addSshKey": "Ajouter une nouvelle clé SSH",
303304
"addSshKeyDescription": "Les clés SSH vous permettent d'établir une connexion sécurisée avec votre dépôt de code.",
304-
"GeneralTab": "Général",
305-
"KeysTab": "Clés et Jetons"
305+
"addSshKey": "Ajouter une nouvelle clé SSH",
306+
"generalTab": "Général",
307+
"keysTab": "Clés et Jetons"
306308
},
307309
"forms": {
308310
"selectMemberError": "",

‎packages/ui/src/components/alert-dialog.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -94,7 +94,7 @@ const AlertDialogTitle = React.forwardRef<
9494
>(({ className, ...props }, ref) => (
9595
<AlertDialogPrimitive.Title
9696
ref={ref}
97-
className={cn('text-foreground-1 text-xl font-semibold tracking-tight', className)}
97+
className={cn('text-foreground-1 text-xl font-medium tracking-tight', className)}
9898
{...props}
9999
/>
100100
))

‎packages/ui/src/components/form-primitives/control-group.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -16,7 +16,7 @@ interface ControlGroupProps extends HTMLAttributes<HTMLDivElement> {
1616
export function ControlGroup({ children, type, className, ...props }: ControlGroupProps) {
1717
return (
1818
<div
19-
className={cn('relative flex flex-col', { 'mt-2': type === 'button' }, className)}
19+
className={cn('relative flex flex-col', { '': type === 'button' }, className)}
2020
role="group"
2121
aria-label={type === 'button' ? 'Button control group' : 'Input control group'}
2222
{...props}

‎packages/ui/src/components/form-primitives/form-wrapper.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -18,7 +18,7 @@ interface FormWrapperProps extends PropsWithChildren, FormHTMLAttributes<HTMLFor
1818
*/
1919
export function FormWrapper({ className, children, ...props }: FormWrapperProps) {
2020
return (
21-
<form className={cn('flex flex-col gap-y-8', className)} {...props}>
21+
<form className={cn('flex flex-col gap-y-7', className)} {...props}>
2222
{children}
2323
</form>
2424
)

‎packages/ui/src/components/form-primitives/legend.tsx

+2-2
Original file line numberDiff line numberDiff line change
@@ -20,11 +20,11 @@ interface LegendProps {
2020
export function Legend({ title, description, className }: LegendProps) {
2121
return (
2222
<div className={className}>
23-
<Text size={3} weight={'medium'} as="p" role="heading">
23+
<Text size={13} weight="medium" as="h2">
2424
{title}
2525
</Text>
2626
{description && (
27-
<Text size={2} as="p" id="fieldset-description">
27+
<Text className="mt-2" size={2} as="p" id="fieldset-description" color="foreground-2">
2828
{description}
2929
</Text>
3030
)}

‎packages/ui/src/components/text.tsx

+10-1
Original file line numberDiff line numberDiff line change
@@ -48,6 +48,7 @@ const textVariants = cva('text-base', {
4848
tertiary: 'text-tertiary',
4949
tertiaryBackground: 'text-foreground-3',
5050
inherit: 'text-inherit',
51+
'foreground-2': 'text-foreground-2',
5152
'foreground-4': 'text-foreground-4',
5253
'foreground-5': 'text-foreground-5'
5354
},
@@ -102,7 +103,15 @@ interface TextProps extends React.ComponentProps<'span'> {
102103
/**
103104
* Sets the color property.
104105
*/
105-
color?: 'primary' | 'secondary' | 'tertiary' | 'tertiaryBackground' | 'foreground-5' | 'foreground-4' | 'inherit'
106+
color?:
107+
| 'primary'
108+
| 'secondary'
109+
| 'tertiary'
110+
| 'tertiaryBackground'
111+
| 'foreground-2'
112+
| 'foreground-4'
113+
| 'foreground-5'
114+
| 'inherit'
106115

107116
/**
108117
* Controls the wrapping behavior of the text.

‎packages/ui/src/views/profile-settings/components/index.ts

+3-3
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,3 @@
1-
export * from './ssh-key-create/ssh-key-create-dialog'
2-
export * from './token-create/token-create-dialog'
3-
export * from './token-create/token-success-dialog'
1+
export * from './profile-settings-keys-create/profile-settings-keys-create-dialog'
2+
export * from './profile-settings-token-create/profile-settings-token-create-dialog'
3+
export * from './profile-settings-token-create/profile-settings-token-success-dialog'

0 commit comments

Comments
 (0)