Update

apps/web/public/locales/en/app.json

@@ -241,10 +241,8 @@
   "verificationCodeSentTo": "We sent a verification code to <b>{email}</b>",
   "home": "Home",
   "groupPoll": "Group Poll",
-  "create": "Create",
   "upcoming": "Upcoming",
   "past": "Past",
-  "copyLink": "Copy Link",
   "upcomingEventsEmptyStateTitle": "No Upcoming Events",
   "upcomingEventsEmptyStateDescription": "When you schedule events, they will appear here.",
   "pastEventsEmptyStateTitle": "No Past Events",
@@ -281,5 +279,6 @@
   "subscribe": "Subscribe",
   "cancelAnytime": "Cancel anytime from your <a>billing page</a>.",
   "copiedToClipboard": "Copied to clipboard",
-  "viewAll": "View All"
+  "viewAll": "View All",
+  "pending": "Pending"
 }

apps/web/src/app/[locale]/(admin)/events/page.tsx

@@ -1,9 +1,12 @@
+import { CalendarIcon } from "lucide-react";
+
 import { UserScheduledEvents } from "@/app/[locale]/(admin)/events/user-scheduled-events";
 import { Params } from "@/app/[locale]/types";
 import {
   PageContainer,
   PageContent,
   PageHeader,
+  PageIcon,
   PageTitle,
 } from "@/app/components/page-layout";
 import { getTranslation } from "@/app/i18n";
@@ -13,13 +16,14 @@ export default async function Page({ params }: { params: Params }) {
   return (
     <PageContainer>
       <PageHeader>
-        <div className="flex items-center gap-x-3">
+        <PageIcon>
-          <PageTitle>
+          <CalendarIcon />
-            {t("events", {
+        </PageIcon>
-              defaultValue: "Events",
+        <PageTitle>
-            })}
+          {t("events", {
-          </PageTitle>
+            defaultValue: "Events",
-        </div>
+          })}
+        </PageTitle>
       </PageHeader>
       <PageContent>
         <UserScheduledEvents />

apps/web/src/app/[locale]/(admin)/page.tsx

@@ -7,6 +7,7 @@ import {
   PageContainer,
   PageContent,
   PageHeader,
+  PageIcon,
   PageTitle,
 } from "@/app/components/page-layout";
 import { getTranslation } from "@/app/i18n";
@@ -17,6 +18,9 @@ export default async function Page({ params }: { params: Params }) {
     <div>
       <PageContainer>
         <PageHeader>
+          <PageIcon>
+            <HomeIcon />
+          </PageIcon>
           <PageTitle>
             <Trans t={t} i18nKey="home" defaults="Home" />
           </PageTitle>
@@ -28,16 +32,3 @@ export default async function Page({ params }: { params: Params }) {
     </div>
   );
 }
-
-export async function generateMetadata({
-  params,
-}: {
-  params: { locale: string };
-}) {
-  const { t } = await getTranslation(params.locale);
-  return {
-    title: t("home", {
-      defaultValue: "Home",
-    }),
-  };
-}

apps/web/src/app/[locale]/(admin)/polls/page.tsx

@@ -21,16 +21,14 @@ export default async function Page({
   return (
     <PageContainer>
       <PageHeader>
-        <div className="flex items-center gap-x-3">
+        <PageIcon>
-          <PageIcon>
+          <BarChart2Icon />
-            <BarChart2Icon />
+        </PageIcon>
-          </PageIcon>
+        <PageTitle>
-          <PageTitle>
+          {t("polls", {
-            {t("polls", {
+            defaultValue: "Polls",
-              defaultValue: "Polls",
+          })}
-            })}
+        </PageTitle>
-          </PageTitle>
-        </div>
       </PageHeader>
       <PageContent>
         <UserPolls />

apps/web/src/app/[locale]/(admin)/polls/user-polls.tsx

@@ -68,8 +68,8 @@ function FilteredPolls({ status }: { status: PollStatus }) {
                   status={poll.status}
                   inviteLink={`${window.location.origin}/invite/${poll.id}`}
                   responseCount={poll.participants.length}
-                  dateStart={poll.createdAt}
+                  dateStart={poll.dateRange.start}
-                  dateEnd={poll.createdAt}
+                  dateEnd={poll.dateRange.end}
                 />
               ))}
             </div>

apps/web/src/app/[locale]/(admin)/sidebar.tsx

@@ -64,9 +64,9 @@ export function Sidebar() {
   const posthog = usePostHog();
   return (
     <nav className="flex flex-1 flex-col ">
-      <ul role="list" className="flex flex-1 flex-col gap-y-7">
+      <ul role="list" className="flex flex-1 flex-col gap-y-8">
         <li>
-          <ul role="list" className="-mx-2 space-y-1">
+          <ul role="list" className="-mx-2 space-y-2">
             <li>
               <NavItem current={pathname === "/"} href="/" icon={HomeIcon}>
                 <Trans i18nKey="home" defaults="Home" />

apps/web/src/app/components/page-layout.tsx

@@ -19,7 +19,7 @@ export function PageIcon({
   className?: string;
 }) {
   return (
-    <div className={cn("hidden", className)}>
+    <div className={cn("hidden rounded-md border bg-gray-50 p-2", className)}>
       <Slot className="size-4">{children}</Slot>
     </div>
   );
@@ -43,7 +43,9 @@ export function PageHeader({
   className?: string;
   variant?: "default" | "ghost";
 }) {
-  return <div className={cn(className)}>{children}</div>;
+  return (
+    <div className={cn("flex items-center gap-x-4", className)}>{children}</div>
+  );
 }
 
 export function PageSection({ children }: { children?: React.ReactNode }) {

apps/web/src/components/heading.tsx

@@ -24,14 +24,6 @@ export function Subheading({
   className,
 }: React.PropsWithChildren<{ className?: string }>) {
   return (
-    <h2
+    <h2 className={cn("text-base font-semibold", className)}>{children}</h2>
-      className={cn(
-        "text-base font-semibold text-gray-900",
-        heading.className,
-        className,
-      )}
-    >
-      {children}
-    </h2>
   );
 }

packages/ui/src/button.tsx

@@ -7,7 +7,7 @@ import { cn } from "./lib/utils";
 
 const buttonVariants = cva(
   cn(
-    "inline-flex border font-medium disabled:pointer-events-none select-none disabled:opacity-50 items-center justify-center whitespace-nowrap border",
+    "inline-flex border transition-colors font-medium disabled:pointer-events-none select-none disabled:opacity-50 items-center justify-center whitespace-nowrap border",
     "focus-visible:ring-offset-input-background",
     "focus:shadow-none",
   ),