From 89962d18049950bb0a52f8aa04466ad0359cf087 Mon Sep 17 00:00:00 2001 From: Michael Silva Date: Mon, 6 Jan 2025 20:15:25 -0500 Subject: [PATCH 01/31] first draft --- .../app/(app)/[...not-found]/page.tsx | 12 ++- .../[apiId]/keys/[keyAuthId]/[keyId]/page.tsx | 16 ++-- .../apis/[apiId]/keys/[keyAuthId]/keys.tsx | 18 ++--- .../dashboard/app/(app)/apis/[apiId]/page.tsx | 30 +++---- apps/dashboard/app/(app)/apis/client.tsx | 20 ++--- .../table/audit-log-table-client.tsx | 20 ++--- apps/dashboard/app/(app)/audit/page.tsx | 16 ++-- .../(app)/authorization/permissions/page.tsx | 24 +++--- .../app/(app)/authorization/roles/page.tsx | 24 +++--- apps/dashboard/app/(app)/identities/page.tsx | 10 +-- apps/dashboard/app/(app)/layout.tsx | 16 ++-- .../ratelimits/[namespaceId]/logs/page.tsx | 28 +++---- .../[namespaceId]/overrides/page.tsx | 16 ++-- .../(app)/ratelimits/[namespaceId]/page.tsx | 16 ++-- apps/dashboard/app/(app)/ratelimits/page.tsx | 20 ++--- .../(app)/settings/billing/stripe/page.tsx | 12 +-- .../settings/billing/stripe/success/page.tsx | 36 ++++----- .../app/(app)/settings/team/page.tsx | 29 ++++--- .../(app)/settings/user/update-user-email.tsx | 6 +- .../(app)/settings/user/update-user-name.tsx | 6 +- .../app/(app)/settings/vercel/client.tsx | 38 +++++---- .../app/(app)/settings/vercel/page.tsx | 28 +++---- .../app/integrations/vercel/callback/page.tsx | 22 +++--- apps/dashboard/app/new/keys.tsx | 10 +-- apps/dashboard/components/dashboard/empty.tsx | 79 +++++++++++++++++++ apps/dashboard/components/opt-in.tsx | 14 ++-- apps/dashboard/components/virtual-table.tsx | 27 +++++-- .../design/components/empty.example.tsx | 25 ++++++ .../content/design/components/empty.mdx | 32 ++++++++ internal/ui/src/components/empty.tsx | 79 +++++++++++++++++++ internal/ui/src/index.ts | 1 + 31 files changed, 472 insertions(+), 258 deletions(-) create mode 100644 apps/dashboard/components/dashboard/empty.tsx create mode 100644 apps/engineering/content/design/components/empty.example.tsx create mode 100644 apps/engineering/content/design/components/empty.mdx create mode 100644 internal/ui/src/components/empty.tsx diff --git a/apps/dashboard/app/(app)/[...not-found]/page.tsx b/apps/dashboard/app/(app)/[...not-found]/page.tsx index 9d6134567d..e0b796db56 100644 --- a/apps/dashboard/app/(app)/[...not-found]/page.tsx +++ b/apps/dashboard/app/(app)/[...not-found]/page.tsx @@ -1,18 +1,16 @@ -import { EmptyPlaceholder } from "@/components/dashboard/empty-placeholder"; +import { Empty } from "@/components/dashboard/empty"; import { Button } from "@unkey/ui"; import Link from "next/link"; export default function NotFound() { return ( - - 404 Not Found - - We couldn't find the page that you're looking for! - + + 404 Not Found + We couldn't find the page that you're looking for!
- + ); } diff --git a/apps/dashboard/app/(app)/apis/[apiId]/keys/[keyAuthId]/[keyId]/page.tsx b/apps/dashboard/app/(app)/apis/[apiId]/keys/[keyAuthId]/[keyId]/page.tsx index f94ecb0bdd..043a682874 100644 --- a/apps/dashboard/app/(app)/apis/[apiId]/keys/[keyAuthId]/[keyId]/page.tsx +++ b/apps/dashboard/app/(app)/apis/[apiId]/keys/[keyAuthId]/[keyId]/page.tsx @@ -8,7 +8,7 @@ import { CreateNewRole } from "@/app/(app)/authorization/roles/create-new-role"; import { StackedColumnChart } from "@/components/dashboard/charts"; import { CopyButton } from "@/components/dashboard/copy-button"; import { CreateKeyButton } from "@/components/dashboard/create-key-button"; -import { EmptyPlaceholder } from "@/components/dashboard/empty-placeholder"; +import { Empty } from "@/components/dashboard/empty"; import { Navbar } from "@/components/navbar"; import { PageContent } from "@/components/page-content"; import { Badge } from "@/components/ui/badge"; @@ -352,15 +352,13 @@ export default async function APIKeyDetailPage(props: { ) : ( - - + + - - Not used - - This key was not used in the last {interval} - - + + Not used + This key was not used in the last {interval} + )} {latestVerifications.val && latestVerifications.val.length > 0 ? ( diff --git a/apps/dashboard/app/(app)/apis/[apiId]/keys/[keyAuthId]/keys.tsx b/apps/dashboard/app/(app)/apis/[apiId]/keys/[keyAuthId]/keys.tsx index 5e15b3d73e..ab23027afa 100644 --- a/apps/dashboard/app/(app)/apis/[apiId]/keys/[keyAuthId]/keys.tsx +++ b/apps/dashboard/app/(app)/apis/[apiId]/keys/[keyAuthId]/keys.tsx @@ -1,5 +1,5 @@ import { CreateKeyButton } from "@/components/dashboard/create-key-button"; -import { EmptyPlaceholder } from "@/components/dashboard/empty-placeholder"; +import { Empty } from "@/components/dashboard/empty"; import BackButton from "@/components/ui/back-button"; import { Badge } from "@/components/ui/badge"; import { db } from "@/lib/db"; @@ -59,19 +59,19 @@ export const Keys: React.FC = async ({ keyAuthId, apiId }) => { return (
{keys.length === 0 ? ( - - + + - - No keys found - Create your first key -
+ + No keys found + Create your first key + Go Back -
+ {/* Create New Role} /> */} - + ) : ( Object.entries(keysByOwnerId).map(([ownerId, ks]) => (
diff --git a/apps/dashboard/app/(app)/apis/[apiId]/page.tsx b/apps/dashboard/app/(app)/apis/[apiId]/page.tsx index 33f2c9fc20..913b5a67de 100644 --- a/apps/dashboard/app/(app)/apis/[apiId]/page.tsx +++ b/apps/dashboard/app/(app)/apis/[apiId]/page.tsx @@ -1,7 +1,7 @@ import { AreaChart, StackedColumnChart } from "@/components/dashboard/charts"; import { CopyButton } from "@/components/dashboard/copy-button"; import { CreateKeyButton } from "@/components/dashboard/create-key-button"; -import { EmptyPlaceholder } from "@/components/dashboard/empty-placeholder"; +import { Empty } from "@/components/dashboard/empty"; import { Navbar as SubMenu } from "@/components/dashboard/navbar"; import { Navbar } from "@/components/navbar"; import { PageContent } from "@/components/page-content"; @@ -246,15 +246,13 @@ export default async function ApiPage(props: { ) : ( - - + + - - No usage - - Verify a key or change the range - - + + No usage + Verify a key or change the range + )} @@ -290,15 +288,13 @@ export default async function ApiPage(props: { ) : ( - - + + - - No usage - - Verify a key or change the range - - + + No usage + Verify a key or change the range + )}
diff --git a/apps/dashboard/app/(app)/apis/client.tsx b/apps/dashboard/app/(app)/apis/client.tsx index eee7cdd620..0725d6e1c0 100644 --- a/apps/dashboard/app/(app)/apis/client.tsx +++ b/apps/dashboard/app/(app)/apis/client.tsx @@ -1,5 +1,5 @@ "use client"; -import { EmptyPlaceholder } from "@/components/dashboard/empty-placeholder"; +import { Empty } from "@/components/dashboard/empty"; import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card"; import { PostHogIdentify } from "@/providers/PostHogProvider"; import { useUser } from "@clerk/nextjs"; @@ -76,15 +76,15 @@ export function ApiList({ apis }: { apis: ApiWithKeys }) { ))} ) : ( - - + + - - No APIs found - + + No APIs found + You haven't created any APIs yet. Create one to get started. - -
+ + -
- + + )}
); diff --git a/apps/dashboard/app/(app)/audit/components/table/audit-log-table-client.tsx b/apps/dashboard/app/(app)/audit/components/table/audit-log-table-client.tsx index e0d9255fa1..b02d1fc624 100644 --- a/apps/dashboard/app/(app)/audit/components/table/audit-log-table-client.tsx +++ b/apps/dashboard/app/(app)/audit/components/table/audit-log-table-client.tsx @@ -1,6 +1,6 @@ "use client"; -import { EmptyPlaceholder } from "@/components/dashboard/empty-placeholder"; +import { Empty } from "@/components/dashboard/empty"; import { VirtualTable } from "@/components/virtual-table"; import { trpc } from "@/lib/trpc/client"; import { cn } from "@unkey/ui/src/lib/utils"; @@ -78,17 +78,13 @@ export const AuditLogTableClient = () => { if (isError) { return ( - -
-
-
Failed to load audit logs
-
- There was a problem fetching the audit logs. Please try refreshing the page or contact - support if the issue persists. -
-
-
- + + Failed to load audit logs + + There was a problem fetching the audit logs. Please try refreshing the page or contact + support if the issue persists. + + ); } diff --git a/apps/dashboard/app/(app)/audit/page.tsx b/apps/dashboard/app/(app)/audit/page.tsx index 62aca04759..18cbd44f37 100644 --- a/apps/dashboard/app/(app)/audit/page.tsx +++ b/apps/dashboard/app/(app)/audit/page.tsx @@ -1,4 +1,4 @@ -import { EmptyPlaceholder } from "@/components/dashboard/empty-placeholder"; +import { Empty } from "@/components/dashboard/empty"; import { Navbar } from "@/components/navbar"; import { PageContent } from "@/components/page-content"; import { getTenantId } from "@/lib/auth"; @@ -38,16 +38,16 @@ export default async function AuditPage(props: Props) { ) : ( - - + + - - No logs - + + No logs + There are no audit logs available yet. Create a key or another resource and come back here. - - + + )} diff --git a/apps/dashboard/app/(app)/authorization/permissions/page.tsx b/apps/dashboard/app/(app)/authorization/permissions/page.tsx index 0480d246b6..b08e5d2e04 100644 --- a/apps/dashboard/app/(app)/authorization/permissions/page.tsx +++ b/apps/dashboard/app/(app)/authorization/permissions/page.tsx @@ -1,4 +1,4 @@ -import { EmptyPlaceholder } from "@/components/dashboard/empty-placeholder"; +import { Empty } from "@/components/dashboard/empty"; import { Navbar as SubMenu } from "@/components/dashboard/navbar"; import { Navbar } from "@/components/navbar"; import { PageContent } from "@/components/page-content"; @@ -80,18 +80,18 @@ export default async function RolesPage() {
{workspace.permissions.length === 0 ? ( - - + + - - No permissions found - - Create your first permission - - Create New Permission} - /> - + + No permissions found + Create your first permission + + Create New Permission} + /> + + ) : (
    {workspace.permissions.map((p) => ( diff --git a/apps/dashboard/app/(app)/authorization/roles/page.tsx b/apps/dashboard/app/(app)/authorization/roles/page.tsx index 13a7c21aa2..2fd6e8de91 100644 --- a/apps/dashboard/app/(app)/authorization/roles/page.tsx +++ b/apps/dashboard/app/(app)/authorization/roles/page.tsx @@ -1,4 +1,4 @@ -import { EmptyPlaceholder } from "@/components/dashboard/empty-placeholder"; +import { Empty } from "@/components/dashboard/empty"; import { Navbar as SubMenu } from "@/components/dashboard/navbar"; import { Navbar } from "@/components/navbar"; import { PageContent } from "@/components/page-content"; @@ -83,17 +83,19 @@ export default async function RolesPage() {
    {workspace.roles.length === 0 ? ( - - + + - - No roles found - Create your first role - Create New Role} - permissions={workspace.permissions} - /> - + + No roles found + Create your first role + + Create New Role} + permissions={workspace.permissions} + /> + + ) : (
      {workspace.roles.map((r) => ( diff --git a/apps/dashboard/app/(app)/identities/page.tsx b/apps/dashboard/app/(app)/identities/page.tsx index a388709b19..d76d0a95ef 100644 --- a/apps/dashboard/app/(app)/identities/page.tsx +++ b/apps/dashboard/app/(app)/identities/page.tsx @@ -1,6 +1,6 @@ import { redirect } from "next/navigation"; -import { EmptyPlaceholder } from "@/components/dashboard/empty-placeholder"; +import { Empty } from "@/components/dashboard/empty"; import { Navbar } from "@/components/navbar"; import { OptIn } from "@/components/opt-in"; import { PageContent } from "@/components/page-content"; @@ -52,11 +52,11 @@ export default async function Page(props: Props) {
      - + + - - + + } > diff --git a/apps/dashboard/app/(app)/layout.tsx b/apps/dashboard/app/(app)/layout.tsx index db88785900..892e7bc9d7 100644 --- a/apps/dashboard/app/(app)/layout.tsx +++ b/apps/dashboard/app/(app)/layout.tsx @@ -1,4 +1,4 @@ -import { EmptyPlaceholder } from "@/components/dashboard/empty-placeholder"; +import { Empty } from "@/components/dashboard/empty"; import { getTenantId } from "@/lib/auth"; import { db } from "@/lib/db"; import { ShieldBan } from "lucide-react"; @@ -50,12 +50,12 @@ export default async function Layout({ children }: LayoutProps) { children ) : (
      - - + + - - This workspace is disabled - + + This workspace is disabled + Contact{" "} support@unkey.dev - - + +
      )}
      diff --git a/apps/dashboard/app/(app)/ratelimits/[namespaceId]/logs/page.tsx b/apps/dashboard/app/(app)/ratelimits/[namespaceId]/logs/page.tsx index 277f26d626..e40b5e2c1c 100644 --- a/apps/dashboard/app/(app)/ratelimits/[namespaceId]/logs/page.tsx +++ b/apps/dashboard/app/(app)/ratelimits/[namespaceId]/logs/page.tsx @@ -3,7 +3,7 @@ import { db } from "@/lib/db"; import { notFound } from "next/navigation"; import { CopyButton } from "@/components/dashboard/copy-button"; -import { EmptyPlaceholder } from "@/components/dashboard/empty-placeholder"; +import { Empty } from "@/components/dashboard/empty"; import { Loading } from "@/components/dashboard/loading"; import { Navbar as SubMenu } from "@/components/dashboard/navbar"; import { Navbar } from "@/components/navbar"; @@ -102,11 +102,11 @@ export default async function AuditPage(props: Props) { - + + - - + + } > - + + - - No logs found + + No logs found {isFiltered ? (
      - + No events matched these filters, try changing them.{" "} - +
      ) : ( - + Create, update or delete something and come back again. - + )} - + ); } diff --git a/apps/dashboard/app/(app)/ratelimits/[namespaceId]/overrides/page.tsx b/apps/dashboard/app/(app)/ratelimits/[namespaceId]/overrides/page.tsx index e98849d81c..976e443076 100644 --- a/apps/dashboard/app/(app)/ratelimits/[namespaceId]/overrides/page.tsx +++ b/apps/dashboard/app/(app)/ratelimits/[namespaceId]/overrides/page.tsx @@ -1,5 +1,5 @@ import { CopyButton } from "@/components/dashboard/copy-button"; -import { EmptyPlaceholder } from "@/components/dashboard/empty-placeholder"; +import { Empty } from "@/components/dashboard/empty"; import { Navbar as SubMenu } from "@/components/dashboard/navbar"; import { PageHeader } from "@/components/dashboard/page-header"; import { Navbar } from "@/components/navbar"; @@ -97,15 +97,13 @@ export default async function OverridePage(props: Props) { {namespace.overrides.length === 0 ? ( - - + + - - No custom ratelimits found - - Create your first override below - - + + No custom ratelimits found + Create your first override below + ) : ( ) : ( - - + + - - No usage - - Ratelimit something or change the range - + + No usage + Ratelimit something or change the range {snippet} - + )}
    diff --git a/apps/dashboard/app/(app)/ratelimits/page.tsx b/apps/dashboard/app/(app)/ratelimits/page.tsx index 6b87aa2cda..456b0125a2 100644 --- a/apps/dashboard/app/(app)/ratelimits/page.tsx +++ b/apps/dashboard/app/(app)/ratelimits/page.tsx @@ -1,5 +1,5 @@ import { CopyButton } from "@/components/dashboard/copy-button"; -import { EmptyPlaceholder } from "@/components/dashboard/empty-placeholder"; +import { Empty } from "@/components/dashboard/empty"; import { Navbar } from "@/components/navbar"; import { PageContent } from "@/components/page-content"; import { Code } from "@/components/ui/code"; @@ -69,28 +69,28 @@ export default async function RatelimitOverviewPage() { ))}
) : ( - - + + - - No Namespaces found - + + No Namespaces found + You haven't created any Namespaces yet. Create one by performing a limit request as shown below. - + {snippet} -
+ -
- + + )}
diff --git a/apps/dashboard/app/(app)/settings/billing/stripe/page.tsx b/apps/dashboard/app/(app)/settings/billing/stripe/page.tsx index cfc9a343ab..b1f92893f8 100644 --- a/apps/dashboard/app/(app)/settings/billing/stripe/page.tsx +++ b/apps/dashboard/app/(app)/settings/billing/stripe/page.tsx @@ -1,4 +1,4 @@ -import { EmptyPlaceholder } from "@/components/dashboard/empty-placeholder"; +import { Empty } from "@/components/dashboard/empty"; import { getTenantId } from "@/lib/auth"; import { db } from "@/lib/db"; import { stripeEnv } from "@/lib/env"; @@ -31,12 +31,12 @@ export default async function StripeRedirect(props: Props) { const e = stripeEnv(); if (!e) { return ( - - Stripe is not configured - + + Stripe is not configured + If you are selfhosting Unkey, you need to configure Stripe in your environment variables. - - + + ); } diff --git a/apps/dashboard/app/(app)/settings/billing/stripe/success/page.tsx b/apps/dashboard/app/(app)/settings/billing/stripe/success/page.tsx index 56ea43356a..0a053c4739 100644 --- a/apps/dashboard/app/(app)/settings/billing/stripe/success/page.tsx +++ b/apps/dashboard/app/(app)/settings/billing/stripe/success/page.tsx @@ -1,4 +1,4 @@ -import { EmptyPlaceholder } from "@/components/dashboard/empty-placeholder"; +import { Empty } from "@/components/dashboard/empty"; import { Code } from "@/components/ui/code"; import { insertAuditLogs } from "@/lib/audit"; import { getTenantId } from "@/lib/auth"; @@ -36,12 +36,12 @@ export default async function StripeSuccess(props: Props) { const e = stripeEnv(); if (!e) { return ( - - Stripe is not configured - + + Stripe is not configured + If you are selfhosting Unkey, you need to configure Stripe in your environment variables. - - + + ); } @@ -53,27 +53,27 @@ export default async function StripeSuccess(props: Props) { const session = await stripe.checkout.sessions.retrieve(session_id); if (!session) { return ( - - Stripe session not found - The Stripe session + + Stripe session not found + The Stripe session {session_id} - + you are trying to access does not exist. Please contact support@unkey.dev. - - + + ); } const customer = await stripe.customers.retrieve(session.customer as string); if (!customer) { return ( - - Stripe customer not found - The Stripe customer + + Stripe customer not found + The Stripe customer {session.customer as string} - + you are trying to access does not exist. Please contact support@unkey.dev. - - + + ); } diff --git a/apps/dashboard/app/(app)/settings/team/page.tsx b/apps/dashboard/app/(app)/settings/team/page.tsx index 593fb53433..003ecee55f 100644 --- a/apps/dashboard/app/(app)/settings/team/page.tsx +++ b/apps/dashboard/app/(app)/settings/team/page.tsx @@ -1,5 +1,5 @@ "use client"; -import { EmptyPlaceholder } from "@/components/dashboard/empty-placeholder"; +import { Empty } from "@/components/dashboard/empty"; import { Badge } from "@/components/ui/badge"; import { Button } from "@unkey/ui"; import type React from "react"; @@ -61,16 +61,15 @@ export default function TeamPage() {
- - This is a personal account - - You can only manage teams in paid workspaces. - - - - - - + + This is a personal account + You can only manage teams in paid workspaces. + + + + + +
@@ -215,11 +214,11 @@ const Invitations: React.FC = () => { if (!invitationList || invitationList.length === 0) { return ( - - No pending invitations - Invite members to your team + + No pending invitations + Invite members to your team - + ); } diff --git a/apps/dashboard/app/(app)/settings/user/update-user-email.tsx b/apps/dashboard/app/(app)/settings/user/update-user-email.tsx index fac9c51bba..73645efc13 100644 --- a/apps/dashboard/app/(app)/settings/user/update-user-email.tsx +++ b/apps/dashboard/app/(app)/settings/user/update-user-email.tsx @@ -1,5 +1,5 @@ "use client"; -import { EmptyPlaceholder } from "@/components/dashboard/empty-placeholder"; +import { Empty } from "@/components/dashboard/empty"; import { Loading } from "@/components/dashboard/loading"; import { Badge } from "@/components/ui/badge"; import { Card, CardContent, CardFooter, CardHeader, CardTitle } from "@/components/ui/card"; @@ -73,9 +73,9 @@ export const UpdateUserEmail: React.FC = () => { if (!user) { return ( - + - + ); } const isDisabled = emailForm.formState.isLoading || !emailForm.formState.isValid; diff --git a/apps/dashboard/app/(app)/settings/user/update-user-name.tsx b/apps/dashboard/app/(app)/settings/user/update-user-name.tsx index eb2df513ad..30afbd9d33 100644 --- a/apps/dashboard/app/(app)/settings/user/update-user-name.tsx +++ b/apps/dashboard/app/(app)/settings/user/update-user-name.tsx @@ -1,5 +1,5 @@ "use client"; -import { EmptyPlaceholder } from "@/components/dashboard/empty-placeholder"; +import { Empty } from "@/components/dashboard/empty"; import { Loading } from "@/components/dashboard/loading"; import { Card, CardContent, CardFooter, CardHeader, CardTitle } from "@/components/ui/card"; import { @@ -44,9 +44,9 @@ export const UpdateUserName: React.FC = () => { }); if (!user) { return ( - + - + ); } diff --git a/apps/dashboard/app/(app)/settings/vercel/client.tsx b/apps/dashboard/app/(app)/settings/vercel/client.tsx index d5834086ea..f480c9bbc8 100644 --- a/apps/dashboard/app/(app)/settings/vercel/client.tsx +++ b/apps/dashboard/app/(app)/settings/vercel/client.tsx @@ -1,5 +1,5 @@ "use client"; -import { EmptyPlaceholder } from "@/components/dashboard/empty-placeholder"; +import { Empty } from "@/components/dashboard/empty"; import { Loading } from "@/components/dashboard/loading"; import { PageHeader } from "@/components/dashboard/page-header"; import { Avatar, AvatarImage } from "@/components/ui/avatar"; @@ -64,22 +64,26 @@ export const Client: React.FC = ({ projects, integration, apis, rootKeys if (projects.length === 0) { return ( - - - - - No connected projects found - Connect a Vercel project now - - - - + + + + + + + No connected projects found + Connect a Vercel project now + + + + + + ); } diff --git a/apps/dashboard/app/(app)/settings/vercel/page.tsx b/apps/dashboard/app/(app)/settings/vercel/page.tsx index 0100d91874..bb2ad8e871 100644 --- a/apps/dashboard/app/(app)/settings/vercel/page.tsx +++ b/apps/dashboard/app/(app)/settings/vercel/page.tsx @@ -1,4 +1,4 @@ -import { EmptyPlaceholder } from "@/components/dashboard/empty-placeholder"; +import { Empty } from "@/components/dashboard/empty"; import { Navbar as SubMenu } from "@/components/dashboard/navbar"; import { Navbar } from "@/components/navbar"; import { PageContent } from "@/components/page-content"; @@ -61,16 +61,14 @@ export default async function Page(props: Props) {
- - - Vercel is not connected to this workspace - - + + Vercel is not connected to this workspace + - - + +
); @@ -85,13 +83,15 @@ export default async function Page(props: Props) { if (err) { return ( - - Error - + + Error + We couldn't load your projects from Vercel. Please try again or contact support. - - {JSON.stringify(err, null, 2)} - + + + {JSON.stringify(err, null, 2)} + + ); } diff --git a/apps/dashboard/app/integrations/vercel/callback/page.tsx b/apps/dashboard/app/integrations/vercel/callback/page.tsx index 358533d054..fa07365f2e 100644 --- a/apps/dashboard/app/integrations/vercel/callback/page.tsx +++ b/apps/dashboard/app/integrations/vercel/callback/page.tsx @@ -1,4 +1,4 @@ -import { EmptyPlaceholder } from "@/components/dashboard/empty-placeholder"; +import { Empty } from "@/components/dashboard/empty"; import { Code } from "@/components/ui/code"; import { getTenantId } from "@/lib/auth"; import { db, eq, schema } from "@/lib/db"; @@ -66,11 +66,11 @@ export default async function Page(props: Props) { }).listProjects(); if (projects.err) { return ( - - Error - + + Error + We couldn't load your projects from Vercel. Please try again or contact support. - + {JSON.stringify( { @@ -81,19 +81,19 @@ export default async function Page(props: Props) { 2, )} - + ); } if (projects.val.length === 0) { return ( - - No Projects Found - + + No Projects Found + You did not authorize any projects to be connected. Please go to your Vercel dashboard and add a project to this integration. - - + + ); } return ( diff --git a/apps/dashboard/app/new/keys.tsx b/apps/dashboard/app/new/keys.tsx index c62260258a..9706b351e4 100644 --- a/apps/dashboard/app/new/keys.tsx +++ b/apps/dashboard/app/new/keys.tsx @@ -1,7 +1,7 @@ "use client"; import { CopyButton } from "@/components/dashboard/copy-button"; -import { EmptyPlaceholder } from "@/components/dashboard/empty-placeholder"; +import { Empty } from "@/components/dashboard/empty"; import { Loading } from "@/components/dashboard/loading"; import { VisibleButton } from "@/components/dashboard/visible-button"; import { Alert, AlertDescription, AlertTitle } from "@/components/ui/alert"; @@ -121,10 +121,8 @@ export const Keys: React.FC = ({ keyAuthId, apiId }) => { {step.step === "CREATE_ROOT_KEY" ? ( - - - Let's begin by creating a root key - + + Let's begin by creating a root key - + ) : step.step === "CREATE_KEY" ? ( diff --git a/apps/dashboard/components/dashboard/empty.tsx b/apps/dashboard/components/dashboard/empty.tsx new file mode 100644 index 0000000000..de035b2ba0 --- /dev/null +++ b/apps/dashboard/components/dashboard/empty.tsx @@ -0,0 +1,79 @@ +import type * as React from "react"; + +import { cn } from "@/lib/utils"; + +interface EmptyRootProps extends React.HTMLAttributes { + fill: boolean | undefined; +} +export function Empty({ className, children, ...props }: EmptyRootProps) { + return ( +
+
{children}
+
+ ); +} + +// Empty.Icon = function EmptyIcon({ children }: { children: React.ReactNode }) { +// return ( +//
+// {children} +//
+// ); +// }; +Empty.Icon = function EmptyIcon({ children }: { children: React.ReactNode }) { + return ( +
+
+ {/* Add gradient to lines */} +
+
+
+
+
+ {children} +
+
+
+ ); +}; + +type EmptyTitleProps = React.HTMLAttributes; + +Empty.Title = function EmptyTitle({ className, ...props }: EmptyTitleProps) { + return

; +}; + +type EmptyDescriptionProps = React.HTMLAttributes; + +Empty.Description = function EmptyDescription({ className, ...props }: EmptyDescriptionProps) { + return ( +

+ ); +}; + +type EmptyActionProps = React.HTMLAttributes; + +Empty.Action = function EmptyAction({ className, children, ...props }: EmptyActionProps) { + return ( +

+ {children} +
+ ); +}; diff --git a/apps/dashboard/components/opt-in.tsx b/apps/dashboard/components/opt-in.tsx index 102a7174cd..0b7f064b9a 100644 --- a/apps/dashboard/components/opt-in.tsx +++ b/apps/dashboard/components/opt-in.tsx @@ -7,7 +7,7 @@ import { Power } from "lucide-react"; import Link from "next/link"; import { useRouter } from "next/navigation"; import type React from "react"; -import { EmptyPlaceholder } from "./dashboard/empty-placeholder"; +import { Empty } from "./dashboard/empty"; import { toast } from "@/components/ui/toaster"; import { PostHogEvent } from "@/providers/PostHogProvider"; @@ -40,12 +40,12 @@ export const OptIn: React.FC = ({ title, description, feature }) => { }, }); return ( - - + + - - {title} - {description} + + {title} + {description}
@@ -56,6 +56,6 @@ export const OptIn: React.FC = ({ title, description, feature }) => { {optIn.isLoading ? : "Opt In"}
- + ); }; diff --git a/apps/dashboard/components/virtual-table.tsx b/apps/dashboard/components/virtual-table.tsx index ec0cb6363e..567e6c56a3 100644 --- a/apps/dashboard/components/virtual-table.tsx +++ b/apps/dashboard/components/virtual-table.tsx @@ -1,7 +1,9 @@ -import { Card, CardContent } from "@/components/ui/card"; +import { Empty } from "@/components/dashboard/empty"; import { cn, throttle } from "@/lib/utils"; import { useVirtualizer } from "@tanstack/react-virtual"; -import { ScrollText } from "lucide-react"; +import { Button } from "@unkey/ui"; +import { Layers2, RefreshCcw } from "lucide-react"; +import Link from "next/link"; import type React from "react"; import { useCallback, useEffect, useRef, useState } from "react"; import { useScrollLock } from "usehooks-ts"; @@ -201,12 +203,21 @@ export function VirtualTable({
{emptyState || ( - - - -
No data available
- - + + + + + No audit logs matching the filters + Try adjusting the filters to see more results. + + + + + + )}

diff --git a/apps/engineering/content/design/components/empty.example.tsx b/apps/engineering/content/design/components/empty.example.tsx new file mode 100644 index 0000000000..6c7853bdc0 --- /dev/null +++ b/apps/engineering/content/design/components/empty.example.tsx @@ -0,0 +1,25 @@ +"use client"; +import { RenderComponentWithSnippet } from "@/app/components/render"; +import { Row } from "@/app/components/row"; +import { Button } from "@unkey/ui"; +import { Empty } from "@unkey/ui"; +import { BookOpen, ShieldBan } from "lucide-react"; + +export const EmptyExample: React.FC = () => ( + + + + + + + Example Title Text + Example of Description Text. + + + + + + +); diff --git a/apps/engineering/content/design/components/empty.mdx b/apps/engineering/content/design/components/empty.mdx new file mode 100644 index 0000000000..11ec7ac2db --- /dev/null +++ b/apps/engineering/content/design/components/empty.mdx @@ -0,0 +1,32 @@ +--- +title: Empty +--- +import { RenderComponentWithSnippet } from "@/app/components/render" +import { Row } from "@/app/components/row" +import { EmptyExample } from "./empty.example" + + +## Overview + +The `` component should be used in place of a component that may contain empty data in place of the normal component. + +## Empty.Icon + +`` can be used to put a styled icon inside the `` component. See `Full Example`. + +## Empty.Title + +The `` is uesed to display a title in the `` component. Can be used if a more empisized text or warning is needed. + +## Empty.Description + +The `` is used to describe why the `` component was used in place of some data. + +## Empty.Action + +The `` is used to give the user an action to resolve having no data. If there are to many filters on a table for example a button may be added to remove table filters. + + +## Full Example + + diff --git a/internal/ui/src/components/empty.tsx b/internal/ui/src/components/empty.tsx new file mode 100644 index 0000000000..01d3d7fc11 --- /dev/null +++ b/internal/ui/src/components/empty.tsx @@ -0,0 +1,79 @@ +import type * as React from "react"; + +import { cn } from "../lib/utils"; + +interface EmptyRootProps extends React.HTMLAttributes { + fill: boolean | undefined; +} +export function Empty({ className, children, ...props }: EmptyRootProps) { + return ( +
+
{children}
+
+ ); +} + +// Empty.Icon = function EmptyIcon({ children }: { children: React.ReactNode }) { +// return ( +//
+// {children} +//
+// ); +// }; +Empty.Icon = function EmptyIcon({ children }: { children: React.ReactNode }) { + return ( +
+
+ {/* Add gradient to lines */} +
+
+
+
+
+ {children} +
+
+
+ ); +}; + +type EmptyTitleProps = React.HTMLAttributes; + +Empty.Title = function EmptyTitle({ className, ...props }: EmptyTitleProps) { + return

; +}; + +type EmptyDescriptionProps = React.HTMLAttributes; + +Empty.Description = function EmptyDescription({ className, ...props }: EmptyDescriptionProps) { + return ( +

+ ); +}; + +type EmptyActionProps = React.HTMLAttributes; + +Empty.Action = function EmptyAction({ className, children, ...props }: EmptyActionProps) { + return ( +

+ {children} +
+ ); +}; diff --git a/internal/ui/src/index.ts b/internal/ui/src/index.ts index 52f5f1837e..6aabda0fe9 100644 --- a/internal/ui/src/index.ts +++ b/internal/ui/src/index.ts @@ -1,3 +1,4 @@ export * from "./components/button"; export * from "./components/id"; export * from "./components/tooltip"; +export * from "./components/empty"; From 6d7930dd25047a0b427f5393fd85b1ef746f50f2 Mon Sep 17 00:00:00 2001 From: Michael Silva Date: Tue, 7 Jan 2025 14:13:34 -0500 Subject: [PATCH 02/31] Empty component and styled --- .../app/(app)/[...not-found]/page.tsx | 2 +- .../[apiId]/keys/[keyAuthId]/[keyId]/page.tsx | 2 +- .../apis/[apiId]/keys/[keyAuthId]/keys.tsx | 2 +- .../dashboard/app/(app)/apis/[apiId]/page.tsx | 2 +- apps/dashboard/app/(app)/apis/client.tsx | 2 +- .../table/audit-log-table-client.tsx | 2 +- apps/dashboard/app/(app)/audit/page.tsx | 2 +- .../(app)/authorization/permissions/page.tsx | 2 +- .../app/(app)/authorization/roles/page.tsx | 2 +- apps/dashboard/app/(app)/identities/page.tsx | 5 +- apps/dashboard/app/(app)/layout.tsx | 2 +- .../ratelimits/[namespaceId]/logs/page.tsx | 2 +- .../[namespaceId]/overrides/page.tsx | 2 +- .../(app)/ratelimits/[namespaceId]/page.tsx | 2 +- apps/dashboard/app/(app)/ratelimits/page.tsx | 3 +- .../(app)/settings/billing/stripe/page.tsx | 2 +- .../settings/billing/stripe/success/page.tsx | 2 +- .../app/(app)/settings/team/page.tsx | 2 +- .../(app)/settings/user/update-user-email.tsx | 2 +- .../(app)/settings/user/update-user-name.tsx | 2 +- .../app/(app)/settings/vercel/client.tsx | 2 +- .../app/(app)/settings/vercel/page.tsx | 2 +- .../app/integrations/vercel/callback/page.tsx | 2 +- apps/dashboard/app/new/keys.tsx | 2 +- .../dashboard/empty-placeholder.tsx | 57 ------------- apps/dashboard/components/dashboard/empty.tsx | 79 ------------------- apps/dashboard/components/virtual-table.tsx | 2 +- .../design/components/empty.example.tsx | 2 +- internal/ui/src/components/empty.tsx | 27 +++---- 29 files changed, 38 insertions(+), 181 deletions(-) delete mode 100644 apps/dashboard/components/dashboard/empty-placeholder.tsx delete mode 100644 apps/dashboard/components/dashboard/empty.tsx diff --git a/apps/dashboard/app/(app)/[...not-found]/page.tsx b/apps/dashboard/app/(app)/[...not-found]/page.tsx index e0b796db56..3070b5ce45 100644 --- a/apps/dashboard/app/(app)/[...not-found]/page.tsx +++ b/apps/dashboard/app/(app)/[...not-found]/page.tsx @@ -1,4 +1,4 @@ -import { Empty } from "@/components/dashboard/empty"; +import { Empty } from "@unkey/ui"; import { Button } from "@unkey/ui"; import Link from "next/link"; export default function NotFound() { diff --git a/apps/dashboard/app/(app)/apis/[apiId]/keys/[keyAuthId]/[keyId]/page.tsx b/apps/dashboard/app/(app)/apis/[apiId]/keys/[keyAuthId]/[keyId]/page.tsx index 043a682874..12e68194e7 100644 --- a/apps/dashboard/app/(app)/apis/[apiId]/keys/[keyAuthId]/[keyId]/page.tsx +++ b/apps/dashboard/app/(app)/apis/[apiId]/keys/[keyAuthId]/[keyId]/page.tsx @@ -8,7 +8,6 @@ import { CreateNewRole } from "@/app/(app)/authorization/roles/create-new-role"; import { StackedColumnChart } from "@/components/dashboard/charts"; import { CopyButton } from "@/components/dashboard/copy-button"; import { CreateKeyButton } from "@/components/dashboard/create-key-button"; -import { Empty } from "@/components/dashboard/empty"; import { Navbar } from "@/components/navbar"; import { PageContent } from "@/components/page-content"; import { Badge } from "@/components/ui/badge"; @@ -20,6 +19,7 @@ import { clickhouse } from "@/lib/clickhouse"; import { and, db, eq, isNull, schema } from "@/lib/db"; import { formatNumber } from "@/lib/fmt"; import { Nodes } from "@unkey/icons"; +import { Empty } from "@unkey/ui"; import { Button } from "@unkey/ui"; import { BarChart, Minus } from "lucide-react"; import ms from "ms"; diff --git a/apps/dashboard/app/(app)/apis/[apiId]/keys/[keyAuthId]/keys.tsx b/apps/dashboard/app/(app)/apis/[apiId]/keys/[keyAuthId]/keys.tsx index ab23027afa..5eb9219a11 100644 --- a/apps/dashboard/app/(app)/apis/[apiId]/keys/[keyAuthId]/keys.tsx +++ b/apps/dashboard/app/(app)/apis/[apiId]/keys/[keyAuthId]/keys.tsx @@ -1,8 +1,8 @@ import { CreateKeyButton } from "@/components/dashboard/create-key-button"; -import { Empty } from "@/components/dashboard/empty"; import BackButton from "@/components/ui/back-button"; import { Badge } from "@/components/ui/badge"; import { db } from "@/lib/db"; +import { Empty } from "@unkey/ui"; import { Button } from "@unkey/ui"; import { ChevronRight, Scan, User, VenetianMask } from "lucide-react"; import Link from "next/link"; diff --git a/apps/dashboard/app/(app)/apis/[apiId]/page.tsx b/apps/dashboard/app/(app)/apis/[apiId]/page.tsx index 913b5a67de..62eb638479 100644 --- a/apps/dashboard/app/(app)/apis/[apiId]/page.tsx +++ b/apps/dashboard/app/(app)/apis/[apiId]/page.tsx @@ -1,7 +1,6 @@ import { AreaChart, StackedColumnChart } from "@/components/dashboard/charts"; import { CopyButton } from "@/components/dashboard/copy-button"; import { CreateKeyButton } from "@/components/dashboard/create-key-button"; -import { Empty } from "@/components/dashboard/empty"; import { Navbar as SubMenu } from "@/components/dashboard/navbar"; import { Navbar } from "@/components/navbar"; import { PageContent } from "@/components/page-content"; @@ -14,6 +13,7 @@ import { clickhouse } from "@/lib/clickhouse"; import { db } from "@/lib/db"; import { formatNumber } from "@/lib/fmt"; import { Nodes } from "@unkey/icons"; +import { Empty } from "@unkey/ui"; import { BarChart } from "lucide-react"; import { redirect } from "next/navigation"; import { navigation } from "./constants"; diff --git a/apps/dashboard/app/(app)/apis/client.tsx b/apps/dashboard/app/(app)/apis/client.tsx index 0725d6e1c0..0b650e3bea 100644 --- a/apps/dashboard/app/(app)/apis/client.tsx +++ b/apps/dashboard/app/(app)/apis/client.tsx @@ -1,8 +1,8 @@ "use client"; -import { Empty } from "@/components/dashboard/empty"; import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card"; import { PostHogIdentify } from "@/providers/PostHogProvider"; import { useUser } from "@clerk/nextjs"; +import { Empty } from "@unkey/ui"; import { Button } from "@unkey/ui"; import { BookOpen, Code, Search } from "lucide-react"; import Link from "next/link"; diff --git a/apps/dashboard/app/(app)/audit/components/table/audit-log-table-client.tsx b/apps/dashboard/app/(app)/audit/components/table/audit-log-table-client.tsx index b02d1fc624..6587ef0ae6 100644 --- a/apps/dashboard/app/(app)/audit/components/table/audit-log-table-client.tsx +++ b/apps/dashboard/app/(app)/audit/components/table/audit-log-table-client.tsx @@ -1,8 +1,8 @@ "use client"; -import { Empty } from "@/components/dashboard/empty"; import { VirtualTable } from "@/components/virtual-table"; import { trpc } from "@/lib/trpc/client"; +import { Empty } from "@unkey/ui"; import { cn } from "@unkey/ui/src/lib/utils"; import { useState } from "react"; import { useAuditLogParams } from "../../query-state"; diff --git a/apps/dashboard/app/(app)/audit/page.tsx b/apps/dashboard/app/(app)/audit/page.tsx index 18cbd44f37..b6751549be 100644 --- a/apps/dashboard/app/(app)/audit/page.tsx +++ b/apps/dashboard/app/(app)/audit/page.tsx @@ -1,8 +1,8 @@ -import { Empty } from "@/components/dashboard/empty"; import { Navbar } from "@/components/navbar"; import { PageContent } from "@/components/page-content"; import { getTenantId } from "@/lib/auth"; import { InputSearch, Ufo } from "@unkey/icons"; +import { Empty } from "@unkey/ui"; import { type SearchParams, getWorkspace, parseFilterParams } from "./actions"; import { Filters } from "./components/filters"; import { AuditLogTableClient } from "./components/table/audit-log-table-client"; diff --git a/apps/dashboard/app/(app)/authorization/permissions/page.tsx b/apps/dashboard/app/(app)/authorization/permissions/page.tsx index b08e5d2e04..0a314192f9 100644 --- a/apps/dashboard/app/(app)/authorization/permissions/page.tsx +++ b/apps/dashboard/app/(app)/authorization/permissions/page.tsx @@ -1,4 +1,3 @@ -import { Empty } from "@/components/dashboard/empty"; import { Navbar as SubMenu } from "@/components/dashboard/navbar"; import { Navbar } from "@/components/navbar"; import { PageContent } from "@/components/page-content"; @@ -7,6 +6,7 @@ import { getTenantId } from "@/lib/auth"; import { asc, db } from "@/lib/db"; import { permissions } from "@unkey/db/src/schema"; import { ShieldKey } from "@unkey/icons"; +import { Empty } from "@unkey/ui"; import { Button } from "@unkey/ui"; import { ChevronRight, Scan } from "lucide-react"; import Link from "next/link"; diff --git a/apps/dashboard/app/(app)/authorization/roles/page.tsx b/apps/dashboard/app/(app)/authorization/roles/page.tsx index 2fd6e8de91..3504185812 100644 --- a/apps/dashboard/app/(app)/authorization/roles/page.tsx +++ b/apps/dashboard/app/(app)/authorization/roles/page.tsx @@ -1,4 +1,3 @@ -import { Empty } from "@/components/dashboard/empty"; import { Navbar as SubMenu } from "@/components/dashboard/navbar"; import { Navbar } from "@/components/navbar"; import { PageContent } from "@/components/page-content"; @@ -6,6 +5,7 @@ import { Badge } from "@/components/ui/badge"; import { getTenantId } from "@/lib/auth"; import { db } from "@/lib/db"; import { ShieldKey } from "@unkey/icons"; +import { Empty } from "@unkey/ui"; import { Button } from "@unkey/ui"; import { ChevronRight, Scan } from "lucide-react"; import Link from "next/link"; diff --git a/apps/dashboard/app/(app)/identities/page.tsx b/apps/dashboard/app/(app)/identities/page.tsx index d76d0a95ef..2b36542a96 100644 --- a/apps/dashboard/app/(app)/identities/page.tsx +++ b/apps/dashboard/app/(app)/identities/page.tsx @@ -1,6 +1,3 @@ -import { redirect } from "next/navigation"; - -import { Empty } from "@/components/dashboard/empty"; import { Navbar } from "@/components/navbar"; import { OptIn } from "@/components/opt-in"; import { PageContent } from "@/components/page-content"; @@ -8,8 +5,10 @@ import { Table, TableBody, TableHead, TableHeader, TableRow } from "@/components import { getTenantId } from "@/lib/auth"; import { db } from "@/lib/db"; import { Fingerprint } from "@unkey/icons"; +import { Empty } from "@unkey/ui"; import { Loader2 } from "lucide-react"; import { unstable_cache as cache } from "next/cache"; +import { redirect } from "next/navigation"; import { parseAsInteger, parseAsString } from "nuqs/server"; import { Suspense } from "react"; import { SearchField } from "./filter"; diff --git a/apps/dashboard/app/(app)/layout.tsx b/apps/dashboard/app/(app)/layout.tsx index 892e7bc9d7..551c58ee91 100644 --- a/apps/dashboard/app/(app)/layout.tsx +++ b/apps/dashboard/app/(app)/layout.tsx @@ -1,6 +1,6 @@ -import { Empty } from "@/components/dashboard/empty"; import { getTenantId } from "@/lib/auth"; import { db } from "@/lib/db"; +import { Empty } from "@unkey/ui"; import { ShieldBan } from "lucide-react"; import Link from "next/link"; import { redirect } from "next/navigation"; diff --git a/apps/dashboard/app/(app)/ratelimits/[namespaceId]/logs/page.tsx b/apps/dashboard/app/(app)/ratelimits/[namespaceId]/logs/page.tsx index e40b5e2c1c..8ef4a3f831 100644 --- a/apps/dashboard/app/(app)/ratelimits/[namespaceId]/logs/page.tsx +++ b/apps/dashboard/app/(app)/ratelimits/[namespaceId]/logs/page.tsx @@ -3,7 +3,6 @@ import { db } from "@/lib/db"; import { notFound } from "next/navigation"; import { CopyButton } from "@/components/dashboard/copy-button"; -import { Empty } from "@/components/dashboard/empty"; import { Loading } from "@/components/dashboard/loading"; import { Navbar as SubMenu } from "@/components/dashboard/navbar"; import { Navbar } from "@/components/navbar"; @@ -20,6 +19,7 @@ import { } from "@/components/ui/table"; import { clickhouse } from "@/lib/clickhouse"; import { Gauge } from "@unkey/icons"; +import { Empty } from "@unkey/ui"; import { Box, Check, X } from "lucide-react"; import { parseAsArrayOf, parseAsBoolean, parseAsIsoDateTime, parseAsString } from "nuqs/server"; import { Suspense } from "react"; diff --git a/apps/dashboard/app/(app)/ratelimits/[namespaceId]/overrides/page.tsx b/apps/dashboard/app/(app)/ratelimits/[namespaceId]/overrides/page.tsx index 976e443076..e1765246e9 100644 --- a/apps/dashboard/app/(app)/ratelimits/[namespaceId]/overrides/page.tsx +++ b/apps/dashboard/app/(app)/ratelimits/[namespaceId]/overrides/page.tsx @@ -1,5 +1,4 @@ import { CopyButton } from "@/components/dashboard/copy-button"; -import { Empty } from "@/components/dashboard/empty"; import { Navbar as SubMenu } from "@/components/dashboard/navbar"; import { PageHeader } from "@/components/dashboard/page-header"; import { Navbar } from "@/components/navbar"; @@ -8,6 +7,7 @@ import { Badge } from "@/components/ui/badge"; import { getTenantId } from "@/lib/auth"; import { db } from "@/lib/db"; import { Gauge } from "@unkey/icons"; +import { Empty } from "@unkey/ui"; import { Scan } from "lucide-react"; import { notFound } from "next/navigation"; import { navigation } from "../constants"; diff --git a/apps/dashboard/app/(app)/ratelimits/[namespaceId]/page.tsx b/apps/dashboard/app/(app)/ratelimits/[namespaceId]/page.tsx index 227931573d..920fca2824 100644 --- a/apps/dashboard/app/(app)/ratelimits/[namespaceId]/page.tsx +++ b/apps/dashboard/app/(app)/ratelimits/[namespaceId]/page.tsx @@ -1,6 +1,6 @@ import { StackedColumnChart } from "@/components/dashboard/charts"; import { CopyButton } from "@/components/dashboard/copy-button"; -import { Empty } from "@/components/dashboard/empty"; +import { Empty } from "@unkey/ui"; import { Navbar as SubMenu } from "@/components/dashboard/navbar"; import { Navbar } from "@/components/navbar"; import { PageContent } from "@/components/page-content"; diff --git a/apps/dashboard/app/(app)/ratelimits/page.tsx b/apps/dashboard/app/(app)/ratelimits/page.tsx index 456b0125a2..41fad60990 100644 --- a/apps/dashboard/app/(app)/ratelimits/page.tsx +++ b/apps/dashboard/app/(app)/ratelimits/page.tsx @@ -1,5 +1,6 @@ import { CopyButton } from "@/components/dashboard/copy-button"; -import { Empty } from "@/components/dashboard/empty"; +import { Empty } from "@unkey/ui"; + import { Navbar } from "@/components/navbar"; import { PageContent } from "@/components/page-content"; import { Code } from "@/components/ui/code"; diff --git a/apps/dashboard/app/(app)/settings/billing/stripe/page.tsx b/apps/dashboard/app/(app)/settings/billing/stripe/page.tsx index b1f92893f8..aea61debb7 100644 --- a/apps/dashboard/app/(app)/settings/billing/stripe/page.tsx +++ b/apps/dashboard/app/(app)/settings/billing/stripe/page.tsx @@ -1,8 +1,8 @@ -import { Empty } from "@/components/dashboard/empty"; import { getTenantId } from "@/lib/auth"; import { db } from "@/lib/db"; import { stripeEnv } from "@/lib/env"; import { currentUser } from "@clerk/nextjs"; +import { Empty } from "@unkey/ui"; import { headers } from "next/headers"; import { redirect } from "next/navigation"; import Stripe from "stripe"; diff --git a/apps/dashboard/app/(app)/settings/billing/stripe/success/page.tsx b/apps/dashboard/app/(app)/settings/billing/stripe/success/page.tsx index 0a053c4739..b533bace70 100644 --- a/apps/dashboard/app/(app)/settings/billing/stripe/success/page.tsx +++ b/apps/dashboard/app/(app)/settings/billing/stripe/success/page.tsx @@ -1,4 +1,3 @@ -import { Empty } from "@/components/dashboard/empty"; import { Code } from "@/components/ui/code"; import { insertAuditLogs } from "@/lib/audit"; import { getTenantId } from "@/lib/auth"; @@ -7,6 +6,7 @@ import { stripeEnv } from "@/lib/env"; import { PostHogClient } from "@/lib/posthog"; import { currentUser } from "@clerk/nextjs"; import { defaultProSubscriptions } from "@unkey/billing"; +import { Empty } from "@unkey/ui"; import { headers } from "next/headers"; import { redirect } from "next/navigation"; import Stripe from "stripe"; diff --git a/apps/dashboard/app/(app)/settings/team/page.tsx b/apps/dashboard/app/(app)/settings/team/page.tsx index 003ecee55f..d6ab73fd2f 100644 --- a/apps/dashboard/app/(app)/settings/team/page.tsx +++ b/apps/dashboard/app/(app)/settings/team/page.tsx @@ -1,6 +1,6 @@ "use client"; -import { Empty } from "@/components/dashboard/empty"; import { Badge } from "@/components/ui/badge"; +import { Empty } from "@unkey/ui"; import { Button } from "@unkey/ui"; import type React from "react"; import { useState } from "react"; diff --git a/apps/dashboard/app/(app)/settings/user/update-user-email.tsx b/apps/dashboard/app/(app)/settings/user/update-user-email.tsx index 73645efc13..d17b92e3a1 100644 --- a/apps/dashboard/app/(app)/settings/user/update-user-email.tsx +++ b/apps/dashboard/app/(app)/settings/user/update-user-email.tsx @@ -1,5 +1,4 @@ "use client"; -import { Empty } from "@/components/dashboard/empty"; import { Loading } from "@/components/dashboard/loading"; import { Badge } from "@/components/ui/badge"; import { Card, CardContent, CardFooter, CardHeader, CardTitle } from "@/components/ui/card"; @@ -34,6 +33,7 @@ import { toast } from "@/components/ui/toaster"; import type { ClerkError } from "@/lib/clerk"; import { useClerk, useUser } from "@clerk/nextjs"; import { zodResolver } from "@hookform/resolvers/zod"; +import { Empty } from "@unkey/ui"; import { Button } from "@unkey/ui"; import { ChevronsUp, MoreHorizontal, ShieldCheck, X } from "lucide-react"; import React, { useEffect, useState } from "react"; diff --git a/apps/dashboard/app/(app)/settings/user/update-user-name.tsx b/apps/dashboard/app/(app)/settings/user/update-user-name.tsx index 30afbd9d33..b68d335b94 100644 --- a/apps/dashboard/app/(app)/settings/user/update-user-name.tsx +++ b/apps/dashboard/app/(app)/settings/user/update-user-name.tsx @@ -1,5 +1,4 @@ "use client"; -import { Empty } from "@/components/dashboard/empty"; import { Loading } from "@/components/dashboard/loading"; import { Card, CardContent, CardFooter, CardHeader, CardTitle } from "@/components/ui/card"; import { @@ -16,6 +15,7 @@ import { toast } from "@/components/ui/toaster"; import type { ClerkError } from "@/lib/clerk"; import { useUser } from "@clerk/nextjs"; import { zodResolver } from "@hookform/resolvers/zod"; +import { Empty } from "@unkey/ui"; import { Button } from "@unkey/ui"; import type React from "react"; import { useForm } from "react-hook-form"; diff --git a/apps/dashboard/app/(app)/settings/vercel/client.tsx b/apps/dashboard/app/(app)/settings/vercel/client.tsx index f480c9bbc8..b87efd982c 100644 --- a/apps/dashboard/app/(app)/settings/vercel/client.tsx +++ b/apps/dashboard/app/(app)/settings/vercel/client.tsx @@ -1,5 +1,4 @@ "use client"; -import { Empty } from "@/components/dashboard/empty"; import { Loading } from "@/components/dashboard/loading"; import { PageHeader } from "@/components/dashboard/page-header"; import { Avatar, AvatarImage } from "@/components/ui/avatar"; @@ -25,6 +24,7 @@ import { Tooltip, TooltipContent, TooltipTrigger } from "@/components/ui/tooltip import { trpc } from "@/lib/trpc/client"; import { cn } from "@/lib/utils"; import type { Api, Key, VercelBinding } from "@unkey/db"; +import { Empty } from "@unkey/ui"; import { Button } from "@unkey/ui"; import { ExternalLink, Link2, MoreHorizontal, Plus, RefreshCw, Trash, Unlink2 } from "lucide-react"; import ms from "ms"; diff --git a/apps/dashboard/app/(app)/settings/vercel/page.tsx b/apps/dashboard/app/(app)/settings/vercel/page.tsx index bb2ad8e871..a9ad72d592 100644 --- a/apps/dashboard/app/(app)/settings/vercel/page.tsx +++ b/apps/dashboard/app/(app)/settings/vercel/page.tsx @@ -1,4 +1,3 @@ -import { Empty } from "@/components/dashboard/empty"; import { Navbar as SubMenu } from "@/components/dashboard/navbar"; import { Navbar } from "@/components/navbar"; import { PageContent } from "@/components/page-content"; @@ -7,6 +6,7 @@ import { getTenantId } from "@/lib/auth"; import { type Api, type Key, type VercelBinding, db, eq, schema } from "@/lib/db"; import { clerkClient } from "@clerk/nextjs"; import { Gear } from "@unkey/icons"; +import { Empty } from "@unkey/ui"; import { Button } from "@unkey/ui"; import { Vercel } from "@unkey/vercel"; import Link from "next/link"; diff --git a/apps/dashboard/app/integrations/vercel/callback/page.tsx b/apps/dashboard/app/integrations/vercel/callback/page.tsx index fa07365f2e..31ba5a80ce 100644 --- a/apps/dashboard/app/integrations/vercel/callback/page.tsx +++ b/apps/dashboard/app/integrations/vercel/callback/page.tsx @@ -1,8 +1,8 @@ -import { Empty } from "@/components/dashboard/empty"; import { Code } from "@/components/ui/code"; import { getTenantId } from "@/lib/auth"; import { db, eq, schema } from "@/lib/db"; import { vercelIntegrationEnv } from "@/lib/env"; +import { Empty } from "@unkey/ui"; import { Vercel } from "@unkey/vercel"; import { Client } from "./client"; import { exchangeCode } from "./exchange-code"; diff --git a/apps/dashboard/app/new/keys.tsx b/apps/dashboard/app/new/keys.tsx index 9706b351e4..b46f425889 100644 --- a/apps/dashboard/app/new/keys.tsx +++ b/apps/dashboard/app/new/keys.tsx @@ -1,7 +1,6 @@ "use client"; import { CopyButton } from "@/components/dashboard/copy-button"; -import { Empty } from "@/components/dashboard/empty"; import { Loading } from "@/components/dashboard/loading"; import { VisibleButton } from "@/components/dashboard/visible-button"; import { Alert, AlertDescription, AlertTitle } from "@/components/ui/alert"; @@ -16,6 +15,7 @@ import { import { Code } from "@/components/ui/code"; import { Separator } from "@/components/ui/separator"; import { trpc } from "@/lib/trpc/client"; +import { Empty } from "@unkey/ui"; import { Button } from "@unkey/ui"; import { AlertCircle, KeyRound, Lock } from "lucide-react"; import Link from "next/link"; diff --git a/apps/dashboard/components/dashboard/empty-placeholder.tsx b/apps/dashboard/components/dashboard/empty-placeholder.tsx deleted file mode 100644 index cfdcc4141d..0000000000 --- a/apps/dashboard/components/dashboard/empty-placeholder.tsx +++ /dev/null @@ -1,57 +0,0 @@ -import type * as React from "react"; - -import { cn } from "@/lib/utils"; - -export function EmptyPlaceholder({ - className, - children, - ...props -}: React.HTMLAttributes) { - return ( -
-
- {children} -
-
- ); -} - -EmptyPlaceholder.Icon = function EmptyPlaceHolderIcon({ children }: { children: React.ReactNode }) { - return ( -
- {children} -
- ); -}; - -type EmptyPlaceholderTitleProps = React.HTMLAttributes; - -EmptyPlaceholder.Title = function EmptyPlaceholderTitle({ - className, - ...props -}: EmptyPlaceholderTitleProps) { - return

; -}; - -type EmptyPlaceholderDescriptionProps = React.HTMLAttributes; - -EmptyPlaceholder.Description = function EmptyPlaceholderDescription({ - className, - ...props -}: EmptyPlaceholderDescriptionProps) { - return ( -

- ); -}; diff --git a/apps/dashboard/components/dashboard/empty.tsx b/apps/dashboard/components/dashboard/empty.tsx deleted file mode 100644 index de035b2ba0..0000000000 --- a/apps/dashboard/components/dashboard/empty.tsx +++ /dev/null @@ -1,79 +0,0 @@ -import type * as React from "react"; - -import { cn } from "@/lib/utils"; - -interface EmptyRootProps extends React.HTMLAttributes { - fill: boolean | undefined; -} -export function Empty({ className, children, ...props }: EmptyRootProps) { - return ( -

-
{children}
-
- ); -} - -// Empty.Icon = function EmptyIcon({ children }: { children: React.ReactNode }) { -// return ( -//
-// {children} -//
-// ); -// }; -Empty.Icon = function EmptyIcon({ children }: { children: React.ReactNode }) { - return ( -
-
- {/* Add gradient to lines */} -
-
-
-
-
- {children} -
-
-
- ); -}; - -type EmptyTitleProps = React.HTMLAttributes; - -Empty.Title = function EmptyTitle({ className, ...props }: EmptyTitleProps) { - return

; -}; - -type EmptyDescriptionProps = React.HTMLAttributes; - -Empty.Description = function EmptyDescription({ className, ...props }: EmptyDescriptionProps) { - return ( -

- ); -}; - -type EmptyActionProps = React.HTMLAttributes; - -Empty.Action = function EmptyAction({ className, children, ...props }: EmptyActionProps) { - return ( -

- {children} -
- ); -}; diff --git a/apps/dashboard/components/virtual-table.tsx b/apps/dashboard/components/virtual-table.tsx index 567e6c56a3..9f31a43cf3 100644 --- a/apps/dashboard/components/virtual-table.tsx +++ b/apps/dashboard/components/virtual-table.tsx @@ -1,6 +1,6 @@ -import { Empty } from "@/components/dashboard/empty"; import { cn, throttle } from "@/lib/utils"; import { useVirtualizer } from "@tanstack/react-virtual"; +import { Empty } from "@unkey/ui"; import { Button } from "@unkey/ui"; import { Layers2, RefreshCcw } from "lucide-react"; import Link from "next/link"; diff --git a/apps/engineering/content/design/components/empty.example.tsx b/apps/engineering/content/design/components/empty.example.tsx index 6c7853bdc0..6e5b213dae 100644 --- a/apps/engineering/content/design/components/empty.example.tsx +++ b/apps/engineering/content/design/components/empty.example.tsx @@ -15,7 +15,7 @@ export const EmptyExample: React.FC = () => ( Example Title Text Example of Description Text. - diff --git a/internal/ui/src/components/empty.tsx b/internal/ui/src/components/empty.tsx index 01d3d7fc11..879c9e995e 100644 --- a/internal/ui/src/components/empty.tsx +++ b/internal/ui/src/components/empty.tsx @@ -1,4 +1,4 @@ -import type * as React from "react"; +import * as React from "react"; import { cn } from "../lib/utils"; @@ -15,28 +15,21 @@ export function Empty({ className, children, ...props }: EmptyRootProps) { )} {...props} > -
{children}
+
{children}

); } -// Empty.Icon = function EmptyIcon({ children }: { children: React.ReactNode }) { -// return ( -//
-// {children} -//
-// ); -// }; Empty.Icon = function EmptyIcon({ children }: { children: React.ReactNode }) { return (
-
+
{/* Add gradient to lines */} -
-
-
-
-
+
+
+
+
+
{children}
@@ -47,7 +40,7 @@ Empty.Icon = function EmptyIcon({ children }: { children: React.ReactNode }) { type EmptyTitleProps = React.HTMLAttributes; Empty.Title = function EmptyTitle({ className, ...props }: EmptyTitleProps) { - return

; + return

; }; type EmptyDescriptionProps = React.HTMLAttributes; @@ -69,7 +62,7 @@ type EmptyActionProps = React.HTMLAttributes; Empty.Action = function EmptyAction({ className, children, ...props }: EmptyActionProps) { return (
From 4bad5c895e78ee982a4eace449f1b99e88620bc6 Mon Sep 17 00:00:00 2001 From: Michael Silva Date: Tue, 7 Jan 2025 14:22:23 -0500 Subject: [PATCH 03/31] missing import --- apps/dashboard/components/opt-in.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/apps/dashboard/components/opt-in.tsx b/apps/dashboard/components/opt-in.tsx index 0b7f064b9a..137545eee0 100644 --- a/apps/dashboard/components/opt-in.tsx +++ b/apps/dashboard/components/opt-in.tsx @@ -7,7 +7,7 @@ import { Power } from "lucide-react"; import Link from "next/link"; import { useRouter } from "next/navigation"; import type React from "react"; -import { Empty } from "./dashboard/empty"; +import { Empty } from "@unkey/ui"; import { toast } from "@/components/ui/toaster"; import { PostHogEvent } from "@/providers/PostHogProvider"; From 19c2ce95e77636a4714081fb1d848567a0d99ce1 Mon Sep 17 00:00:00 2001 From: "autofix-ci[bot]" <114827586+autofix-ci[bot]@users.noreply.github.com> Date: Tue, 7 Jan 2025 19:27:20 +0000 Subject: [PATCH 04/31] [autofix.ci] apply automated fixes --- apps/dashboard/app/(app)/ratelimits/[namespaceId]/page.tsx | 2 +- apps/dashboard/components/opt-in.tsx | 2 +- internal/ui/src/components/empty.tsx | 2 +- 3 files changed, 3 insertions(+), 3 deletions(-) diff --git a/apps/dashboard/app/(app)/ratelimits/[namespaceId]/page.tsx b/apps/dashboard/app/(app)/ratelimits/[namespaceId]/page.tsx index 920fca2824..e0f7e15ab7 100644 --- a/apps/dashboard/app/(app)/ratelimits/[namespaceId]/page.tsx +++ b/apps/dashboard/app/(app)/ratelimits/[namespaceId]/page.tsx @@ -1,6 +1,5 @@ import { StackedColumnChart } from "@/components/dashboard/charts"; import { CopyButton } from "@/components/dashboard/copy-button"; -import { Empty } from "@unkey/ui"; import { Navbar as SubMenu } from "@/components/dashboard/navbar"; import { Navbar } from "@/components/navbar"; import { PageContent } from "@/components/page-content"; @@ -14,6 +13,7 @@ import { clickhouse } from "@/lib/clickhouse"; import { db, eq, schema, sql } from "@/lib/db"; import { formatNumber } from "@/lib/fmt"; import { Gauge } from "@unkey/icons"; +import { Empty } from "@unkey/ui"; import { BarChart } from "lucide-react"; import ms from "ms"; import { redirect } from "next/navigation"; diff --git a/apps/dashboard/components/opt-in.tsx b/apps/dashboard/components/opt-in.tsx index 137545eee0..dfa033a6d5 100644 --- a/apps/dashboard/components/opt-in.tsx +++ b/apps/dashboard/components/opt-in.tsx @@ -3,11 +3,11 @@ import { trpc } from "@/lib/trpc/client"; import type { Workspace } from "@unkey/db"; import { Button } from "@unkey/ui"; +import { Empty } from "@unkey/ui"; import { Power } from "lucide-react"; import Link from "next/link"; import { useRouter } from "next/navigation"; import type React from "react"; -import { Empty } from "@unkey/ui"; import { toast } from "@/components/ui/toaster"; import { PostHogEvent } from "@/providers/PostHogProvider"; diff --git a/internal/ui/src/components/empty.tsx b/internal/ui/src/components/empty.tsx index 879c9e995e..4ab5d391d4 100644 --- a/internal/ui/src/components/empty.tsx +++ b/internal/ui/src/components/empty.tsx @@ -1,4 +1,4 @@ -import * as React from "react"; +import type * as React from "react"; import { cn } from "../lib/utils"; From b3c14efefdf91e255105135e92994c686a1bb422 Mon Sep 17 00:00:00 2001 From: Michael Silva Date: Tue, 7 Jan 2025 14:42:49 -0500 Subject: [PATCH 05/31] small chages --- apps/engineering/content/design/components/empty.mdx | 11 +++++------ 1 file changed, 5 insertions(+), 6 deletions(-) diff --git a/apps/engineering/content/design/components/empty.mdx b/apps/engineering/content/design/components/empty.mdx index 11ec7ac2db..12e20038a0 100644 --- a/apps/engineering/content/design/components/empty.mdx +++ b/apps/engineering/content/design/components/empty.mdx @@ -8,24 +8,23 @@ import { EmptyExample } from "./empty.example" ## Overview -The `` component should be used in place of a component that may contain empty data in place of the normal component. +The `` component should be used when data is missing, replacing the normal component. ## Empty.Icon -`` can be used to put a styled icon inside the `` component. See `Full Example`. +The `` can insert a styled icon inside the `` component. See the full example for details. ## Empty.Title -The `` is uesed to display a title in the `` component. Can be used if a more empisized text or warning is needed. +The `` is used to display a title within the `` component. It can be utilized to emphasize text or provide a warning. ## Empty.Description -The `` is used to describe why the `` component was used in place of some data. +The `` explains why the `` component is displayed instead of data. ## Empty.Action -The `` is used to give the user an action to resolve having no data. If there are to many filters on a table for example a button may be added to remove table filters. - +The `` offers the user an action to resolve the lack of data. For instance, if there are too many filters on a table, a button can be added to remove those filters. ## Full Example From 543e379b9c4ff8d7be81e80948945596d938554f Mon Sep 17 00:00:00 2001 From: Michael Silva Date: Wed, 8 Jan 2025 09:59:52 -0500 Subject: [PATCH 06/31] styling fixes --- .../app/(app)/[...not-found]/page.tsx | 6 +- .../[apiId]/keys/[keyAuthId]/[keyId]/page.tsx | 2 +- .../apis/[apiId]/keys/[keyAuthId]/keys.tsx | 6 +- .../dashboard/app/(app)/apis/[apiId]/page.tsx | 4 +- apps/dashboard/app/(app)/apis/client.tsx | 4 +- .../table/audit-log-table-client.tsx | 2 +- apps/dashboard/app/(app)/audit/page.tsx | 2 +- .../(app)/authorization/permissions/page.tsx | 4 +- .../app/(app)/authorization/roles/page.tsx | 6 +- apps/dashboard/app/(app)/identities/page.tsx | 2 +- .../ratelimits/[namespaceId]/logs/page.tsx | 4 +- .../[namespaceId]/overrides/page.tsx | 2 +- .../(app)/ratelimits/[namespaceId]/page.tsx | 2 +- apps/dashboard/app/(app)/ratelimits/page.tsx | 6 +- .../(app)/settings/billing/stripe/page.tsx | 2 +- .../settings/billing/stripe/success/page.tsx | 6 +- .../app/(app)/settings/team/page.tsx | 8 +- .../app/(app)/settings/vercel/client.tsx | 6 +- .../app/(app)/settings/vercel/page.tsx | 8 +- .../app/integrations/vercel/callback/page.tsx | 4 +- apps/dashboard/app/new/keys.tsx | 2 +- apps/dashboard/components/opt-in.tsx | 2 +- apps/dashboard/components/virtual-table.tsx | 7 +- .../design/components/empty.example.tsx | 30 ++--- .../content/design/components/empty.mdx | 2 +- internal/ui/colors.css | 126 ++++++++++++++++-- internal/ui/src/components/empty.tsx | 42 +++--- internal/ui/tailwind.config.js | 1 + 28 files changed, 199 insertions(+), 99 deletions(-) diff --git a/apps/dashboard/app/(app)/[...not-found]/page.tsx b/apps/dashboard/app/(app)/[...not-found]/page.tsx index 3070b5ce45..834d4d6913 100644 --- a/apps/dashboard/app/(app)/[...not-found]/page.tsx +++ b/apps/dashboard/app/(app)/[...not-found]/page.tsx @@ -3,14 +3,14 @@ import { Button } from "@unkey/ui"; import Link from "next/link"; export default function NotFound() { return ( - + 404 Not Found We couldn't find the page that you're looking for! -
+ -
+ ); } diff --git a/apps/dashboard/app/(app)/apis/[apiId]/keys/[keyAuthId]/[keyId]/page.tsx b/apps/dashboard/app/(app)/apis/[apiId]/keys/[keyAuthId]/[keyId]/page.tsx index 12e68194e7..0db590666c 100644 --- a/apps/dashboard/app/(app)/apis/[apiId]/keys/[keyAuthId]/[keyId]/page.tsx +++ b/apps/dashboard/app/(app)/apis/[apiId]/keys/[keyAuthId]/[keyId]/page.tsx @@ -352,7 +352,7 @@ export default async function APIKeyDetailPage(props: { ) : ( - + diff --git a/apps/dashboard/app/(app)/apis/[apiId]/keys/[keyAuthId]/keys.tsx b/apps/dashboard/app/(app)/apis/[apiId]/keys/[keyAuthId]/keys.tsx index 5eb9219a11..96e6f3eb87 100644 --- a/apps/dashboard/app/(app)/apis/[apiId]/keys/[keyAuthId]/keys.tsx +++ b/apps/dashboard/app/(app)/apis/[apiId]/keys/[keyAuthId]/keys.tsx @@ -59,16 +59,16 @@ export const Keys: React.FC = async ({ keyAuthId, apiId }) => { return (
{keys.length === 0 ? ( - + No keys found Create your first key - + Go Back - + {/* Create New Role} /> */} diff --git a/apps/dashboard/app/(app)/apis/[apiId]/page.tsx b/apps/dashboard/app/(app)/apis/[apiId]/page.tsx index 62eb638479..6a14703218 100644 --- a/apps/dashboard/app/(app)/apis/[apiId]/page.tsx +++ b/apps/dashboard/app/(app)/apis/[apiId]/page.tsx @@ -246,7 +246,7 @@ export default async function ApiPage(props: { ) : ( - + @@ -288,7 +288,7 @@ export default async function ApiPage(props: { ) : ( - + diff --git a/apps/dashboard/app/(app)/apis/client.tsx b/apps/dashboard/app/(app)/apis/client.tsx index 0b650e3bea..52993bb497 100644 --- a/apps/dashboard/app/(app)/apis/client.tsx +++ b/apps/dashboard/app/(app)/apis/client.tsx @@ -84,7 +84,7 @@ export function ApiList({ apis }: { apis: ApiWithKeys }) { You haven't created any APIs yet. Create one to get started. - + - + )}
diff --git a/apps/dashboard/app/(app)/audit/components/table/audit-log-table-client.tsx b/apps/dashboard/app/(app)/audit/components/table/audit-log-table-client.tsx index 6587ef0ae6..ed74fc3e20 100644 --- a/apps/dashboard/app/(app)/audit/components/table/audit-log-table-client.tsx +++ b/apps/dashboard/app/(app)/audit/components/table/audit-log-table-client.tsx @@ -78,7 +78,7 @@ export const AuditLogTableClient = () => { if (isError) { return ( - + Failed to load audit logs There was a problem fetching the audit logs. Please try refreshing the page or contact diff --git a/apps/dashboard/app/(app)/audit/page.tsx b/apps/dashboard/app/(app)/audit/page.tsx index b6751549be..4e2e9ca28f 100644 --- a/apps/dashboard/app/(app)/audit/page.tsx +++ b/apps/dashboard/app/(app)/audit/page.tsx @@ -38,7 +38,7 @@ export default async function AuditPage(props: Props) { ) : ( - + diff --git a/apps/dashboard/app/(app)/authorization/permissions/page.tsx b/apps/dashboard/app/(app)/authorization/permissions/page.tsx index 0a314192f9..98d38dd548 100644 --- a/apps/dashboard/app/(app)/authorization/permissions/page.tsx +++ b/apps/dashboard/app/(app)/authorization/permissions/page.tsx @@ -86,11 +86,11 @@ export default async function RolesPage() { No permissions found Create your first permission - + Create New Permission} /> - + ) : (
    diff --git a/apps/dashboard/app/(app)/authorization/roles/page.tsx b/apps/dashboard/app/(app)/authorization/roles/page.tsx index 3504185812..3f1f8d8e2a 100644 --- a/apps/dashboard/app/(app)/authorization/roles/page.tsx +++ b/apps/dashboard/app/(app)/authorization/roles/page.tsx @@ -83,18 +83,18 @@ export default async function RolesPage() {
    {workspace.roles.length === 0 ? ( - + No roles found Create your first role - + Create New Role} permissions={workspace.permissions} /> - + ) : (
      diff --git a/apps/dashboard/app/(app)/identities/page.tsx b/apps/dashboard/app/(app)/identities/page.tsx index 2b36542a96..2874f705a3 100644 --- a/apps/dashboard/app/(app)/identities/page.tsx +++ b/apps/dashboard/app/(app)/identities/page.tsx @@ -51,7 +51,7 @@ export default async function Page(props: Props) {
      + diff --git a/apps/dashboard/app/(app)/ratelimits/[namespaceId]/logs/page.tsx b/apps/dashboard/app/(app)/ratelimits/[namespaceId]/logs/page.tsx index 8ef4a3f831..82555a17cb 100644 --- a/apps/dashboard/app/(app)/ratelimits/[namespaceId]/logs/page.tsx +++ b/apps/dashboard/app/(app)/ratelimits/[namespaceId]/logs/page.tsx @@ -102,7 +102,7 @@ export default async function AuditPage(props: Props) { + @@ -156,7 +156,7 @@ const AuditLogTable: React.FC<{ if (logs.length === 0) { return ( - + diff --git a/apps/dashboard/app/(app)/ratelimits/[namespaceId]/overrides/page.tsx b/apps/dashboard/app/(app)/ratelimits/[namespaceId]/overrides/page.tsx index e1765246e9..a086560dbb 100644 --- a/apps/dashboard/app/(app)/ratelimits/[namespaceId]/overrides/page.tsx +++ b/apps/dashboard/app/(app)/ratelimits/[namespaceId]/overrides/page.tsx @@ -97,7 +97,7 @@ export default async function OverridePage(props: Props) { {namespace.overrides.length === 0 ? ( - + diff --git a/apps/dashboard/app/(app)/ratelimits/[namespaceId]/page.tsx b/apps/dashboard/app/(app)/ratelimits/[namespaceId]/page.tsx index e0f7e15ab7..6aeb65491c 100644 --- a/apps/dashboard/app/(app)/ratelimits/[namespaceId]/page.tsx +++ b/apps/dashboard/app/(app)/ratelimits/[namespaceId]/page.tsx @@ -224,7 +224,7 @@ export default async function RatelimitNamespacePage(props: { ) : ( - + diff --git a/apps/dashboard/app/(app)/ratelimits/page.tsx b/apps/dashboard/app/(app)/ratelimits/page.tsx index 41fad60990..ee7e5e7042 100644 --- a/apps/dashboard/app/(app)/ratelimits/page.tsx +++ b/apps/dashboard/app/(app)/ratelimits/page.tsx @@ -70,7 +70,7 @@ export default async function RatelimitOverviewPage() { ))}
    ) : ( - + @@ -83,14 +83,14 @@ export default async function RatelimitOverviewPage() { {snippet} - + - + )} diff --git a/apps/dashboard/app/(app)/settings/billing/stripe/page.tsx b/apps/dashboard/app/(app)/settings/billing/stripe/page.tsx index aea61debb7..e31ced2892 100644 --- a/apps/dashboard/app/(app)/settings/billing/stripe/page.tsx +++ b/apps/dashboard/app/(app)/settings/billing/stripe/page.tsx @@ -31,7 +31,7 @@ export default async function StripeRedirect(props: Props) { const e = stripeEnv(); if (!e) { return ( - + Stripe is not configured If you are selfhosting Unkey, you need to configure Stripe in your environment variables. diff --git a/apps/dashboard/app/(app)/settings/billing/stripe/success/page.tsx b/apps/dashboard/app/(app)/settings/billing/stripe/success/page.tsx index b533bace70..9adce0c266 100644 --- a/apps/dashboard/app/(app)/settings/billing/stripe/success/page.tsx +++ b/apps/dashboard/app/(app)/settings/billing/stripe/success/page.tsx @@ -36,7 +36,7 @@ export default async function StripeSuccess(props: Props) { const e = stripeEnv(); if (!e) { return ( - + Stripe is not configured If you are selfhosting Unkey, you need to configure Stripe in your environment variables. @@ -53,7 +53,7 @@ export default async function StripeSuccess(props: Props) { const session = await stripe.checkout.sessions.retrieve(session_id); if (!session) { return ( - + Stripe session not found The Stripe session {session_id} @@ -66,7 +66,7 @@ export default async function StripeSuccess(props: Props) { const customer = await stripe.customers.retrieve(session.customer as string); if (!customer) { return ( - + Stripe customer not found The Stripe customer {session.customer as string} diff --git a/apps/dashboard/app/(app)/settings/team/page.tsx b/apps/dashboard/app/(app)/settings/team/page.tsx index d6ab73fd2f..ec340de203 100644 --- a/apps/dashboard/app/(app)/settings/team/page.tsx +++ b/apps/dashboard/app/(app)/settings/team/page.tsx @@ -61,14 +61,14 @@ export default function TeamPage() {
    - + This is a personal account You can only manage teams in paid workspaces. - + - +
    @@ -214,7 +214,7 @@ const Invitations: React.FC = () => { if (!invitationList || invitationList.length === 0) { return ( - + No pending invitations Invite members to your team diff --git a/apps/dashboard/app/(app)/settings/vercel/client.tsx b/apps/dashboard/app/(app)/settings/vercel/client.tsx index b87efd982c..13b9338478 100644 --- a/apps/dashboard/app/(app)/settings/vercel/client.tsx +++ b/apps/dashboard/app/(app)/settings/vercel/client.tsx @@ -64,7 +64,7 @@ export const Client: React.FC = ({ projects, integration, apis, rootKeys if (projects.length === 0) { return ( - + = ({ projects, integration, apis, rootKeys No connected projects found Connect a Vercel project now - + - + ); } diff --git a/apps/dashboard/app/(app)/settings/vercel/page.tsx b/apps/dashboard/app/(app)/settings/vercel/page.tsx index a9ad72d592..51df68fcb3 100644 --- a/apps/dashboard/app/(app)/settings/vercel/page.tsx +++ b/apps/dashboard/app/(app)/settings/vercel/page.tsx @@ -61,13 +61,13 @@ export default async function Page(props: Props) {
    - + Vercel is not connected to this workspace - + - +
    @@ -83,7 +83,7 @@ export default async function Page(props: Props) { if (err) { return ( - + Error We couldn't load your projects from Vercel. Please try again or contact support. diff --git a/apps/dashboard/app/integrations/vercel/callback/page.tsx b/apps/dashboard/app/integrations/vercel/callback/page.tsx index 31ba5a80ce..d657910d3e 100644 --- a/apps/dashboard/app/integrations/vercel/callback/page.tsx +++ b/apps/dashboard/app/integrations/vercel/callback/page.tsx @@ -66,7 +66,7 @@ export default async function Page(props: Props) { }).listProjects(); if (projects.err) { return ( - + Error We couldn't load your projects from Vercel. Please try again or contact support. @@ -87,7 +87,7 @@ export default async function Page(props: Props) { if (projects.val.length === 0) { return ( - + No Projects Found You did not authorize any projects to be connected. Please go to your Vercel dashboard and diff --git a/apps/dashboard/app/new/keys.tsx b/apps/dashboard/app/new/keys.tsx index b46f425889..04531f788b 100644 --- a/apps/dashboard/app/new/keys.tsx +++ b/apps/dashboard/app/new/keys.tsx @@ -121,7 +121,7 @@ export const Keys: React.FC = ({ keyAuthId, apiId }) => { {step.step === "CREATE_ROOT_KEY" ? ( - + Let's begin by creating a root key - + )}
    diff --git a/apps/engineering/content/design/components/empty.example.tsx b/apps/engineering/content/design/components/empty.example.tsx index 6e5b213dae..dbf72ae65d 100644 --- a/apps/engineering/content/design/components/empty.example.tsx +++ b/apps/engineering/content/design/components/empty.example.tsx @@ -1,25 +1,21 @@ -"use client"; import { RenderComponentWithSnippet } from "@/app/components/render"; -import { Row } from "@/app/components/row"; +import { BookBookmark, ShieldCheck } from "@unkey/icons"; import { Button } from "@unkey/ui"; import { Empty } from "@unkey/ui"; -import { BookOpen, ShieldBan } from "lucide-react"; export const EmptyExample: React.FC = () => ( - - - - - - Example Title Text - Example of Description Text. - - - - - + + + + + Example Title Text + Example of Description Text. + + + + ); diff --git a/apps/engineering/content/design/components/empty.mdx b/apps/engineering/content/design/components/empty.mdx index 12e20038a0..1b513b089b 100644 --- a/apps/engineering/content/design/components/empty.mdx +++ b/apps/engineering/content/design/components/empty.mdx @@ -1,11 +1,11 @@ --- title: Empty --- +import { Empty } from "@unkey/ui" import { RenderComponentWithSnippet } from "@/app/components/render" import { Row } from "@/app/components/row" import { EmptyExample } from "./empty.example" - ## Overview The `` component should be used when data is missing, replacing the normal component. diff --git a/internal/ui/colors.css b/internal/ui/colors.css index f09bb24a9b..4291d7f99a 100644 --- a/internal/ui/colors.css +++ b/internal/ui/colors.css @@ -2,16 +2,68 @@ @tailwind components; @tailwind utilities; -/* -All colors are taken from Radix -https://www.radix-ui.com/colors/docs/palette-composition/scales -*/ + @layer base { :root { + /*Gradients*/ + + --chart-1: 0 75% 60%; + /* Red */ + --chart-2: 200 75% 55%; + /* Blue */ + --chart-3: 150 65% 50%; + /* Green */ + --chart-4: 25 85% 55%; + /* Orange */ + --chart-5: 340 70% 55%; + /* Pink */ + --cartesian-grid-stroke: 214 12% 89%; + + --white: 0 0% 100%; + --black: 0 0% 0%; + --background: 60 9% 98%; + --background-subtle: 60 9% 94%; + + --brand: 262 93% 58%; + --brand-foreground: 262 93% 90%; + + --warn: 46, 97%, 65%; + --warn-foreground: 46, 97%, 15%; + + --alert: 0 100% 65%; + --alert-foreground: 0 100% 980%; + + --success: 152, 56%, 39%; + + --primary: 24 10% 10%; + --primary-foreground: 24 10% 90%; + + --secondary: 20 6% 94%; + --secondary-foreground: 0 0% 0%; + + --content: 240 10% 3.9%; + --content-subtle: 240 3.8% 46.1%; + + --content-warn: 46, 97%, 40%; + --content-alert: 0 84.2% 60.2%; + + --border: 24, 6%, 83%; + --ring: 24, 6%, 83%; + --amber-2: #fff9ed; + --amber-3: #fff4d5; + --amber-4: #ffecbc; + --amber-6: #ffd386; + --amber-11: #ad5700; + + --red-2: #fff8f8; + --red-3: #ffefef; + --red-4: #ffe5e5; + --red-6: #f9c6c6; + --red-11: #cd2b31; /* Gray */ --gray-1: 0, 0%, 99%; - --gray-2: 0, 0%, 98%; + --gray-2: #F9F9FB; --gray-3: 0, 0%, 94%; --gray-4: 0, 0%, 91%; --gray-5: 0, 0%, 88%; @@ -22,6 +74,8 @@ https://www.radix-ui.com/colors/docs/palette-composition/scales --gray-10: 0, 0%, 51%; --gray-11: 0, 0%, 39%; --gray-12: 0, 0%, 13%; + --gray-linestart: 240, 100%, 17%, 0.01; + --gray-linemid: 240, 100%, 10%, 0.06; /* Teal */ @@ -108,7 +162,7 @@ https://www.radix-ui.com/colors/docs/palette-composition/scales --accent-9: 231, 6%, 57%; --accent-10: 226, 5%, 53%; --accent-11: 220, 6%, 40%; - --accent-12: 210, 13%, 13%; + --accent-12: #1C2024; } @@ -116,9 +170,63 @@ https://www.radix-ui.com/colors/docs/palette-composition/scales .dark { + --chart-1: 262 75% 65%; + /* Lighter Red */ + --chart-2: 200 70% 60%; + /* Lighter blue */ + --chart-3: 150 60% 55%; + /* Lighter green */ + --chart-4: 25 80% 60%; + /* Lighter orange */ + --chart-5: 340 65% 60%; + /* Lighter pink */ + --cartesian-grid-stroke: 0 0% 20%; + + --white: 0 0% 100%; + --black: 0 0% 0%; + + --background: 20 14% 2%; + --background-subtle: 24 10% 10%; + + --brand: 25 95% 53%; + --brand-foreground: 25 95% 90%; + + --warn: 46, 100%, 45%; + --warn-foreground: 46, 97%, 5%; + + --alert: 0 100% 45%; + --alert-foreground: 0 100% 95%; + + --success: 152, 56%, 39%; + + --primary: 20 6% 94%; + --primary-foreground: 20 6% 10%; + + --secondary: 24 10% 10%; + --secondary-foreground: 24 10% 100%; + + --content: 240 10% 90%; + --content-subtle: 240 3.8% 46.1%; + --content-warn: 46, 100%, 55%; + --content-alert: 0 84.2% 60.2%; + + --border: 12, 6%, 15%; + --ring: 12, 6%, 15%; + + --amber-2: #271700; + --amber-3: #341c00; + --amber-4: #3f2200; + --amber-6: #573300; + --amber-11: #f1a10d; + + --red-2: #291415; + --red-3: #3c181a; + --red-4: #481a1d; + --red-6: #671e22; + --red-11: #ff6369; /* Gray Dark */ --gray-1: 0, 0%, 7%; - --gray-2: 0, 0%, 10%; + --gray-2: #18191B; --gray-3: 0, 0%, 13%; --gray-4: 0, 0%, 16%; --gray-5: 0, 0%, 19%; @@ -215,6 +323,6 @@ https://www.radix-ui.com/colors/docs/palette-composition/scales --accent-9: 219, 6%, 44%; --accent-10: 222, 5%, 49%; --accent-11: 216, 7%, 71%; - --accent-12: 220, 9%, 94%; + --accent-12: #EDEEF0; } -} +} \ No newline at end of file diff --git a/internal/ui/src/components/empty.tsx b/internal/ui/src/components/empty.tsx index 4ab5d391d4..f06e22e912 100644 --- a/internal/ui/src/components/empty.tsx +++ b/internal/ui/src/components/empty.tsx @@ -1,18 +1,14 @@ -import type * as React from "react"; +import React from "react"; import { cn } from "../lib/utils"; interface EmptyRootProps extends React.HTMLAttributes { - fill: boolean | undefined; + fill?: boolean; } export function Empty({ className, children, ...props }: EmptyRootProps) { return (
    {children}
    @@ -24,23 +20,27 @@ Empty.Icon = function EmptyIcon({ children }: { children: React.ReactNode }) { return (
    - {/* Add gradient to lines */} -
    -
    -
    -
    -
    +
    +
    +
    +
    +
    {children}
    - ); + ); }; type EmptyTitleProps = React.HTMLAttributes; Empty.Title = function EmptyTitle({ className, ...props }: EmptyTitleProps) { - return

    ; + return ( +

    + ); }; type EmptyDescriptionProps = React.HTMLAttributes; @@ -48,10 +48,7 @@ type EmptyDescriptionProps = React.HTMLAttributes; Empty.Description = function EmptyDescription({ className, ...props }: EmptyDescriptionProps) { return (

    ); @@ -59,12 +56,11 @@ Empty.Description = function EmptyDescription({ className, ...props }: EmptyDesc type EmptyActionProps = React.HTMLAttributes; -Empty.Action = function EmptyAction({ className, children, ...props }: EmptyActionProps) { +Empty.Actions = function EmptyAction({ className, children, ...props }: EmptyActionProps) { return (

    {children}
    diff --git a/internal/ui/tailwind.config.js b/internal/ui/tailwind.config.js index ca5583bc1f..6b01b979bf 100644 --- a/internal/ui/tailwind.config.js +++ b/internal/ui/tailwind.config.js @@ -19,6 +19,7 @@ export default { error: palette("error"), feature: palette("feature"), accent: palette("accent"), + line: palette("line"), }, dropShadow: { // from vitor's figma From 380497386ab4cd4452e2e9977866092ee278c3c2 Mon Sep 17 00:00:00 2001 From: "autofix-ci[bot]" <114827586+autofix-ci[bot]@users.noreply.github.com> Date: Wed, 8 Jan 2025 15:02:40 +0000 Subject: [PATCH 07/31] [autofix.ci] apply automated fixes --- internal/ui/src/components/empty.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/internal/ui/src/components/empty.tsx b/internal/ui/src/components/empty.tsx index f06e22e912..96f18e7208 100644 --- a/internal/ui/src/components/empty.tsx +++ b/internal/ui/src/components/empty.tsx @@ -1,4 +1,4 @@ -import React from "react"; +import type React from "react"; import { cn } from "../lib/utils"; @@ -29,7 +29,7 @@ Empty.Icon = function EmptyIcon({ children }: { children: React.ReactNode }) {

    - ); + ); }; type EmptyTitleProps = React.HTMLAttributes; From f856e8ef24a64ed2c66ad30172e45c2bb3bc97a6 Mon Sep 17 00:00:00 2001 From: Michael Silva Date: Wed, 8 Jan 2025 10:21:28 -0500 Subject: [PATCH 08/31] reverted colors --- internal/ui/colors.css | 11 ++++------- 1 file changed, 4 insertions(+), 7 deletions(-) diff --git a/internal/ui/colors.css b/internal/ui/colors.css index 4291d7f99a..c1a6ecfce0 100644 --- a/internal/ui/colors.css +++ b/internal/ui/colors.css @@ -63,7 +63,7 @@ --red-11: #cd2b31; /* Gray */ --gray-1: 0, 0%, 99%; - --gray-2: #F9F9FB; + --gray-2: 0, 0%, 98%; --gray-3: 0, 0%, 94%; --gray-4: 0, 0%, 91%; --gray-5: 0, 0%, 88%; @@ -74,9 +74,6 @@ --gray-10: 0, 0%, 51%; --gray-11: 0, 0%, 39%; --gray-12: 0, 0%, 13%; - --gray-linestart: 240, 100%, 17%, 0.01; - --gray-linemid: 240, 100%, 10%, 0.06; - /* Teal */ --success-1: 165, 67%, 99%; @@ -162,7 +159,7 @@ --accent-9: 231, 6%, 57%; --accent-10: 226, 5%, 53%; --accent-11: 220, 6%, 40%; - --accent-12: #1C2024; + --accent-12: 210, 13%, 13%; } @@ -226,7 +223,7 @@ --red-11: #ff6369; /* Gray Dark */ --gray-1: 0, 0%, 7%; - --gray-2: #18191B; + --gray-2: 0, 0%, 10%; --gray-3: 0, 0%, 13%; --gray-4: 0, 0%, 16%; --gray-5: 0, 0%, 19%; @@ -323,6 +320,6 @@ --accent-9: 219, 6%, 44%; --accent-10: 222, 5%, 49%; --accent-11: 216, 7%, 71%; - --accent-12: #EDEEF0; + --accent-12: 220, 9%, 94%; } } \ No newline at end of file From b75ed45fc870a1c6087bb2329c2ced04419d9b20 Mon Sep 17 00:00:00 2001 From: Michael Silva Date: Wed, 8 Jan 2025 10:28:13 -0500 Subject: [PATCH 09/31] typo --- apps/dashboard/styles/tailwind/tailwind.css | 2 +- internal/ui/colors.css | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/apps/dashboard/styles/tailwind/tailwind.css b/apps/dashboard/styles/tailwind/tailwind.css index 0580d6438b..4beddd4152 100644 --- a/apps/dashboard/styles/tailwind/tailwind.css +++ b/apps/dashboard/styles/tailwind/tailwind.css @@ -22,7 +22,7 @@ --warn-foreground: 46, 97%, 15%; --alert: 0 100% 65%; - --alert-foreground: 0 100% 980%; + --alert-foreground: 0 100% 98%; --success: 152, 56%, 39%; diff --git a/internal/ui/colors.css b/internal/ui/colors.css index c1a6ecfce0..00a8335c41 100644 --- a/internal/ui/colors.css +++ b/internal/ui/colors.css @@ -31,7 +31,7 @@ --warn-foreground: 46, 97%, 15%; --alert: 0 100% 65%; - --alert-foreground: 0 100% 980%; + --alert-foreground: 0 100% 98%; --success: 152, 56%, 39%; From c9ab08ce234caea3790c721911d2cbc82f2a7fb0 Mon Sep 17 00:00:00 2001 From: Michael Silva Date: Wed, 8 Jan 2025 10:38:07 -0500 Subject: [PATCH 10/31] revert color file --- internal/ui/colors.css | 115 ++--------------------------------------- 1 file changed, 5 insertions(+), 110 deletions(-) diff --git a/internal/ui/colors.css b/internal/ui/colors.css index 00a8335c41..63ed8b0c5a 100644 --- a/internal/ui/colors.css +++ b/internal/ui/colors.css @@ -2,65 +2,13 @@ @tailwind components; @tailwind utilities; - +/* +All colors are taken from Radix +https://www.radix-ui.com/colors/docs/palette-composition/scales +*/ @layer base { :root { - /*Gradients*/ - - --chart-1: 0 75% 60%; - /* Red */ - --chart-2: 200 75% 55%; - /* Blue */ - --chart-3: 150 65% 50%; - /* Green */ - --chart-4: 25 85% 55%; - /* Orange */ - --chart-5: 340 70% 55%; - /* Pink */ - --cartesian-grid-stroke: 214 12% 89%; - - --white: 0 0% 100%; - --black: 0 0% 0%; - --background: 60 9% 98%; - --background-subtle: 60 9% 94%; - - --brand: 262 93% 58%; - --brand-foreground: 262 93% 90%; - - --warn: 46, 97%, 65%; - --warn-foreground: 46, 97%, 15%; - - --alert: 0 100% 65%; - --alert-foreground: 0 100% 98%; - - --success: 152, 56%, 39%; - - --primary: 24 10% 10%; - --primary-foreground: 24 10% 90%; - - --secondary: 20 6% 94%; - --secondary-foreground: 0 0% 0%; - - --content: 240 10% 3.9%; - --content-subtle: 240 3.8% 46.1%; - - --content-warn: 46, 97%, 40%; - --content-alert: 0 84.2% 60.2%; - - --border: 24, 6%, 83%; - --ring: 24, 6%, 83%; - - --amber-2: #fff9ed; - --amber-3: #fff4d5; - --amber-4: #ffecbc; - --amber-6: #ffd386; - --amber-11: #ad5700; - --red-2: #fff8f8; - --red-3: #ffefef; - --red-4: #ffe5e5; - --red-6: #f9c6c6; - --red-11: #cd2b31; /* Gray */ --gray-1: 0, 0%, 99%; --gray-2: 0, 0%, 98%; @@ -75,6 +23,7 @@ --gray-11: 0, 0%, 39%; --gray-12: 0, 0%, 13%; + /* Teal */ --success-1: 165, 67%, 99%; --success-2: 165, 50%, 97%; @@ -167,60 +116,6 @@ .dark { - --chart-1: 262 75% 65%; - /* Lighter Red */ - --chart-2: 200 70% 60%; - /* Lighter blue */ - --chart-3: 150 60% 55%; - /* Lighter green */ - --chart-4: 25 80% 60%; - /* Lighter orange */ - --chart-5: 340 65% 60%; - /* Lighter pink */ - --cartesian-grid-stroke: 0 0% 20%; - - --white: 0 0% 100%; - --black: 0 0% 0%; - - --background: 20 14% 2%; - --background-subtle: 24 10% 10%; - - --brand: 25 95% 53%; - --brand-foreground: 25 95% 90%; - - --warn: 46, 100%, 45%; - --warn-foreground: 46, 97%, 5%; - - --alert: 0 100% 45%; - --alert-foreground: 0 100% 95%; - - --success: 152, 56%, 39%; - - --primary: 20 6% 94%; - --primary-foreground: 20 6% 10%; - - --secondary: 24 10% 10%; - --secondary-foreground: 24 10% 100%; - - --content: 240 10% 90%; - --content-subtle: 240 3.8% 46.1%; - --content-warn: 46, 100%, 55%; - --content-alert: 0 84.2% 60.2%; - - --border: 12, 6%, 15%; - --ring: 12, 6%, 15%; - - --amber-2: #271700; - --amber-3: #341c00; - --amber-4: #3f2200; - --amber-6: #573300; - --amber-11: #f1a10d; - - --red-2: #291415; - --red-3: #3c181a; - --red-4: #481a1d; - --red-6: #671e22; - --red-11: #ff6369; /* Gray Dark */ --gray-1: 0, 0%, 7%; --gray-2: 0, 0%, 10%; From bd3310c5c4f1c8ec16db4bcee3b598c6d268806a Mon Sep 17 00:00:00 2001 From: Michael Silva Date: Wed, 8 Jan 2025 10:55:35 -0500 Subject: [PATCH 11/31] revert experiment --- internal/ui/tailwind.config.js | 1 - 1 file changed, 1 deletion(-) diff --git a/internal/ui/tailwind.config.js b/internal/ui/tailwind.config.js index 6b01b979bf..ca5583bc1f 100644 --- a/internal/ui/tailwind.config.js +++ b/internal/ui/tailwind.config.js @@ -19,7 +19,6 @@ export default { error: palette("error"), feature: palette("feature"), accent: palette("accent"), - line: palette("line"), }, dropShadow: { // from vitor's figma From 850cb8bdead7b80c023c0ba3c8e202b0b5f698ad Mon Sep 17 00:00:00 2001 From: Michael Silva Date: Wed, 8 Jan 2025 11:15:13 -0500 Subject: [PATCH 12/31] icon size --- apps/engineering/content/design/components/empty.example.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/apps/engineering/content/design/components/empty.example.tsx b/apps/engineering/content/design/components/empty.example.tsx index dbf72ae65d..a13a256b45 100644 --- a/apps/engineering/content/design/components/empty.example.tsx +++ b/apps/engineering/content/design/components/empty.example.tsx @@ -7,7 +7,7 @@ export const EmptyExample: React.FC = () => ( - + Example Title Text Example of Description Text. From 5abbdf6699e91ff9fe02eb9a4f15642107ff3836 Mon Sep 17 00:00:00 2001 From: "autofix-ci[bot]" <114827586+autofix-ci[bot]@users.noreply.github.com> Date: Wed, 8 Jan 2025 16:17:51 +0000 Subject: [PATCH 13/31] [autofix.ci] apply automated fixes --- apps/engineering/content/design/components/empty.example.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/apps/engineering/content/design/components/empty.example.tsx b/apps/engineering/content/design/components/empty.example.tsx index a13a256b45..0ccf2cc027 100644 --- a/apps/engineering/content/design/components/empty.example.tsx +++ b/apps/engineering/content/design/components/empty.example.tsx @@ -7,7 +7,7 @@ export const EmptyExample: React.FC = () => ( - + Example Title Text Example of Description Text. From fd854f36e3f0232b95544b3b0ee9f8462a56bd4e Mon Sep 17 00:00:00 2001 From: Michael Silva Date: Thu, 9 Jan 2025 12:57:13 -0500 Subject: [PATCH 14/31] pr changes --- .../(app)/authorization/permissions/page.tsx | 2 +- apps/dashboard/app/(app)/layout.tsx | 2 +- apps/dashboard/app/(app)/ratelimits/page.tsx | 2 +- .../(app)/settings/user/update-user-email.tsx | 2 +- .../app/integrations/vercel/callback/page.tsx | 4 +- apps/dashboard/components/opt-in.tsx | 2 +- .../design/components/empty.example.tsx | 21 ----- .../content/design/components/empty.mdx | 22 +++++- internal/ui/src/components/empty.tsx | 79 ++++++++++++++++--- 9 files changed, 96 insertions(+), 40 deletions(-) delete mode 100644 apps/engineering/content/design/components/empty.example.tsx diff --git a/apps/dashboard/app/(app)/authorization/permissions/page.tsx b/apps/dashboard/app/(app)/authorization/permissions/page.tsx index 98d38dd548..189f14e5e3 100644 --- a/apps/dashboard/app/(app)/authorization/permissions/page.tsx +++ b/apps/dashboard/app/(app)/authorization/permissions/page.tsx @@ -80,7 +80,7 @@ export default async function RolesPage() {
    {workspace.permissions.length === 0 ? ( - + diff --git a/apps/dashboard/app/(app)/layout.tsx b/apps/dashboard/app/(app)/layout.tsx index 551c58ee91..a151f5523f 100644 --- a/apps/dashboard/app/(app)/layout.tsx +++ b/apps/dashboard/app/(app)/layout.tsx @@ -50,7 +50,7 @@ export default async function Layout({ children }: LayoutProps) { children ) : (
    - + diff --git a/apps/dashboard/app/(app)/ratelimits/page.tsx b/apps/dashboard/app/(app)/ratelimits/page.tsx index ee7e5e7042..575f351130 100644 --- a/apps/dashboard/app/(app)/ratelimits/page.tsx +++ b/apps/dashboard/app/(app)/ratelimits/page.tsx @@ -70,7 +70,7 @@ export default async function RatelimitOverviewPage() { ))}
) : ( - + diff --git a/apps/dashboard/app/(app)/settings/user/update-user-email.tsx b/apps/dashboard/app/(app)/settings/user/update-user-email.tsx index d17b92e3a1..a22cec7856 100644 --- a/apps/dashboard/app/(app)/settings/user/update-user-email.tsx +++ b/apps/dashboard/app/(app)/settings/user/update-user-email.tsx @@ -73,7 +73,7 @@ export const UpdateUserEmail: React.FC = () => { if (!user) { return ( - + ); diff --git a/apps/dashboard/app/integrations/vercel/callback/page.tsx b/apps/dashboard/app/integrations/vercel/callback/page.tsx index d657910d3e..875f8fb8ba 100644 --- a/apps/dashboard/app/integrations/vercel/callback/page.tsx +++ b/apps/dashboard/app/integrations/vercel/callback/page.tsx @@ -66,7 +66,7 @@ export default async function Page(props: Props) { }).listProjects(); if (projects.err) { return ( - + Error We couldn't load your projects from Vercel. Please try again or contact support. @@ -87,7 +87,7 @@ export default async function Page(props: Props) { if (projects.val.length === 0) { return ( - + No Projects Found You did not authorize any projects to be connected. Please go to your Vercel dashboard and diff --git a/apps/dashboard/components/opt-in.tsx b/apps/dashboard/components/opt-in.tsx index 10627536d1..7bdba8693f 100644 --- a/apps/dashboard/components/opt-in.tsx +++ b/apps/dashboard/components/opt-in.tsx @@ -40,7 +40,7 @@ export const OptIn: React.FC = ({ title, description, feature }) => { }, }); return ( - + diff --git a/apps/engineering/content/design/components/empty.example.tsx b/apps/engineering/content/design/components/empty.example.tsx deleted file mode 100644 index 0ccf2cc027..0000000000 --- a/apps/engineering/content/design/components/empty.example.tsx +++ /dev/null @@ -1,21 +0,0 @@ -import { RenderComponentWithSnippet } from "@/app/components/render"; -import { BookBookmark, ShieldCheck } from "@unkey/icons"; -import { Button } from "@unkey/ui"; -import { Empty } from "@unkey/ui"; - -export const EmptyExample: React.FC = () => ( - - - - - - Example Title Text - Example of Description Text. - - - - - -); diff --git a/apps/engineering/content/design/components/empty.mdx b/apps/engineering/content/design/components/empty.mdx index 1b513b089b..f460eb7ce6 100644 --- a/apps/engineering/content/design/components/empty.mdx +++ b/apps/engineering/content/design/components/empty.mdx @@ -4,7 +4,9 @@ title: Empty import { Empty } from "@unkey/ui" import { RenderComponentWithSnippet } from "@/app/components/render" import { Row } from "@/app/components/row" -import { EmptyExample } from "./empty.example" +import { BookBookmark, ShieldCheck } from "@unkey/icons"; +import { Button } from "@unkey/ui"; +import { ArrowLeft, ArrowRight, Settings2, Trash } from "lucide-react"; ## Overview @@ -28,4 +30,20 @@ The `` offers the user an action to resolve the lack of data. Fo ## Full Example - + + + + + + + Example Title Text + Example of Description Text. + + + + + + diff --git a/internal/ui/src/components/empty.tsx b/internal/ui/src/components/empty.tsx index 96f18e7208..147cdcdceb 100644 --- a/internal/ui/src/components/empty.tsx +++ b/internal/ui/src/components/empty.tsx @@ -1,31 +1,90 @@ import type React from "react"; - import { cn } from "../lib/utils"; -interface EmptyRootProps extends React.HTMLAttributes { - fill?: boolean; -} +interface EmptyRootProps extends React.HTMLAttributes {} export function Empty({ className, children, ...props }: EmptyRootProps) { return (
-
{children}
+ {children}
); } Empty.Icon = function EmptyIcon({ children }: { children: React.ReactNode }) { return ( -
+
-
- {children} +
+ + + + + + + + + + +
@@ -59,7 +118,7 @@ type EmptyActionProps = React.HTMLAttributes; Empty.Actions = function EmptyAction({ className, children, ...props }: EmptyActionProps) { return (
{children} From a97882d0428036347c73452f1784242375d36856 Mon Sep 17 00:00:00 2001 From: Michael Silva Date: Thu, 9 Jan 2025 13:07:26 -0500 Subject: [PATCH 15/31] wording --- internal/ui/src/components/empty.tsx | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/internal/ui/src/components/empty.tsx b/internal/ui/src/components/empty.tsx index 147cdcdceb..6a3999089c 100644 --- a/internal/ui/src/components/empty.tsx +++ b/internal/ui/src/components/empty.tsx @@ -113,12 +113,12 @@ Empty.Description = function EmptyDescription({ className, ...props }: EmptyDesc ); }; -type EmptyActionProps = React.HTMLAttributes; +type EmptyActionsProps = React.HTMLAttributes; -Empty.Actions = function EmptyAction({ className, children, ...props }: EmptyActionProps) { +Empty.Actions = function EmptyActions({ className, children, ...props }: EmptyActionsProps) { return (
{children} From 79cf10a8a9b7f7dd1a44f5be08e7d170f88afc3e Mon Sep 17 00:00:00 2001 From: Michael Silva Date: Thu, 9 Jan 2025 13:15:47 -0500 Subject: [PATCH 16/31] remove children from icon --- .../apis/[apiId]/keys/[keyAuthId]/[keyId]/page.tsx | 4 +--- apps/dashboard/app/(app)/apis/[apiId]/page.tsx | 8 ++------ apps/dashboard/app/(app)/apis/client.tsx | 4 +--- apps/dashboard/app/(app)/audit/page.tsx | 4 +--- .../app/(app)/authorization/permissions/page.tsx | 4 +--- .../dashboard/app/(app)/authorization/roles/page.tsx | 4 +--- apps/dashboard/app/(app)/layout.tsx | 4 +--- .../app/(app)/ratelimits/[namespaceId]/logs/page.tsx | 8 ++------ .../ratelimits/[namespaceId]/overrides/page.tsx | 4 +--- .../app/(app)/ratelimits/[namespaceId]/page.tsx | 4 +--- apps/dashboard/app/(app)/ratelimits/page.tsx | 4 +--- apps/dashboard/app/(app)/settings/vercel/client.tsx | 12 +----------- apps/dashboard/components/opt-in.tsx | 4 +--- apps/engineering/content/design/components/empty.mdx | 4 +--- internal/ui/src/components/empty.tsx | 2 +- 15 files changed, 17 insertions(+), 57 deletions(-) diff --git a/apps/dashboard/app/(app)/apis/[apiId]/keys/[keyAuthId]/[keyId]/page.tsx b/apps/dashboard/app/(app)/apis/[apiId]/keys/[keyAuthId]/[keyId]/page.tsx index 0db590666c..577514a7dc 100644 --- a/apps/dashboard/app/(app)/apis/[apiId]/keys/[keyAuthId]/[keyId]/page.tsx +++ b/apps/dashboard/app/(app)/apis/[apiId]/keys/[keyAuthId]/[keyId]/page.tsx @@ -353,9 +353,7 @@ export default async function APIKeyDetailPage(props: { ) : ( - - - + Not used This key was not used in the last {interval} diff --git a/apps/dashboard/app/(app)/apis/[apiId]/page.tsx b/apps/dashboard/app/(app)/apis/[apiId]/page.tsx index 6a14703218..54e1a67276 100644 --- a/apps/dashboard/app/(app)/apis/[apiId]/page.tsx +++ b/apps/dashboard/app/(app)/apis/[apiId]/page.tsx @@ -247,9 +247,7 @@ export default async function ApiPage(props: { ) : ( - - - + No usage Verify a key or change the range @@ -289,9 +287,7 @@ export default async function ApiPage(props: { ) : ( - - - + No usage Verify a key or change the range diff --git a/apps/dashboard/app/(app)/apis/client.tsx b/apps/dashboard/app/(app)/apis/client.tsx index 52993bb497..773a6bb396 100644 --- a/apps/dashboard/app/(app)/apis/client.tsx +++ b/apps/dashboard/app/(app)/apis/client.tsx @@ -77,9 +77,7 @@ export function ApiList({ apis }: { apis: ApiWithKeys }) { ) : ( - - - + No APIs found You haven't created any APIs yet. Create one to get started. diff --git a/apps/dashboard/app/(app)/audit/page.tsx b/apps/dashboard/app/(app)/audit/page.tsx index 4e2e9ca28f..c6e077ec2f 100644 --- a/apps/dashboard/app/(app)/audit/page.tsx +++ b/apps/dashboard/app/(app)/audit/page.tsx @@ -39,9 +39,7 @@ export default async function AuditPage(props: Props) { ) : ( - - - + No logs There are no audit logs available yet. Create a key or another resource and come back diff --git a/apps/dashboard/app/(app)/authorization/permissions/page.tsx b/apps/dashboard/app/(app)/authorization/permissions/page.tsx index 189f14e5e3..6c02220216 100644 --- a/apps/dashboard/app/(app)/authorization/permissions/page.tsx +++ b/apps/dashboard/app/(app)/authorization/permissions/page.tsx @@ -81,9 +81,7 @@ export default async function RolesPage() {
{workspace.permissions.length === 0 ? ( - - - + No permissions found Create your first permission diff --git a/apps/dashboard/app/(app)/authorization/roles/page.tsx b/apps/dashboard/app/(app)/authorization/roles/page.tsx index 3f1f8d8e2a..814c56e905 100644 --- a/apps/dashboard/app/(app)/authorization/roles/page.tsx +++ b/apps/dashboard/app/(app)/authorization/roles/page.tsx @@ -84,9 +84,7 @@ export default async function RolesPage() {
{workspace.roles.length === 0 ? ( - - - + No roles found Create your first role diff --git a/apps/dashboard/app/(app)/layout.tsx b/apps/dashboard/app/(app)/layout.tsx index a151f5523f..49b454d3b7 100644 --- a/apps/dashboard/app/(app)/layout.tsx +++ b/apps/dashboard/app/(app)/layout.tsx @@ -51,9 +51,7 @@ export default async function Layout({ children }: LayoutProps) { ) : (
- - - + This workspace is disabled Contact{" "} diff --git a/apps/dashboard/app/(app)/ratelimits/[namespaceId]/logs/page.tsx b/apps/dashboard/app/(app)/ratelimits/[namespaceId]/logs/page.tsx index 82555a17cb..6ce4a5f365 100644 --- a/apps/dashboard/app/(app)/ratelimits/[namespaceId]/logs/page.tsx +++ b/apps/dashboard/app/(app)/ratelimits/[namespaceId]/logs/page.tsx @@ -103,9 +103,7 @@ export default async function AuditPage(props: Props) { - - - + } > @@ -157,9 +155,7 @@ const AuditLogTable: React.FC<{ if (logs.length === 0) { return ( - - - + No logs found {isFiltered ? (
diff --git a/apps/dashboard/app/(app)/ratelimits/[namespaceId]/overrides/page.tsx b/apps/dashboard/app/(app)/ratelimits/[namespaceId]/overrides/page.tsx index a086560dbb..d099887d37 100644 --- a/apps/dashboard/app/(app)/ratelimits/[namespaceId]/overrides/page.tsx +++ b/apps/dashboard/app/(app)/ratelimits/[namespaceId]/overrides/page.tsx @@ -98,9 +98,7 @@ export default async function OverridePage(props: Props) { {namespace.overrides.length === 0 ? ( - - - + No custom ratelimits found Create your first override below diff --git a/apps/dashboard/app/(app)/ratelimits/[namespaceId]/page.tsx b/apps/dashboard/app/(app)/ratelimits/[namespaceId]/page.tsx index 6aeb65491c..372995dce4 100644 --- a/apps/dashboard/app/(app)/ratelimits/[namespaceId]/page.tsx +++ b/apps/dashboard/app/(app)/ratelimits/[namespaceId]/page.tsx @@ -225,9 +225,7 @@ export default async function RatelimitNamespacePage(props: { ) : ( - - - + No usage Ratelimit something or change the range diff --git a/apps/dashboard/app/(app)/ratelimits/page.tsx b/apps/dashboard/app/(app)/ratelimits/page.tsx index 575f351130..3c95f25848 100644 --- a/apps/dashboard/app/(app)/ratelimits/page.tsx +++ b/apps/dashboard/app/(app)/ratelimits/page.tsx @@ -71,9 +71,7 @@ export default async function RatelimitOverviewPage() { ) : ( - - - + No Namespaces found You haven't created any Namespaces yet. Create one by performing a limit request diff --git a/apps/dashboard/app/(app)/settings/vercel/client.tsx b/apps/dashboard/app/(app)/settings/vercel/client.tsx index 13b9338478..e8321f0f23 100644 --- a/apps/dashboard/app/(app)/settings/vercel/client.tsx +++ b/apps/dashboard/app/(app)/settings/vercel/client.tsx @@ -65,17 +65,7 @@ export const Client: React.FC = ({ projects, integration, apis, rootKeys if (projects.length === 0) { return ( - - - - - + No connected projects found Connect a Vercel project now diff --git a/apps/dashboard/components/opt-in.tsx b/apps/dashboard/components/opt-in.tsx index 7bdba8693f..aa1534fddc 100644 --- a/apps/dashboard/components/opt-in.tsx +++ b/apps/dashboard/components/opt-in.tsx @@ -41,9 +41,7 @@ export const OptIn: React.FC = ({ title, description, feature }) => { }); return ( - - - + {title} {description} diff --git a/apps/engineering/content/design/components/empty.mdx b/apps/engineering/content/design/components/empty.mdx index f460eb7ce6..181a541e02 100644 --- a/apps/engineering/content/design/components/empty.mdx +++ b/apps/engineering/content/design/components/empty.mdx @@ -33,9 +33,7 @@ The `` offers the user an action to resolve the lack of data. Fo - - - + Example Title Text Example of Description Text. diff --git a/internal/ui/src/components/empty.tsx b/internal/ui/src/components/empty.tsx index 6a3999089c..a5cb6576fa 100644 --- a/internal/ui/src/components/empty.tsx +++ b/internal/ui/src/components/empty.tsx @@ -16,7 +16,7 @@ export function Empty({ className, children, ...props }: EmptyRootProps) { ); } -Empty.Icon = function EmptyIcon({ children }: { children: React.ReactNode }) { +Empty.Icon = function EmptyIcon() { return (
From c09cf6b3b99f900267c0b2c360530f4e83f29176 Mon Sep 17 00:00:00 2001 From: Michael Silva Date: Thu, 9 Jan 2025 13:16:09 -0500 Subject: [PATCH 17/31] fmt --- .../app/(app)/apis/[apiId]/keys/[keyAuthId]/[keyId]/page.tsx | 2 +- apps/dashboard/app/(app)/apis/[apiId]/page.tsx | 1 - apps/dashboard/app/(app)/apis/client.tsx | 2 +- apps/dashboard/app/(app)/audit/page.tsx | 2 +- apps/dashboard/app/(app)/authorization/permissions/page.tsx | 2 +- apps/dashboard/app/(app)/authorization/roles/page.tsx | 2 +- apps/dashboard/app/(app)/layout.tsx | 1 - .../dashboard/app/(app)/ratelimits/[namespaceId]/logs/page.tsx | 3 +-- .../app/(app)/ratelimits/[namespaceId]/overrides/page.tsx | 1 - apps/dashboard/app/(app)/ratelimits/[namespaceId]/page.tsx | 1 - apps/dashboard/app/(app)/ratelimits/page.tsx | 2 +- apps/dashboard/components/opt-in.tsx | 1 - 12 files changed, 7 insertions(+), 13 deletions(-) diff --git a/apps/dashboard/app/(app)/apis/[apiId]/keys/[keyAuthId]/[keyId]/page.tsx b/apps/dashboard/app/(app)/apis/[apiId]/keys/[keyAuthId]/[keyId]/page.tsx index 577514a7dc..de605b6ece 100644 --- a/apps/dashboard/app/(app)/apis/[apiId]/keys/[keyAuthId]/[keyId]/page.tsx +++ b/apps/dashboard/app/(app)/apis/[apiId]/keys/[keyAuthId]/[keyId]/page.tsx @@ -21,7 +21,7 @@ import { formatNumber } from "@/lib/fmt"; import { Nodes } from "@unkey/icons"; import { Empty } from "@unkey/ui"; import { Button } from "@unkey/ui"; -import { BarChart, Minus } from "lucide-react"; +import { Minus } from "lucide-react"; import ms from "ms"; import { notFound } from "next/navigation"; import PermissionTree from "./permission-list"; diff --git a/apps/dashboard/app/(app)/apis/[apiId]/page.tsx b/apps/dashboard/app/(app)/apis/[apiId]/page.tsx index 54e1a67276..9046442e74 100644 --- a/apps/dashboard/app/(app)/apis/[apiId]/page.tsx +++ b/apps/dashboard/app/(app)/apis/[apiId]/page.tsx @@ -14,7 +14,6 @@ import { db } from "@/lib/db"; import { formatNumber } from "@/lib/fmt"; import { Nodes } from "@unkey/icons"; import { Empty } from "@unkey/ui"; -import { BarChart } from "lucide-react"; import { redirect } from "next/navigation"; import { navigation } from "./constants"; import { type Interval, IntervalSelect } from "./select"; diff --git a/apps/dashboard/app/(app)/apis/client.tsx b/apps/dashboard/app/(app)/apis/client.tsx index 773a6bb396..f94040e455 100644 --- a/apps/dashboard/app/(app)/apis/client.tsx +++ b/apps/dashboard/app/(app)/apis/client.tsx @@ -4,7 +4,7 @@ import { PostHogIdentify } from "@/providers/PostHogProvider"; import { useUser } from "@clerk/nextjs"; import { Empty } from "@unkey/ui"; import { Button } from "@unkey/ui"; -import { BookOpen, Code, Search } from "lucide-react"; +import { BookOpen, Search } from "lucide-react"; import Link from "next/link"; import { useEffect, useState } from "react"; import { CreateApiButton } from "./create-api-button"; diff --git a/apps/dashboard/app/(app)/audit/page.tsx b/apps/dashboard/app/(app)/audit/page.tsx index c6e077ec2f..4a1e13c357 100644 --- a/apps/dashboard/app/(app)/audit/page.tsx +++ b/apps/dashboard/app/(app)/audit/page.tsx @@ -1,7 +1,7 @@ import { Navbar } from "@/components/navbar"; import { PageContent } from "@/components/page-content"; import { getTenantId } from "@/lib/auth"; -import { InputSearch, Ufo } from "@unkey/icons"; +import { InputSearch } from "@unkey/icons"; import { Empty } from "@unkey/ui"; import { type SearchParams, getWorkspace, parseFilterParams } from "./actions"; import { Filters } from "./components/filters"; diff --git a/apps/dashboard/app/(app)/authorization/permissions/page.tsx b/apps/dashboard/app/(app)/authorization/permissions/page.tsx index 6c02220216..8f8708bb96 100644 --- a/apps/dashboard/app/(app)/authorization/permissions/page.tsx +++ b/apps/dashboard/app/(app)/authorization/permissions/page.tsx @@ -8,7 +8,7 @@ import { permissions } from "@unkey/db/src/schema"; import { ShieldKey } from "@unkey/icons"; import { Empty } from "@unkey/ui"; import { Button } from "@unkey/ui"; -import { ChevronRight, Scan } from "lucide-react"; +import { ChevronRight } from "lucide-react"; import Link from "next/link"; import { redirect } from "next/navigation"; import { navigation } from "../constants"; diff --git a/apps/dashboard/app/(app)/authorization/roles/page.tsx b/apps/dashboard/app/(app)/authorization/roles/page.tsx index 814c56e905..2fcf1a6b5b 100644 --- a/apps/dashboard/app/(app)/authorization/roles/page.tsx +++ b/apps/dashboard/app/(app)/authorization/roles/page.tsx @@ -7,7 +7,7 @@ import { db } from "@/lib/db"; import { ShieldKey } from "@unkey/icons"; import { Empty } from "@unkey/ui"; import { Button } from "@unkey/ui"; -import { ChevronRight, Scan } from "lucide-react"; +import { ChevronRight } from "lucide-react"; import Link from "next/link"; import { redirect } from "next/navigation"; import { navigation } from "../constants"; diff --git a/apps/dashboard/app/(app)/layout.tsx b/apps/dashboard/app/(app)/layout.tsx index 49b454d3b7..649f74ac72 100644 --- a/apps/dashboard/app/(app)/layout.tsx +++ b/apps/dashboard/app/(app)/layout.tsx @@ -1,7 +1,6 @@ import { getTenantId } from "@/lib/auth"; import { db } from "@/lib/db"; import { Empty } from "@unkey/ui"; -import { ShieldBan } from "lucide-react"; import Link from "next/link"; import { redirect } from "next/navigation"; import { UsageBanner } from "./banner"; diff --git a/apps/dashboard/app/(app)/ratelimits/[namespaceId]/logs/page.tsx b/apps/dashboard/app/(app)/ratelimits/[namespaceId]/logs/page.tsx index 6ce4a5f365..240332e0bc 100644 --- a/apps/dashboard/app/(app)/ratelimits/[namespaceId]/logs/page.tsx +++ b/apps/dashboard/app/(app)/ratelimits/[namespaceId]/logs/page.tsx @@ -3,7 +3,6 @@ import { db } from "@/lib/db"; import { notFound } from "next/navigation"; import { CopyButton } from "@/components/dashboard/copy-button"; -import { Loading } from "@/components/dashboard/loading"; import { Navbar as SubMenu } from "@/components/dashboard/navbar"; import { Navbar } from "@/components/navbar"; import { PageContent } from "@/components/page-content"; @@ -20,7 +19,7 @@ import { import { clickhouse } from "@/lib/clickhouse"; import { Gauge } from "@unkey/icons"; import { Empty } from "@unkey/ui"; -import { Box, Check, X } from "lucide-react"; +import { Check, X } from "lucide-react"; import { parseAsArrayOf, parseAsBoolean, parseAsIsoDateTime, parseAsString } from "nuqs/server"; import { Suspense } from "react"; import { navigation } from "../constants"; diff --git a/apps/dashboard/app/(app)/ratelimits/[namespaceId]/overrides/page.tsx b/apps/dashboard/app/(app)/ratelimits/[namespaceId]/overrides/page.tsx index d099887d37..78f35d5486 100644 --- a/apps/dashboard/app/(app)/ratelimits/[namespaceId]/overrides/page.tsx +++ b/apps/dashboard/app/(app)/ratelimits/[namespaceId]/overrides/page.tsx @@ -8,7 +8,6 @@ import { getTenantId } from "@/lib/auth"; import { db } from "@/lib/db"; import { Gauge } from "@unkey/icons"; import { Empty } from "@unkey/ui"; -import { Scan } from "lucide-react"; import { notFound } from "next/navigation"; import { navigation } from "../constants"; import { CreateNewOverride } from "./create-new-override"; diff --git a/apps/dashboard/app/(app)/ratelimits/[namespaceId]/page.tsx b/apps/dashboard/app/(app)/ratelimits/[namespaceId]/page.tsx index 372995dce4..153c8ceefd 100644 --- a/apps/dashboard/app/(app)/ratelimits/[namespaceId]/page.tsx +++ b/apps/dashboard/app/(app)/ratelimits/[namespaceId]/page.tsx @@ -14,7 +14,6 @@ import { db, eq, schema, sql } from "@/lib/db"; import { formatNumber } from "@/lib/fmt"; import { Gauge } from "@unkey/icons"; import { Empty } from "@unkey/ui"; -import { BarChart } from "lucide-react"; import ms from "ms"; import { redirect } from "next/navigation"; import { parseAsArrayOf, parseAsString, parseAsStringEnum } from "nuqs/server"; diff --git a/apps/dashboard/app/(app)/ratelimits/page.tsx b/apps/dashboard/app/(app)/ratelimits/page.tsx index 3c95f25848..e648bdd8fb 100644 --- a/apps/dashboard/app/(app)/ratelimits/page.tsx +++ b/apps/dashboard/app/(app)/ratelimits/page.tsx @@ -8,7 +8,7 @@ import { getTenantId } from "@/lib/auth"; import { db } from "@/lib/db"; import { Gauge } from "@unkey/icons"; import { Button } from "@unkey/ui"; -import { BookOpen, Scan } from "lucide-react"; +import { BookOpen } from "lucide-react"; import Link from "next/link"; import { redirect } from "next/navigation"; import { Suspense } from "react"; diff --git a/apps/dashboard/components/opt-in.tsx b/apps/dashboard/components/opt-in.tsx index aa1534fddc..cd79064510 100644 --- a/apps/dashboard/components/opt-in.tsx +++ b/apps/dashboard/components/opt-in.tsx @@ -4,7 +4,6 @@ import { trpc } from "@/lib/trpc/client"; import type { Workspace } from "@unkey/db"; import { Button } from "@unkey/ui"; import { Empty } from "@unkey/ui"; -import { Power } from "lucide-react"; import Link from "next/link"; import { useRouter } from "next/navigation"; import type React from "react"; From a017ae3109b39681116b05deef7709f2850250c6 Mon Sep 17 00:00:00 2001 From: "autofix-ci[bot]" <114827586+autofix-ci[bot]@users.noreply.github.com> Date: Thu, 9 Jan 2025 18:20:43 +0000 Subject: [PATCH 18/31] [autofix.ci] apply automated fixes From 4061e16c03875f79549811c67a3b0d1bfbf410a0 Mon Sep 17 00:00:00 2001 From: "autofix-ci[bot]" <114827586+autofix-ci[bot]@users.noreply.github.com> Date: Thu, 9 Jan 2025 18:23:27 +0000 Subject: [PATCH 19/31] [autofix.ci] apply automated fixes (attempt 2/3) From e356e5df1e79d0ead4a4b35e089019eb78b5cbe7 Mon Sep 17 00:00:00 2001 From: "autofix-ci[bot]" <114827586+autofix-ci[bot]@users.noreply.github.com> Date: Thu, 9 Jan 2025 18:26:25 +0000 Subject: [PATCH 20/31] [autofix.ci] apply automated fixes (attempt 3/3) From 8d39f2606cc455c3c082d523318d8437d4ea3310 Mon Sep 17 00:00:00 2001 From: "autofix-ci[bot]" <114827586+autofix-ci[bot]@users.noreply.github.com> Date: Thu, 9 Jan 2025 19:00:25 +0000 Subject: [PATCH 21/31] [autofix.ci] apply automated fixes --- packages/api/package.json | 11 ++--------- packages/hono/package.json | 11 ++--------- packages/nextjs/package.json | 11 ++--------- packages/ratelimit/package.json | 12 ++---------- 4 files changed, 8 insertions(+), 37 deletions(-) diff --git a/packages/api/package.json b/packages/api/package.json index 3af102777e..b037aa9a66 100644 --- a/packages/api/package.json +++ b/packages/api/package.json @@ -9,19 +9,12 @@ "publishConfig": { "access": "public" }, - "keywords": [ - "unkey", - "client", - "api" - ], + "keywords": ["unkey", "client", "api"], "bugs": { "url": "https://github.com/unkeyed/unkey/issues" }, "homepage": "https://github.com/unkeyed/unkey#readme", - "files": [ - "./dist/**", - "README.md" - ], + "files": ["./dist/**", "README.md"], "author": "Andreas Thomas ", "scripts": { "generate": "openapi-typescript https://api.unkey.dev/openapi.json -o ./src/openapi.d.ts", diff --git a/packages/hono/package.json b/packages/hono/package.json index fcabc2fa00..e62a5e5eaf 100644 --- a/packages/hono/package.json +++ b/packages/hono/package.json @@ -8,19 +8,12 @@ "publishConfig": { "access": "public" }, - "keywords": [ - "unkey", - "client", - "api", - "hono" - ], + "keywords": ["unkey", "client", "api", "hono"], "bugs": { "url": "https://github.com/unkeyed/unkey/issues" }, "homepage": "https://github.com/unkeyed/unkey#readme", - "files": [ - "./dist/**" - ], + "files": ["./dist/**"], "author": "Andreas Thomas ", "scripts": { "build": "tsup", diff --git a/packages/nextjs/package.json b/packages/nextjs/package.json index 11bdf331b9..fee7bcc8a3 100644 --- a/packages/nextjs/package.json +++ b/packages/nextjs/package.json @@ -8,19 +8,12 @@ "publishConfig": { "access": "public" }, - "keywords": [ - "unkey", - "client", - "api" - ], + "keywords": ["unkey", "client", "api"], "bugs": { "url": "https://github.com/unkeyed/unkey/issues" }, "homepage": "https://github.com/unkeyed/unkey#readme", - "files": [ - "./dist/**", - "README.md" - ], + "files": ["./dist/**", "README.md"], "author": "Andreas Thomas ", "scripts": { "build": "tsup" diff --git a/packages/ratelimit/package.json b/packages/ratelimit/package.json index fb5c5e1006..d7086cec53 100644 --- a/packages/ratelimit/package.json +++ b/packages/ratelimit/package.json @@ -9,20 +9,12 @@ "publishConfig": { "access": "public" }, - "keywords": [ - "unkey", - "ratelimit", - "global", - "serverless" - ], + "keywords": ["unkey", "ratelimit", "global", "serverless"], "bugs": { "url": "https://github.com/unkeyed/unkey/issues" }, "homepage": "https://github.com/unkeyed/unkey#readme", - "files": [ - "./dist/**", - "README.md" - ], + "files": ["./dist/**", "README.md"], "author": "Andreas Thomas ", "scripts": { "build": "tsup" From 242bbd530e352e61746e7733b6450d421fcbcd49 Mon Sep 17 00:00:00 2001 From: Michael Silva Date: Thu, 9 Jan 2025 14:06:20 -0500 Subject: [PATCH 22/31] missed --- .../app/(app)/apis/[apiId]/keys/[keyAuthId]/keys.tsx | 4 +--- 1 file changed, 1 insertion(+), 3 deletions(-) diff --git a/apps/dashboard/app/(app)/apis/[apiId]/keys/[keyAuthId]/keys.tsx b/apps/dashboard/app/(app)/apis/[apiId]/keys/[keyAuthId]/keys.tsx index 96e6f3eb87..c509657e0e 100644 --- a/apps/dashboard/app/(app)/apis/[apiId]/keys/[keyAuthId]/keys.tsx +++ b/apps/dashboard/app/(app)/apis/[apiId]/keys/[keyAuthId]/keys.tsx @@ -60,9 +60,7 @@ export const Keys: React.FC = async ({ keyAuthId, apiId }) => {
{keys.length === 0 ? ( - - - + No keys found Create your first key From b5daf9715ea24e7c1c1b376890cd278d2e08d30f Mon Sep 17 00:00:00 2001 From: "autofix-ci[bot]" <114827586+autofix-ci[bot]@users.noreply.github.com> Date: Thu, 9 Jan 2025 19:09:06 +0000 Subject: [PATCH 23/31] [autofix.ci] apply automated fixes --- apps/dashboard/app/(app)/apis/[apiId]/keys/[keyAuthId]/keys.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/apps/dashboard/app/(app)/apis/[apiId]/keys/[keyAuthId]/keys.tsx b/apps/dashboard/app/(app)/apis/[apiId]/keys/[keyAuthId]/keys.tsx index c509657e0e..564b9b699e 100644 --- a/apps/dashboard/app/(app)/apis/[apiId]/keys/[keyAuthId]/keys.tsx +++ b/apps/dashboard/app/(app)/apis/[apiId]/keys/[keyAuthId]/keys.tsx @@ -4,7 +4,7 @@ import { Badge } from "@/components/ui/badge"; import { db } from "@/lib/db"; import { Empty } from "@unkey/ui"; import { Button } from "@unkey/ui"; -import { ChevronRight, Scan, User, VenetianMask } from "lucide-react"; +import { ChevronRight, User, VenetianMask } from "lucide-react"; import Link from "next/link"; type Props = { From 561b24e01c72ad350af6c6000dc60ac4cb10c691 Mon Sep 17 00:00:00 2001 From: Michael Silva Date: Thu, 9 Jan 2025 14:35:35 -0500 Subject: [PATCH 24/31] icon changes --- apps/dashboard/app/(app)/apis/[apiId]/keys/[keyAuthId]/keys.tsx | 2 +- apps/dashboard/app/(app)/apis/client.tsx | 2 +- apps/dashboard/app/(app)/settings/user/update-user-name.tsx | 2 +- apps/engineering/content/design/components/empty.mdx | 2 +- 4 files changed, 4 insertions(+), 4 deletions(-) diff --git a/apps/dashboard/app/(app)/apis/[apiId]/keys/[keyAuthId]/keys.tsx b/apps/dashboard/app/(app)/apis/[apiId]/keys/[keyAuthId]/keys.tsx index c509657e0e..564b9b699e 100644 --- a/apps/dashboard/app/(app)/apis/[apiId]/keys/[keyAuthId]/keys.tsx +++ b/apps/dashboard/app/(app)/apis/[apiId]/keys/[keyAuthId]/keys.tsx @@ -4,7 +4,7 @@ import { Badge } from "@/components/ui/badge"; import { db } from "@/lib/db"; import { Empty } from "@unkey/ui"; import { Button } from "@unkey/ui"; -import { ChevronRight, Scan, User, VenetianMask } from "lucide-react"; +import { ChevronRight, User, VenetianMask } from "lucide-react"; import Link from "next/link"; type Props = { diff --git a/apps/dashboard/app/(app)/apis/client.tsx b/apps/dashboard/app/(app)/apis/client.tsx index f94040e455..58a505f27d 100644 --- a/apps/dashboard/app/(app)/apis/client.tsx +++ b/apps/dashboard/app/(app)/apis/client.tsx @@ -76,7 +76,7 @@ export function ApiList({ apis }: { apis: ApiWithKeys }) { ))} ) : ( - + No APIs found diff --git a/apps/dashboard/app/(app)/settings/user/update-user-name.tsx b/apps/dashboard/app/(app)/settings/user/update-user-name.tsx index b68d335b94..6df360cd90 100644 --- a/apps/dashboard/app/(app)/settings/user/update-user-name.tsx +++ b/apps/dashboard/app/(app)/settings/user/update-user-name.tsx @@ -44,7 +44,7 @@ export const UpdateUserName: React.FC = () => { }); if (!user) { return ( - + ); diff --git a/apps/engineering/content/design/components/empty.mdx b/apps/engineering/content/design/components/empty.mdx index 181a541e02..edb896b670 100644 --- a/apps/engineering/content/design/components/empty.mdx +++ b/apps/engineering/content/design/components/empty.mdx @@ -14,7 +14,7 @@ The `` component should be used when data is missing, replacing the nor ## Empty.Icon -The `` can insert a styled icon inside the `` component. See the full example for details. +The `` is a default `` icon with styling. ## Empty.Title From 78a5c35462997159ce59589d23aa9cd1ed6febb2 Mon Sep 17 00:00:00 2001 From: Michael Silva Date: Thu, 9 Jan 2025 15:47:55 -0500 Subject: [PATCH 25/31] small change --- apps/engineering/content/design/components/empty.mdx | 7 ++++++- 1 file changed, 6 insertions(+), 1 deletion(-) diff --git a/apps/engineering/content/design/components/empty.mdx b/apps/engineering/content/design/components/empty.mdx index edb896b670..0cfb25cd69 100644 --- a/apps/engineering/content/design/components/empty.mdx +++ b/apps/engineering/content/design/components/empty.mdx @@ -6,28 +6,33 @@ import { RenderComponentWithSnippet } from "@/app/components/render" import { Row } from "@/app/components/row" import { BookBookmark, ShieldCheck } from "@unkey/icons"; import { Button } from "@unkey/ui"; -import { ArrowLeft, ArrowRight, Settings2, Trash } from "lucide-react"; + ## Overview The `` component should be used when data is missing, replacing the normal component. + ## Empty.Icon The `` is a default `` icon with styling. + ## Empty.Title The `` is used to display a title within the `` component. It can be utilized to emphasize text or provide a warning. + ## Empty.Description The `` explains why the `` component is displayed instead of data. + ## Empty.Action The `` offers the user an action to resolve the lack of data. For instance, if there are too many filters on a table, a button can be added to remove those filters. + ## Full Example From 86ce284f0c96215fd86e75cffb4301901f240378 Mon Sep 17 00:00:00 2001 From: Michael Silva Date: Fri, 10 Jan 2025 09:36:01 -0500 Subject: [PATCH 26/31] small changes --- .../app/(app)/ratelimits/[namespaceId]/logs/page.tsx | 2 ++ apps/engineering/content/design/components/empty.mdx | 4 ++-- internal/ui/src/components/empty.tsx | 3 ++- 3 files changed, 6 insertions(+), 3 deletions(-) diff --git a/apps/dashboard/app/(app)/ratelimits/[namespaceId]/logs/page.tsx b/apps/dashboard/app/(app)/ratelimits/[namespaceId]/logs/page.tsx index 240332e0bc..759fa18f9a 100644 --- a/apps/dashboard/app/(app)/ratelimits/[namespaceId]/logs/page.tsx +++ b/apps/dashboard/app/(app)/ratelimits/[namespaceId]/logs/page.tsx @@ -103,6 +103,8 @@ export default async function AuditPage(props: Props) { fallback={ + Loading + Loading logs. } > diff --git a/apps/engineering/content/design/components/empty.mdx b/apps/engineering/content/design/components/empty.mdx index 0cfb25cd69..c85aa5caeb 100644 --- a/apps/engineering/content/design/components/empty.mdx +++ b/apps/engineering/content/design/components/empty.mdx @@ -28,9 +28,9 @@ The `` is used to display a title within the `` componen The `` explains why the `` component is displayed instead of data. -## Empty.Action +## Empty.Actions -The `` offers the user an action to resolve the lack of data. For instance, if there are too many filters on a table, a button can be added to remove those filters. +The `` offers the user an action to resolve the lack of data. For instance, if there are too many filters on a table, a button can be added to remove those filters. ## Full Example diff --git a/internal/ui/src/components/empty.tsx b/internal/ui/src/components/empty.tsx index a5cb6576fa..1b0bcc3330 100644 --- a/internal/ui/src/components/empty.tsx +++ b/internal/ui/src/components/empty.tsx @@ -1,4 +1,5 @@ -import type React from "react"; +// biome-ignore lint: React in this context is used throughout, so biome will change to types because no APIs are used even though React is needed. +import React from "react"; import { cn } from "../lib/utils"; interface EmptyRootProps extends React.HTMLAttributes {} From e165c5862ebcf25395f9f7b689e05f3b8f1a60e2 Mon Sep 17 00:00:00 2001 From: MichaelUnkey <148160799+MichaelUnkey@users.noreply.github.com> Date: Tue, 14 Jan 2025 09:30:44 -0500 Subject: [PATCH 27/31] Update apps/engineering/content/design/components/empty.mdx Co-authored-by: Andreas Thomas --- apps/engineering/content/design/components/empty.mdx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/apps/engineering/content/design/components/empty.mdx b/apps/engineering/content/design/components/empty.mdx index c85aa5caeb..5576f13eaa 100644 --- a/apps/engineering/content/design/components/empty.mdx +++ b/apps/engineering/content/design/components/empty.mdx @@ -30,7 +30,7 @@ The `` explains why the `` component is displayed ## Empty.Actions -The `` offers the user an action to resolve the lack of data. For instance, if there are too many filters on a table, a button can be added to remove those filters. +The `` offers the user one or multiple actions to resolve the lack of data. For instance, if there are too many filters on a table, a button can be added to remove those filters. ## Full Example From 53129705f61f69cf3a60343327f252757d015a96 Mon Sep 17 00:00:00 2001 From: MichaelUnkey <148160799+MichaelUnkey@users.noreply.github.com> Date: Tue, 14 Jan 2025 09:31:07 -0500 Subject: [PATCH 28/31] Update apps/dashboard/app/(app)/ratelimits/[namespaceId]/logs/page.tsx Co-authored-by: Andreas Thomas --- apps/dashboard/app/(app)/ratelimits/[namespaceId]/logs/page.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/apps/dashboard/app/(app)/ratelimits/[namespaceId]/logs/page.tsx b/apps/dashboard/app/(app)/ratelimits/[namespaceId]/logs/page.tsx index 759fa18f9a..79192d1401 100644 --- a/apps/dashboard/app/(app)/ratelimits/[namespaceId]/logs/page.tsx +++ b/apps/dashboard/app/(app)/ratelimits/[namespaceId]/logs/page.tsx @@ -161,7 +161,7 @@ const AuditLogTable: React.FC<{ {isFiltered ? (
- No events matched these filters, try changing them.{" "} + No events matched these filters, try changing them.
) : ( From ff6cd4fb63b28ceb4cc980d73bc426d3429921aa Mon Sep 17 00:00:00 2001 From: Michael Silva Date: Tue, 14 Jan 2025 11:08:39 -0500 Subject: [PATCH 29/31] removed empty added loading --- .../app/(app)/ratelimits/[namespaceId]/logs/page.tsx | 11 ++--------- 1 file changed, 2 insertions(+), 9 deletions(-) diff --git a/apps/dashboard/app/(app)/ratelimits/[namespaceId]/logs/page.tsx b/apps/dashboard/app/(app)/ratelimits/[namespaceId]/logs/page.tsx index ce0e002286..9c61689841 100644 --- a/apps/dashboard/app/(app)/ratelimits/[namespaceId]/logs/page.tsx +++ b/apps/dashboard/app/(app)/ratelimits/[namespaceId]/logs/page.tsx @@ -22,6 +22,7 @@ import { Empty } from "@unkey/ui"; import { Check, X } from "lucide-react"; import { parseAsArrayOf, parseAsBoolean, parseAsIsoDateTime, parseAsString } from "nuqs/server"; import { Suspense } from "react"; +import Loading from "../../loading"; import { navigation } from "../constants"; import { Filters } from "./filter"; import { Menu } from "./menu"; @@ -99,15 +100,7 @@ export default async function AuditPage(props: Props) {
- - - Loading - Loading logs. - - } - > + }> Date: Tue, 14 Jan 2025 14:09:53 -0500 Subject: [PATCH 30/31] corrected loading import --- apps/dashboard/app/(app)/ratelimits/[namespaceId]/logs/page.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/apps/dashboard/app/(app)/ratelimits/[namespaceId]/logs/page.tsx b/apps/dashboard/app/(app)/ratelimits/[namespaceId]/logs/page.tsx index 9c61689841..9ca1c7f5df 100644 --- a/apps/dashboard/app/(app)/ratelimits/[namespaceId]/logs/page.tsx +++ b/apps/dashboard/app/(app)/ratelimits/[namespaceId]/logs/page.tsx @@ -3,6 +3,7 @@ import { db } from "@/lib/db"; import { notFound } from "next/navigation"; import { CopyButton } from "@/components/dashboard/copy-button"; +import { Loading } from "@/components/dashboard/loading"; import { Navbar as SubMenu } from "@/components/dashboard/navbar"; import { Navbar } from "@/components/navbar"; import { PageContent } from "@/components/page-content"; @@ -22,7 +23,6 @@ import { Empty } from "@unkey/ui"; import { Check, X } from "lucide-react"; import { parseAsArrayOf, parseAsBoolean, parseAsIsoDateTime, parseAsString } from "nuqs/server"; import { Suspense } from "react"; -import Loading from "../../loading"; import { navigation } from "../constants"; import { Filters } from "./filter"; import { Menu } from "./menu"; From 152f95c7d2434c663000cc35dbd2539806cceb55 Mon Sep 17 00:00:00 2001 From: Michael Silva Date: Tue, 14 Jan 2025 14:16:42 -0500 Subject: [PATCH 31/31] centered loading --- .../app/(app)/ratelimits/[namespaceId]/logs/page.tsx | 8 +++++++- 1 file changed, 7 insertions(+), 1 deletion(-) diff --git a/apps/dashboard/app/(app)/ratelimits/[namespaceId]/logs/page.tsx b/apps/dashboard/app/(app)/ratelimits/[namespaceId]/logs/page.tsx index 9ca1c7f5df..16cca80152 100644 --- a/apps/dashboard/app/(app)/ratelimits/[namespaceId]/logs/page.tsx +++ b/apps/dashboard/app/(app)/ratelimits/[namespaceId]/logs/page.tsx @@ -100,7 +100,13 @@ export default async function AuditPage(props: Props) {
- }> + + +
+ } + >