External/portabase
1
0
Fork 0
mirror of https://github.com/Portabase/portabase.git synced 2026-07-14 11:16:13 +02:00
Code Issues Packages Projects Releases Wiki Activity

fix: some fix responsive

Browse Source
This commit is contained in:
charlesgauthereau
2026-01-29 23:46:04 +01:00
parent 30b9fc7765
commit 966edfa85a
5 changed files with 66 additions and 55 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/wrappers/dashboard/admin/settings/settings-tabs.tsx
+36 -20
View File
@@ -7,6 +7,7 @@ import {Setting} from "@/db/schema/01_setting";
import {SettingsEmailSection} from "@/components/wrappers/dashboard/admin/settings/email/settings-email-section";
import {SettingsStorageSection} from "@/components/wrappers/dashboard/admin/settings/storage/settings-storage-section";
import {StorageChannelWith} from "@/db/schema/12_storage-channel";
import {MailboxIcon, Save} from "lucide-react";
export type SettingsTabsProps = {
settings: Setting
@@ -30,29 +31,44 @@ export const SettingsTabs = ({settings, storageChannels}: SettingsTabsProps) =>
};
const tabs = [
{
name: 'System Email',
value: 'email',
icon: MailboxIcon,
content: (
<SettingsEmailSection settings={settings}/>
)
},
{
name: 'Default Storage',
value: 'storage',
icon: Save,
content: (
<SettingsStorageSection storageChannels={storageChannels} settings={settings}/>
)
}
]
return (
<div className="h-full mt-3">
<Tabs className="h-full" value={tab} onValueChange={handleChangeTab}>
<TabsList className='bg-background rounded-none border-b p-0 min-w-48'>
<TabsTrigger
value="email"
className='bg-background data-[state=active]:border-primary dark:data-[state=active]:border-primary h-full rounded-none border-0 border-b-2 border-transparent data-[state=active]:shadow-none'
>
Email
</TabsTrigger>
<TabsTrigger
value="storage"
className='bg-background data-[state=active]:border-primary dark:data-[state=active]:border-primary h-full rounded-none border-0 border-b-2 border-transparent data-[state=active]:shadow-none'
>
Default storage
</TabsTrigger>
<Tabs className="h-full gap-4" value={tab} onValueChange={handleChangeTab}>
<TabsList>
{tabs.map(({icon: Icon, name, value}) => (
<TabsTrigger key={value} value={value} className='flex items-center gap-1 px-2.5 sm:px-3'>
<Icon/>
{name}
</TabsTrigger>
))}
</TabsList>
<TabsContent className="h-full" value="email">
<SettingsEmailSection settings={settings}/>
</TabsContent>
<TabsContent className="h-full" value="storage">
<SettingsStorageSection storageChannels={storageChannels} settings={settings}/>
</TabsContent>
{tabs.map(tab => (
<TabsContent key={tab.value} value={tab.value} className="h-full">
{tab.content}
</TabsContent>
))}
</Tabs>
</div>
src/components/wrappers/dashboard/admin/settings/storage/settings-storage-section.tsx
+10 -10
View File
@@ -64,15 +64,15 @@ export const SettingsStorageSection = ({settings, storageChannels}: SettingsStor
await mutation.mutateAsync(values);
}}
>
<div className="flex items-center gap-3">
<div className="flex flex-wrap items-center gap-3">
<FormField
control={form.control}
name="storageChannelId"
render={({field}) => (
<FormItem className="flex items-center justify-center">
render={({ field }) => (
<FormItem className="flex-grow min-w-[200px] sm:flex-grow-0 sm:w-64">
<Select value={field.value} onValueChange={field.onChange}>
<SelectTrigger className="w-90 h-full mb-0">
<SelectValue placeholder="Select a default storage channel"/>
<SelectTrigger className="w-full h-full mb-0">
<SelectValue placeholder="Select a default storage channel" />
</SelectTrigger>
<SelectContent>
{storageChannels.map((channel) => (
@@ -80,10 +80,9 @@ export const SettingsStorageSection = ({settings, storageChannels}: SettingsStor
<div className="flex items-center gap-2">
{getChannelIcon(channel.provider)}
<span className="font-medium">{channel.name}</span>
<span
className="text-[9px] uppercase bg-secondary px-1.5 py-0.5 rounded">
{channel.provider}
</span>
<span className="text-[9px] uppercase bg-secondary px-1.5 py-0.5 rounded">
{channel.provider}
</span>
</div>
</SelectItem>
))}
@@ -92,10 +91,11 @@ export const SettingsStorageSection = ({settings, storageChannels}: SettingsStor
</FormItem>
)}
/>
<ButtonWithLoading type="submit">
<ButtonWithLoading className="flex-shrink-0 w-full sm:w-auto" type="submit">
Confirm
</ButtonWithLoading>
</div>
</Form>
</div>
</div>