shiyue/kan
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: only render table if api keys exist

Browse Source
This commit is contained in:
Henry
2025-09-14 20:28:38 +01:00
parent 3e21b23f0a
commit 7073cd5931
2 changed files with 11 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
apps/web/src/components/Dropdown.tsx
View File

@@ -15,7 +15,7 @@ export default function Dropdown({
<div> <div>
<Menu.Button <Menu.Button
disabled={disabled} disabled={disabled}
className="flex h-7 w-7 items-center justify-center rounded-[5px] hover:bg-light-200 dark:hover:bg-dark-200" className="flex h-7 w-7 items-center justify-center rounded-[5px] hover:bg-light-200 focus:outline-none dark:hover:bg-dark-200"
> >
{children} {children}
</Menu.Button> </Menu.Button>
@@ -30,7 +30,7 @@ export default function Dropdown({
leaveFrom="transform opacity-100 scale-100" leaveFrom="transform opacity-100 scale-100"
leaveTo="transform opacity-0 scale-95" leaveTo="transform opacity-0 scale-95"
> >
<Menu.Items className="absolute right-0 z-30 mt-2 w-56 origin-top-right rounded-md border border-light-200 bg-light-50 p-1 shadow-lg ring-1 ring-black ring-opacity-5 focus:outline-none dark:border-dark-400 dark:bg-dark-300"> <Menu.Items className="absolute right-0 z-50 mt-2 w-56 origin-top-right rounded-md border border-light-200 bg-light-50 p-1 shadow-lg ring-1 ring-black ring-opacity-5 focus:outline-none dark:border-dark-400 dark:bg-dark-300">
<div className="flex flex-col"> <div className="flex flex-col">
{items.map((item) => ( {items.map((item) => (
<Menu.Item key={item.label}> <Menu.Item key={item.label}>

13
apps/web/src/views/settings/components/ApiKeyList.tsx
View File

@@ -105,7 +105,7 @@ export default function ApiKeyList() {
)} )}
> >
<div className="flex w-full items-center justify-center px-3"> <div className="flex w-full items-center justify-center px-3">
<div className={twMerge("relative")}> <div className="relative z-50">
<Dropdown <Dropdown
items={[ items={[
{ {
@@ -126,11 +126,16 @@ export default function ApiKeyList() {
</tr> </tr>
); );
}; };
if (!isLoading && (!data?.data || data.data.length === 0)) {
return null;
}
return ( return (
<div className="mt-8 flow-root"> <div className="mt-8 flow-root">
<div className="overflow-x-auto"> <div className="overflow-x-auto overflow-y-visible">
<div className="inline-block min-w-full py-2 align-middle"> <div className="inline-block min-w-full py-2 pb-12 align-middle">
<div className="h-full shadow ring-1 ring-black ring-opacity-5 sm:rounded-lg"> <div className="relative h-full shadow ring-1 ring-black ring-opacity-5 sm:rounded-lg">
<table className="min-w-[600px] divide-y divide-light-600 dark:divide-dark-600"> <table className="min-w-[600px] divide-y divide-light-600 dark:divide-dark-600">
<thead className="rounded-t-lg bg-light-300 dark:bg-dark-200"> <thead className="rounded-t-lg bg-light-300 dark:bg-dark-200">
<tr> <tr>