feat: integrate feature permission for ai summary

Author: Filip

apps/backend/src/index.ts

@@ -6,6 +6,10 @@ import { appFactory } from "./app-factory";
 import { getAuth } from "./auth";
 import { linksApp } from "./links";
 import { customLogger } from "./logger";
+import {
+  type FeaturePermissionName,
+  featurePermissionsApp,
+} from "./permissions/permissions";
 import { tagsApp } from "./tags";
 
 const authApp = appFactory
@@ -69,6 +73,7 @@ const app = new Hono<{
   .route("/", authApp)
   .route("/", linksApp)
   .route("/", tagsApp)
+  .route("/", featurePermissionsApp)
   .get("/", (c) => {
     return c.text("Hello Hono!");
   })
@@ -81,4 +86,6 @@ const app = new Hono<{
   });
 
 export type AppType = typeof app;
+
 export default app;
+export type { FeaturePermissionName };

apps/backend/src/links.ts

@@ -3,6 +3,7 @@ import { zValidator } from "@hono/zod-validator";
 import { generateText } from "ai";
 import z from "zod";
 import { appFactory } from "./app-factory";
+import { canCreateAiSummary } from "./permissions/ai-summary-permissions";
 
 export const linksApp = appFactory
   .createApp()
@@ -131,6 +132,19 @@ export const linksApp = appFactory
         return c.json({ error: "Unauthorized" }, 401);
       }
 
+      if (
+        !canCreateAiSummary({
+          userId: user.id,
+          prisma: c.get("prisma"),
+          link: { userId: user.id },
+        })
+      ) {
+        return c.json(
+          { error: "You are not authorized to create an AI summary" },
+          401,
+        );
+      }
+
       const { id } = c.req.valid("param");
 
       const link = await c.get("prisma").link.findUnique({ where: { id } });
