mirror of
https://github.com/mountain-loop/yaak.git
synced 2026-04-25 10:18:31 +02:00
Fix plugin settings layout
This commit is contained in:
@@ -39,9 +39,9 @@ const tabs = [
|
|||||||
TAB_THEME,
|
TAB_THEME,
|
||||||
TAB_INTERFACE,
|
TAB_INTERFACE,
|
||||||
TAB_SHORTCUTS,
|
TAB_SHORTCUTS,
|
||||||
|
TAB_PLUGINS,
|
||||||
TAB_CERTIFICATES,
|
TAB_CERTIFICATES,
|
||||||
TAB_PROXY,
|
TAB_PROXY,
|
||||||
TAB_PLUGINS,
|
|
||||||
TAB_LICENSE,
|
TAB_LICENSE,
|
||||||
] as const;
|
] as const;
|
||||||
export type SettingsTab = (typeof tabs)[number];
|
export type SettingsTab = (typeof tabs)[number];
|
||||||
@@ -120,7 +120,7 @@ export default function Settings({ hide }: Props) {
|
|||||||
value === TAB_CERTIFICATES ? (
|
value === TAB_CERTIFICATES ? (
|
||||||
<CountBadge count={settings.clientCertificates.length} />
|
<CountBadge count={settings.clientCertificates.length} />
|
||||||
) : value === TAB_PLUGINS ? (
|
) : value === TAB_PLUGINS ? (
|
||||||
<CountBadge count={plugins.length} />
|
<CountBadge count={plugins.filter((p) => p.source !== 'bundled').length} />
|
||||||
) : value === TAB_PROXY && settings.proxy?.type === 'enabled' ? (
|
) : value === TAB_PROXY && settings.proxy?.type === 'enabled' ? (
|
||||||
<CountBadge count />
|
<CountBadge count />
|
||||||
) : value === TAB_LICENSE && licenseCheck.check.data?.status === 'personal_use' ? (
|
) : value === TAB_LICENSE && licenseCheck.check.data?.status === 'personal_use' ? (
|
||||||
@@ -141,7 +141,7 @@ export default function Settings({ hide }: Props) {
|
|||||||
<TabContent value={TAB_SHORTCUTS} className="overflow-y-auto h-full px-6 !py-4">
|
<TabContent value={TAB_SHORTCUTS} className="overflow-y-auto h-full px-6 !py-4">
|
||||||
<SettingsHotkeys />
|
<SettingsHotkeys />
|
||||||
</TabContent>
|
</TabContent>
|
||||||
<TabContent value={TAB_PLUGINS} className="h-full grid grid-rows-1 px-6 !py-4">
|
<TabContent value={TAB_PLUGINS} className="h-full grid grid-rows-1">
|
||||||
<SettingsPlugins defaultSubtab={mainTab === TAB_PLUGINS ? subtab : undefined} />
|
<SettingsPlugins defaultSubtab={mainTab === TAB_PLUGINS ? subtab : undefined} />
|
||||||
</TabContent>
|
</TabContent>
|
||||||
<TabContent value={TAB_PROXY} className="overflow-y-auto h-full px-6 !py-4">
|
<TabContent value={TAB_PROXY} className="overflow-y-auto h-full px-6 !py-4">
|
||||||
|
|||||||
@@ -9,6 +9,7 @@ import {
|
|||||||
searchPlugins,
|
searchPlugins,
|
||||||
uninstallPlugin,
|
uninstallPlugin,
|
||||||
} from '@yaakapp-internal/plugins';
|
} from '@yaakapp-internal/plugins';
|
||||||
|
import classNames from 'classnames';
|
||||||
import { useAtomValue } from 'jotai';
|
import { useAtomValue } from 'jotai';
|
||||||
import { useState } from 'react';
|
import { useState } from 'react';
|
||||||
import { useDebouncedValue } from '../../hooks/useDebouncedValue';
|
import { useDebouncedValue } from '../../hooks/useDebouncedValue';
|
||||||
@@ -49,6 +50,7 @@ export function SettingsPlugins({ defaultSubtab }: SettingsPluginsProps) {
|
|||||||
defaultValue={defaultSubtab}
|
defaultValue={defaultSubtab}
|
||||||
label="Plugins"
|
label="Plugins"
|
||||||
addBorders
|
addBorders
|
||||||
|
tabListClassName="px-6 pt-2"
|
||||||
tabs={[
|
tabs={[
|
||||||
{ label: 'Discover', value: 'search' },
|
{ label: 'Discover', value: 'search' },
|
||||||
{
|
{
|
||||||
@@ -63,13 +65,13 @@ export function SettingsPlugins({ defaultSubtab }: SettingsPluginsProps) {
|
|||||||
},
|
},
|
||||||
]}
|
]}
|
||||||
>
|
>
|
||||||
<TabContent value="search">
|
<TabContent value="search" className="px-6">
|
||||||
<PluginSearch />
|
<PluginSearch />
|
||||||
</TabContent>
|
</TabContent>
|
||||||
<TabContent value="installed" className="pb-0">
|
<TabContent value="installed" className="pb-0">
|
||||||
<div className="h-full grid grid-rows-[minmax(0,1fr)_auto]">
|
<div className="h-full grid grid-rows-[minmax(0,1fr)_auto]">
|
||||||
<InstalledPlugins plugins={installedPlugins} />
|
<InstalledPlugins plugins={installedPlugins} className="px-6" />
|
||||||
<footer className="grid grid-cols-[minmax(0,1fr)_auto] -mx-4 py-2 px-4 border-t bg-surface-highlight border-border-subtle min-w-0">
|
<footer className="grid grid-cols-[minmax(0,1fr)_auto] py-2 px-4 border-t bg-surface-highlight border-border-subtle min-w-0">
|
||||||
<SelectFile
|
<SelectFile
|
||||||
size="xs"
|
size="xs"
|
||||||
noun="Plugin"
|
noun="Plugin"
|
||||||
@@ -111,7 +113,7 @@ export function SettingsPlugins({ defaultSubtab }: SettingsPluginsProps) {
|
|||||||
</footer>
|
</footer>
|
||||||
</div>
|
</div>
|
||||||
</TabContent>
|
</TabContent>
|
||||||
<TabContent value="bundled" className="pb-0">
|
<TabContent value="bundled" className="pb-0 px-6">
|
||||||
<BundledPlugins plugins={bundledPlugins} />
|
<BundledPlugins plugins={bundledPlugins} />
|
||||||
</TabContent>
|
</TabContent>
|
||||||
</Tabs>
|
</Tabs>
|
||||||
@@ -330,9 +332,9 @@ function PluginSearch() {
|
|||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
function InstalledPlugins({ plugins }: { plugins: Plugin[] }) {
|
function InstalledPlugins({ plugins, className }: { plugins: Plugin[]; className?: string }) {
|
||||||
return plugins.length === 0 ? (
|
return plugins.length === 0 ? (
|
||||||
<div className="pb-4">
|
<div className={classNames(className, 'pb-4')}>
|
||||||
<EmptyStateText className="text-center">
|
<EmptyStateText className="text-center">
|
||||||
Plugins extend the functionality of Yaak.
|
Plugins extend the functionality of Yaak.
|
||||||
<br />
|
<br />
|
||||||
@@ -340,7 +342,7 @@ function InstalledPlugins({ plugins }: { plugins: Plugin[] }) {
|
|||||||
</EmptyStateText>
|
</EmptyStateText>
|
||||||
</div>
|
</div>
|
||||||
) : (
|
) : (
|
||||||
<Table scrollable>
|
<Table scrollable className={className}>
|
||||||
<TableHead>
|
<TableHead>
|
||||||
<TableRow>
|
<TableRow>
|
||||||
<TableHeaderCell className="w-0" />
|
<TableHeaderCell className="w-0" />
|
||||||
|
|||||||
Reference in New Issue
Block a user