feat: add unauthorized state

src/app/(authenticated)/(dashboard)/[publicId]/settings/company/page.tsx

@@ -1,4 +1,5 @@
 import { CompanyForm } from "@/components/onboarding/company-form";
+import { UnAuthorizedState } from "@/components/ui/un-authorized-state";
 import { serverAccessControl } from "@/lib/rbac/access-control";
 import { api } from "@/trpc/server";
 import type { Metadata } from "next";
@@ -15,7 +16,7 @@ const CompanySettingsPage = async () => {
   ]);
 
   if (!data?.company) {
-    return <div>un authenticated</div>;
+    return <UnAuthorizedState />;
   }
 
   return <CompanyForm data={data} type="edit" />;

src/components/common/empty-state.tsx

@@ -11,7 +11,7 @@
 
 import { cn } from "@/lib/utils";
 
-type EmptyStateProps = {
+export type EmptyStateProps = {
   title?: string;
   bordered?: boolean;
   subtitle: string | React.ReactNode;

src/components/ui/un-authorized-state.tsx

@@ -0,0 +1,14 @@
+import { RiProhibitedLine } from "@remixicon/react";
+import EmptyState, { type EmptyStateProps } from "../common/empty-state";
+
+export function UnAuthorizedState(props: Partial<EmptyStateProps>) {
+  return (
+    <EmptyState
+      bordered={false}
+      icon={<RiProhibitedLine />}
+      title="Un Authorized"
+      subtitle="you don't have access to view this content."
+      {...props}
+    />
+  );
+}