fix: conflict

web/app/(pages)/tasks/page.tsx

@@ -1,5 +1,15 @@
 import { TaskRoute } from "@/components/routes/task/TaskRoute"
+import { currentUser } from "@clerk/nextjs/server"
+import { notFound } from "next/navigation"
+import { get } from "ronin"
+
+export default async function TaskPage() {
+	const user = await currentUser()
+	const flag = await get.featureFlag.with.name("TASK")
+
+	if (!user?.emailAddresses.some(email => flag?.emails.includes(email.emailAddress))) {
+		notFound()
+	}
 
-export default function TaskPage() {
 	return <TaskRoute />
 }

web/app/actions.ts

@@ -10,6 +10,19 @@ import { ZSAError } from "zsa"
 const MAX_FILE_SIZE = 1 * 1024 * 1024
 const ALLOWED_FILE_TYPES = ["image/jpeg", "image/png", "image/gif", "image/webp"]
 
+export const getFeatureFlag = authedProcedure
+	.input(
+		z.object({
+			name: z.string()
+		})
+	)
+	.handler(async ({ input }) => {
+		const { name } = input
+		const flag = await get.featureFlag.with.name(name)
+
+		return { flag }
+	})
+
 export const sendFeedback = authedProcedure
 	.input(
 		z.object({

web/components/custom/sidebar/partial/task-section.tsx

@@ -1,9 +1,11 @@
 import Link from "next/link"
 import { usePathname } from "next/navigation"
-import { useAccount } from "@/lib/providers/jazz-provider"
 import { cn } from "@/lib/utils"
 import { ListOfTasks } from "@/lib/schema/tasks"
 import { LaIcon } from "../../la-icon"
+import { useEffect, useState } from "react"
+import { useAuth, useUser } from "@clerk/nextjs"
+import { getFeatureFlag } from "@/app/actions"
 
 export const TaskSection: React.FC<{ pathname: string }> = ({ pathname }) => {
 	const me = { root: { tasks: [{ id: "1", title: "Test Task" }] } }
@@ -11,12 +13,52 @@ export const TaskSection: React.FC<{ pathname: string }> = ({ pathname }) => {
 	const taskCount = me?.root.tasks?.length || 0
 	const isActive = pathname === "/tasks"
 
+	const [isFetching, setIsFetching] = useState(false)
+	const [isFeatureActive, setIsFeatureActive] = useState(false)
+	const { isLoaded, isSignedIn } = useAuth()
+	const { user } = useUser()
+
+	useEffect(() => {
+		async function checkFeatureFlag() {
+			setIsFetching(true)
+
+			if (isLoaded && isSignedIn) {
+				const [data, err] = await getFeatureFlag({ name: "TASK" })
+
+				if (err) {
+					console.error(err)
+					setIsFetching(false)
+					return
+				}
+
+				if (user?.emailAddresses.some(email => data.flag?.emails.includes(email.emailAddress))) {
+					setIsFeatureActive(true)
+				}
+				setIsFetching(false)
+			}
+		}
+
+		checkFeatureFlag()
+	}, [isLoaded, isSignedIn, user])
+
+	if (!isLoaded || !isSignedIn) {
+		return <div className="py-2 text-center text-gray-500">Loading...</div>
+	}
+
 	if (!me) return null
 
+	if (!isFeatureActive) {
+		return null
+	}
+
 	return (
 		<div className="group/tasks flex flex-col gap-px py-2">
 			<TaskSectionHeader taskCount={taskCount} isActive={isActive} />
+			{isFetching ? (
+				<div className="py-2 text-center text-gray-500">Fetching tasks...</div>
+			) : (
 				<List tasks={me.root.tasks as ListOfTasks} />
+			)}
 		</div>
 	)
 }

web/components/custom/sidebar/sidebar.tsx

@@ -115,7 +115,6 @@ const SidebarContent: React.FC = React.memo(() => {
 	const pathname = usePathname()
 
 	return (
-		<>
 		<nav className="bg-background relative flex h-full w-full shrink-0 flex-col">
 			<div>
 				<LogoAndSearch />
@@ -124,14 +123,12 @@ const SidebarContent: React.FC = React.memo(() => {
 				<div className="h-2 shrink-0" />
 				{me._type === "Account" && <LinkSection pathname={pathname} />}
 				{me._type === "Account" && <TopicSection pathname={pathname} />}
-					{/* {me._type === "Account" && <TaskSection pathname={pathname} />} */}
+				{me._type === "Account" && <TaskSection pathname={pathname} />}
-					<TaskSection pathname={pathname} />
 				{me._type === "Account" && <PageSection pathname={pathname} />}
 			</div>
 
 			<ProfileSection />
 		</nav>
-		</>
 	)
 })
 

web/package.json

@@ -37,7 +37,7 @@
     "@radix-ui/react-toggle": "^1.1.0",
     "@radix-ui/react-toggle-group": "^1.1.0",
     "@radix-ui/react-tooltip": "^1.1.2",
-		"@sentry/nextjs": "^8.30.0",
+    "@sentry/nextjs": "^8.31.0",
     "@tanstack/react-virtual": "^3.10.8",
     "@tiptap/core": "^2.7.2",
     "@tiptap/extension-blockquote": "^2.7.2",
@@ -87,7 +87,7 @@
     "lucide-react": "^0.429.0",
     "next": "14.2.10",
     "next-themes": "^0.3.0",
-		"nuqs": "^1.19.1",
+    "nuqs": "^1.19.2",
     "query-string": "^9.1.0",
     "react": "^18.3.1",
     "react-day-picker": "^8.10.1",
@@ -106,11 +106,11 @@
     "zsa-react": "^0.2.3"
   },
   "devDependencies": {
-		"@ronin/learn-anything": "0.0.0-3452357373461",
+    "@ronin/learn-anything": "^0.0.0-3453250405724",
     "@testing-library/jest-dom": "^6.5.0",
     "@testing-library/react": "^16.0.1",
     "@types/jest": "^29.5.13",
-		"@types/node": "^22.5.5",
+    "@types/node": "^22.6.1",
     "@types/react": "^18.3.8",
     "@types/react-dom": "^18.3.0",
     "dotenv": "^16.4.5",
@@ -120,7 +120,7 @@
     "jest-environment-jsdom": "^29.7.0",
     "postcss": "^8.4.47",
     "prettier-plugin-tailwindcss": "^0.6.6",
-		"tailwindcss": "^3.4.12",
+    "tailwindcss": "^3.4.13",
     "ts-jest": "^29.2.5",
     "ts-node": "^10.9.2",
     "typescript": "^5.6.2"