@@ -145,7 +159,7 @@ export const linksApp = appFactory
       });
 
       const { text } = await generateText({
-        model: groq("openai/gpt-oss-20b"),
+        model: groq("openai/gpt-oss-120b"),
         prompt: `
 Summarize the content at this URL: ${link.url}.
 

apps/backend/src/permissions/ai-summary-permissions.ts

@@ -1,6 +1,6 @@
 import { PrismaClient } from "../generated/prisma";
 
-const aiSummaryFeatureName = "ai_summary";
+export const aiSummaryFeatureName = "ai_summary";
 
 export async function canCreateAiSummary({
   userId,

apps/backend/src/permissions/permissions.ts

@@ -0,0 +1,25 @@
+import { appFactory } from "../app-factory";
+import { aiSummaryFeatureName } from "./ai-summary-permissions";
+
+export type FeaturePermissionName = typeof aiSummaryFeatureName;
+
+export const featurePermissionsApp = appFactory
+  .createApp()
+  .get("/feature-permissions", async (c) => {
+    const user = c.get("user");
+    if (!user) {
+      return c.json({ error: "Unauthorized" }, 401);
+    }
+
+    const permissions = await c.get("prisma").featurePermission.findMany({
+      where: {
+        users: {
+          some: {
+            id: user.id,
+          },
+        },
+      },
+    });
+
+    return c.json({ permissions });
+  });

apps/backend/src/protected.ts

@@ -0,0 +1,12 @@
+import { appFactory } from "./app-factory";
+
+export const protectedMiddleware = appFactory.createMiddleware(
+  async (c, next) => {
+    const user = c.get("user");
+    if (!user) {
+      return c.json({ error: "Unauthorized" }, 401);
+    }
+
+    return next();
+  },
+);

apps/web-app/app/components/ai-summary.tsx

@@ -13,11 +13,17 @@ export function GenerateAiSummaryButton({
   isPending,
   type,
   onPress,
+  enabled,
 }: {
   isPending: boolean;
   type: "button";
   onPress: () => void;
+  enabled: boolean;
 }) {
+  if (!enabled) {
+    return null;
+  }
+
   return (
     <Tooltip closeDelay={150} content="AI Summary">
       <Button

apps/web-app/app/components/link-card.tsx

@@ -18,6 +18,7 @@ interface LinkCardProps {
   aiSummary: {
     handler: () => void;
     isPending: boolean;
+    enabled: boolean;
   };
 }
 
@@ -37,6 +38,7 @@ export function LinkCard({ link, onEdit, onDelete, aiSummary }: LinkCardProps) {
             type="button"
             onPress={aiSummary.handler}
             isPending={aiSummary.isPending}
+            enabled={aiSummary.enabled}
           />
           <Tooltip closeDelay={150} content="Edit">
             <Button isIconOnly onPress={() => onEdit(link)}>

apps/web-app/app/data/feature-permissions.ts

@@ -0,0 +1,36 @@
+import type { FeaturePermissionName } from "@repo/backend";
+import { err, ok, type Result } from "@repo/type-safe-errors";
+import { apiClient } from "./api-client";
+import { createQuery } from "./cache";
+
+type FeaturePermission = {
+  id: string;
+  featureName: string;
+  createdAt: string;
+  updatedAt: string;
+};
+
+async function getAllFeaturePermissions(): Promise<
+  Result<FeaturePermission[], string>
+> {
+  const res = await apiClient["feature-permissions"].$get();
+  const data = await res.json();
+
+  if ("error" in data) return err(data.error);
+
+  return ok(data.permissions);
+}
+
+export const featurePermissionsQuery = createQuery({
+  cacheKey: "feature-permissions",
+  fetcher: getAllFeaturePermissions,
+});
+
+export function hasFeaturePermission(
+  featureName: FeaturePermissionName,
+  featurePermissions: FeaturePermission[],
+): boolean {
+  return featurePermissions.some(
+    (permission) => permission.featureName === featureName,
+  );
+}

apps/web-app/app/routes/links.tsx

@@ -6,33 +6,44 @@ import { AiSummaryModal } from "~/components/ai-summary";
 import { LinkCard } from "~/components/link-card";
 import { LinkTable } from "~/components/link-table";
 import { TagPicker } from "~/components/tag-picker";
+import {
+  featurePermissionsQuery,
+  hasFeaturePermission,
+} from "~/data/feature-permissions";
 import { linksQuery } from "~/data/links";
 import { tagsQuery } from "~/data/tags";
 import type { Link } from "~/data/types";
 import type { Route } from "./+types/links";
 import { useGenerateAiSummary } from "./ai-summary.$linkId";
 
 export async function clientLoader(_: Route.ClientLoaderArgs) {
-  const [links, tags] = await Promise.all([
+  const [links, tags, featurePermissions] = await Promise.all([
     linksQuery.getData(),
     tagsQuery.getData(),
+    featurePermissionsQuery.getData(),
   ]);
 
-  return { links, tags };
+  return { links, tags, featurePermissions };
 }
 
 export default function Links() {
-  const { links, tags } = useLoaderData<typeof clientLoader>();
+  const { links, tags, featurePermissions } =
+    useLoaderData<typeof clientLoader>();
   const navigate = useNavigate();
   const [viewMode, setViewMode] = useState<"grid" | "table">("grid");
   const [searchQuery, setSearchQuery] = useState("");
   const [selectedTagFilters, setSelectedTagFilters] = useState<string[]>([]);
   const aiSummary = useGenerateAiSummary();
 
-  if (!links.ok || !tags.ok) {
+  if (!links.ok || !tags.ok || !featurePermissions.ok) {
     throw new Error("Failed to load data, please try refreshing the page.");
   }
 
+  const canCreateAiSummary = hasFeaturePermission(
+    "ai_summary",
+    featurePermissions.value,
+  );
+
   const filteredLinks = links.value.filter((link) => {
     const matchesSearch =
       link.name.toLowerCase().includes(searchQuery.toLowerCase()) ||
@@ -86,6 +97,7 @@ export default function Links() {
               onEdit={handleEdit}
               onDelete={handleDelete}
               aiSummary={{
+                enabled: canCreateAiSummary,
                 isPending: aiSummary.isPending(link.id),
                 handler: () => aiSummary.submit(link),
               }}