Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
82 changes: 48 additions & 34 deletions apps/studio/pages/account/me.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -15,6 +15,11 @@ import { GenericSkeletonLoader } from 'components/ui/ShimmeringLoader'
import { useIsFeatureEnabled } from 'hooks/misc/useIsFeatureEnabled'
import { useProfile } from 'lib/profile'
import type { NextPageWithLayout } from 'types'
import {
ScaffoldContainer,
ScaffoldHeader,
ScaffoldSectionTitle,
} from 'components/layouts/Scaffold'

const User: NextPageWithLayout = () => {
return <ProfileCard />
Expand All @@ -39,43 +44,52 @@ const ProfileCard = () => {
const { error, isLoading, isError, isSuccess } = useProfile()

return (
<article>
{isLoading && (
<Panel>
<div className="p-4">
<GenericSkeletonLoader />
</div>
</Panel>
)}
{isError && (
<Panel>
<div className="p-4">
<AlertError error={error} subject="Failed to retrieve account information" />
</div>
</Panel>
)}
{isSuccess && (
<>
{profileShowInformation && isSuccess ? <ProfileInformation /> : null}
<AccountIdentities />
</>
)}
<>
<ScaffoldContainer>
<ScaffoldHeader className="pt-0">
<ScaffoldSectionTitle>Preferences</ScaffoldSectionTitle>
</ScaffoldHeader>
</ScaffoldContainer>
<ScaffoldContainer bottomPadding>
<article>
{isLoading && (
<Panel>
<div className="p-4">
<GenericSkeletonLoader />
</div>
</Panel>
)}
{isError && (
<Panel>
<div className="p-4">
<AlertError error={error} subject="Failed to retrieve account information" />
</div>
</Panel>
)}
{isSuccess && (
<>
{profileShowInformation && isSuccess ? <ProfileInformation /> : null}
<AccountIdentities />
</>
)}

<section>
<AccountConnections />
</section>
<section>
<AccountConnections />
</section>

<section>
<ThemeSettings />
</section>
<section>
<ThemeSettings />
</section>

<section>
<AnalyticsSettings />
</section>
<section>
<AnalyticsSettings />
</section>

<section>
<AccountDeletion />
</section>
</article>
<section>
<AccountDeletion />
</section>
</article>
</ScaffoldContainer>
</>
)
}
56 changes: 35 additions & 21 deletions apps/studio/pages/account/security.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -15,6 +15,11 @@ import {
CollapsibleContent_Shadcn_,
CollapsibleTrigger_Shadcn_,
} from 'ui'
import {
ScaffoldContainer,
ScaffoldHeader,
ScaffoldSectionTitle,
} from 'components/layouts/Scaffold'

const collapsibleClasses = [
'bg-surface-100',
Expand All @@ -33,28 +38,37 @@ const Security: NextPageWithLayout = () => {
const { data } = useMfaListFactorsQuery()

return (
<Collapsible_Shadcn_ className={cn(collapsibleClasses)}>
<CollapsibleTrigger_Shadcn_ asChild>
<button
type="button"
className="group flex w-full items-center justify-between rounded py-3 px-4 md:px-6 text-foreground"
>
<div className="flex flex-row gap-4 items-center py-1">
<Smartphone strokeWidth={1.5} />
<span className="text-sm">Authenticator app</span>
</div>
<>
<ScaffoldContainer>
<ScaffoldHeader className="pt-0">
<ScaffoldSectionTitle>Security</ScaffoldSectionTitle>
</ScaffoldHeader>
</ScaffoldContainer>
<ScaffoldContainer bottomPadding>
<Collapsible_Shadcn_ className={cn(collapsibleClasses)}>
<CollapsibleTrigger_Shadcn_ asChild>
<button
type="button"
className="group flex w-full items-center justify-between rounded py-3 px-4 md:px-6 text-foreground"
>
<div className="flex flex-row gap-4 items-center py-1">
<Smartphone strokeWidth={1.5} />
<span className="text-sm">Authenticator app</span>
</div>

{data ? (
<Badge variant={data.totp.length === 0 ? 'default' : 'brand'}>
{data.totp.length} app{data.totp.length === 1 ? '' : 's'} configured
</Badge>
) : null}
</button>
</CollapsibleTrigger_Shadcn_>
<CollapsibleContent_Shadcn_ className="group border-t border-default bg-surface-100 py-6 px-4 md:px-6 text-foreground">
<TOTPFactors />
</CollapsibleContent_Shadcn_>
</Collapsible_Shadcn_>
{data ? (
<Badge variant={data.totp.length === 0 ? 'default' : 'brand'}>
{data.totp.length} app{data.totp.length === 1 ? '' : 's'} configured
</Badge>
) : null}
</button>
</CollapsibleTrigger_Shadcn_>
<CollapsibleContent_Shadcn_ className="group border-t border-default bg-surface-100 py-6 px-4 md:px-6 text-foreground">
<TOTPFactors />
</CollapsibleContent_Shadcn_>
</Collapsible_Shadcn_>
</ScaffoldContainer>
</>
)
}

Expand Down
7 changes: 1 addition & 6 deletions apps/studio/pages/account/tokens.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,6 @@ import DefaultLayout from 'components/layouts/DefaultLayout'
import OrganizationLayout from 'components/layouts/OrganizationLayout'
import {
ScaffoldContainer,
ScaffoldDescription,
ScaffoldHeader,
ScaffoldSectionTitle,
} from 'components/layouts/Scaffold'
Expand All @@ -27,12 +26,8 @@ const UserAccessTokens: NextPageWithLayout = () => {
return (
<>
<ScaffoldContainer>
<ScaffoldHeader className="pt-0 mb-6">
<ScaffoldHeader className="pt-0">
<ScaffoldSectionTitle>Access Tokens</ScaffoldSectionTitle>
<ScaffoldDescription>
Personal access tokens can be used to control your whole account and use features added
in the future. Be careful when sharing them!
</ScaffoldDescription>
</ScaffoldHeader>
</ScaffoldContainer>
<ScaffoldContainer bottomPadding>
Expand Down
6 changes: 4 additions & 2 deletions apps/studio/state/storage-explorer.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -345,7 +345,7 @@ function createStorageExplorerState({
})
}

const newFolder = state.columns[columnIndex].items.find((x) => x.name === formattedName)
const newFolder = state.columns[columnIndex].items?.find((x) => x.name === formattedName)
if (newFolder) state.openFolder(columnIndex, newFolder)
},

Expand Down Expand Up @@ -1654,7 +1654,9 @@ function createStorageExplorerState({
const currentColumnItems = currentColumn.items.filter(
(item) => item.status !== STORAGE_ROW_STATUS.EDITING
)
const hasSameNameInColumn = currentColumnItems.filter((item) => item.name === name).length > 0
const hasSameNameInColumn =
currentColumnItems.filter((item) => item.name.toLowerCase() === name.toLowerCase()).length >
0

if (hasSameNameInColumn) {
if (autofix) {
Expand Down
Loading