Mariano/stuff by Marfuen · Pull Request #55 · trycompai/comp

Marfuen · 2025-02-17T20:32:20Z

Summary by CodeRabbit

New Features
- Enhanced control details, framework overviews, and compliance dashboards for improved data visibility.
- New page flows ensure organization categories are established before frameworks and policies, simplifying management.
- Expanded policy documents deliver clearer, more specific guidelines across multiple compliance areas.
- Improved navigation and interactivity streamline the overall user experience.
Style
- Refined, centered layouts across dashboards, integrations, and settings offer a more balanced visual presentation.

vercel · 2025-02-17T20:32:24Z

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated (UTC)
app	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Feb 17, 2025 8:34pm
web	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Feb 17, 2025 8:34pm

coderabbitai · 2025-02-17T20:32:29Z

Walkthrough

This pull request reorganizes the creation and retrieval processes for organization categories, frameworks, and controls. It introduces new functions and React hooks to fetch server data, refactors page components to utilize these hooks instead of pre-fetched props, and simplifies queries by including related controls directly. Several layout components have been updated for consistent centering, and updates to database schema and migrations add an OrganizationCategory table with associated foreign key constraints and indices. In addition, the PR refines type definitions in tables and expands JSON policy documents while deprecating outdated ones.

Changes

File(s)	Change Summary
`apps/app/src/actions/framework/select-frameworks-action.ts`	Introduced `createOrganizationCategories`; restructured flow to create categories first, then frameworks and policies; simplified framework category query by including controls.
`apps/app/src/app/[locale]/(app)/(dashboard)/home/components/FrameworksOverview.tsx`	Removed `isMutating` variable from the `useFrameworks` hook destructuring.
`apps/app/src/app/[locale]/(app)/(dashboard)/controls/[id]/Actions/getOrganizationControl.ts`, `.../Components/SingleControl.tsx`, `.../hooks/useOrganizationControl.tsx`, `.../controls/[id]/page.tsx`	Added a server-side action to retrieve organization control data; introduced `SingleControl` component and custom hook (`useOrganizationControl`); created a dedicated page for rendering single control details.
`apps/app/src/app/[locale]/(app)/(dashboard)/frameworks/[frameworkId]/Actions/getOrganizationCategories.ts`, `.../Actions/getOrganizationFramework.ts`, `.../Components/FrameworkControls.tsx`, `.../Components/FrameworkOverview.tsx`, `.../hooks/useOrganizationCategories.ts`, `.../hooks/useOrganizationFramework.ts`, `.../frameworks/[frameworkId]/page.tsx`	Added server actions, components, and hooks to fetch organization categories and framework data; refactored `FrameworkOverview` to use `frameworkId` prop and hooks for data fetching; removed legacy data fetching logic and metadata generation functions.
Multiple layout files in `apps/app/src/app/[locale]/(app)/(dashboard)/` (e.g., integrations, policies, risk, risk/register, settings)	Updated layout components by adding `mx-auto` to center content; included minor type signature adjustments in some components.
`apps/app/src/components/tables/frameworks/columns.tsx`, `apps/app/src/components/tables/frameworks/data-table.tsx`	Renamed `FrameworkControlType` to `OrganizationControlType`; updated type definitions and modified rendering (e.g., adding navigation links) in table cells.
Files in `packages/data/controls/` and `packages/data/policies/` (e.g., `soc2.json`, `access_control.json`, `business_continuity.json`, etc.)	Updated SOC 2 control descriptions and policy identifiers; introduced multiple new JSON policy documents; removed the deprecated `access.json` file.
Files in `packages/db/prisma/` (migrations, `schema.prisma`, `seed.ts`, `seedTypes.ts`)	Added a new `OrganizationCategory` table with associated columns and constraints; modified foreign keys and unique constraints; introduced a new non-nullable `frameworkId` column with a foreign key in `OrganizationCategory`; updated seed logic and type definitions for controls.

Sequence Diagram(s)

sequenceDiagram
    participant U as User
    participant SFA as selectFrameworksAction
    participant C as createOrganizationCategories
    participant F as Framework Creation
    participant P as Policies Creation

    U->>SFA: Initiate framework selection
    SFA->>C: Call createOrganizationCategories(user, frameworkIds)
    C-->>SFA: Categories created
    SFA->>F: Create frameworks (includes controls in query)
    F-->>SFA: Frameworks created
    SFA->>P: Create policies sequentially
    P-->>SFA: Policies created
    SFA-->>U: Operation complete

sequenceDiagram
    participant U as User
    participant SCP as SingleControlPage
    participant SC as SingleControl Component
    participant H as useOrganizationControl Hook
    participant GO as getOrganizationControl Action
    participant DB as Database

    U->>SCP: Navigate to control page (with controlId)
    SCP->>SC: Render SingleControl(controlId)
    SC->>H: Fetch control data via hook
    H->>GO: Call getOrganizationControl(controlId)
    GO->>DB: Query organization control data
    DB-->>GO: Return control data or error
    GO-->>H: Resolve with control data
    H-->>SC: Provide data, loading, error
    SC-->>U: Render control details or fallback

Possibly related PRs

add baseline migrations #48: Involves modifications to the Control table and new table relationships, with direct relevance to the schema and data handling changes in this PR.

Poem

I’m a bunny, hopping through code so bright,
Digging new paths in frameworks by day and night.
Categories bloom before controls take flight,
In a world of hooks and migrations, all shining light.
With each line and pull, my heart skips a beat 🐇💻,
Celebrating neat changes that make our code complete!
Hop on, dear friend — let’s code with delight!

✨ Finishing Touches

📝 Generate Docstrings (Beta)

🪧 Tips

Chat

There are 3 ways to chat with CodeRabbit:

Review comments: Directly reply to a review comment made by CodeRabbit. Example:
- I pushed a fix in commit <commit_id>, please review it.
- Generate unit testing code for this file.
- Open a follow-up GitHub issue for this discussion.
Files and specific lines of code (under the "Files changed" tab): Tag @coderabbitai in a new review comment at the desired location with your query. Examples:
- @coderabbitai generate unit testing code for this file.
- @coderabbitai modularize this function.
PR comments: Tag @coderabbitai in a new PR comment to ask questions about the PR branch. For the best results, please provide a very specific query, as very limited context is provided in this mode. Examples:
- @coderabbitai gather interesting stats about this repository and render them as a table. Additionally, render a pie chart showing the language distribution in the codebase.
- @coderabbitai read src/utils.ts and generate unit testing code.
- @coderabbitai read the files in the src/scheduler package and generate a class diagram using mermaid and a README in the markdown format.
- @coderabbitai help me debug CodeRabbit configuration file.

Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments.

CodeRabbit Commands (Invoked using PR comments)

@coderabbitai pause to pause the reviews on a PR.
@coderabbitai resume to resume the paused reviews.
@coderabbitai review to trigger an incremental review. This is useful when automatic reviews are disabled for the repository.
@coderabbitai full review to do a full review from scratch and review all the files again.
@coderabbitai summary to regenerate the summary of the PR.
@coderabbitai generate docstrings to generate docstrings for this PR. (Beta)
@coderabbitai resolve resolve all the CodeRabbit review comments.
@coderabbitai configuration to show the current CodeRabbit configuration for the repository.
@coderabbitai help to get help.

Other keywords and placeholders

Add @coderabbitai ignore anywhere in the PR description to prevent this PR from being reviewed.
Add @coderabbitai summary to generate the high-level summary at a specific location in the PR description.
Add @coderabbitai anywhere in the PR title to generate the title automatically.

CodeRabbit Configuration File (`.coderabbit.yaml`)

You can programmatically configure CodeRabbit by adding a .coderabbit.yaml file to the root of your repository.
Please see the configuration documentation for more information.
If your editor has YAML language server enabled, you can add the path at the top of this file to enable auto-completion and validation: # yaml-language-server: $schema=https://coderabbit.ai/integrations/schema.v2.json

Documentation and Community

Visit our Documentation for detailed information on how to use CodeRabbit.
Join our Discord Community to get help, request features, and share feedback.
Follow us on X/Twitter for updates and announcements.

coderabbitai

Actionable comments posted: 9

🧹 Nitpick comments (23)

packages/data/policies/privacy.json (1)

145-149: "References" Section Heading
A heading for "References" is provided though no reference items are currently listed. If additional documentation or links are available, consider including them in this section.

packages/data/policies/confidentiality.json (1)

251-303: Robust Access Control Measures
The ordered list here clearly describes the access control measures, emphasizing principles like least privilege and multi-factor authentication. As an enhancement, consider adding a note on periodic reviews of access control practices to keep them up to date.

apps/app/src/app/[locale]/(app)/(dashboard)/frameworks/[frameworkId]/page.tsx (1)

23-23: Redirect logic might benefit from a fallback or user message.
Redirecting to the homepage if frameworkId is missing prevents the user from understanding why they were redirected. Consider providing a friendly message or a dedicated error page to improve UX.
apps/app/src/app/[locale]/(app)/(dashboard)/frameworks/[frameworkId]/Components/FrameworkOverview.tsx (2)
25-25: Avoid console logs in production code.
Leaving development logs in shipped code can clutter console output. Consider removing or using a logging utility with log levels.
-  console.log({ data });
48-48: Double chaining on framework?.framework may obscure readability.
If the double nesting is intentional, it's fine. Otherwise, consider flattening the data structure or clarifying naming for clarity.
apps/app/src/app/[locale]/(app)/(dashboard)/frameworks/[frameworkId]/hooks/useOrganizationFramework.ts (2)
14-21: Improve error messages for better debugging.

The error messages could be more specific to help with debugging.

Apply this diff to improve error messages:
-    throw new Error("Failed to fetch frameworks");
+    throw new Error(`Failed to fetch framework with ID: ${frameworkId}`);
   }

   const data = result.data?.data;
   if (!data) {
-    throw new Error("Invalid response from server");
+    throw new Error(`Server response missing data for framework ID: ${frameworkId}`);
   }
4-7: Use import type for type imports.

The FrameworkWithControls import is only used as a type and should be marked with import type.

Apply this diff to fix the imports:
 import useSWR from "swr";
-import {
-  FrameworkWithControls,
+import type {
+  FrameworkWithControls,
+} from "../Actions/getOrganizationFramework";
+import {
   getOrganizationFramework,
 } from "../Actions/getOrganizationFramework";
🧰 Tools

🪛 Biome (1.9.4)

[error] 4-7: Some named imports are only used as types.

This import is only used as a type.

Importing the types with import type ensures that they are removed by the compilers and avoids loading unnecessary modules.
Safe fix: Add inline type keywords.

(lint/style/useImportType)
apps/app/src/app/[locale]/(app)/(dashboard)/controls/[id]/hooks/useOrganizationControl.tsx (2)
15-22: Improve error messages for better debugging.

The error messages could be more specific to help with debugging.

Apply this diff to improve error messages:
-    throw new Error("Failed to fetch control");
+    throw new Error(`Failed to fetch control with ID: ${controlId}`);
   }

   const data = result.data?.data;
   if (!data) {
-    throw new Error("Invalid response from server");
+    throw new Error(`Server response missing data for control ID: ${controlId}`);
   }
3-8: Use import type for type imports.

The OrganizationControl and OrganizationControlResponse imports are only used as types and should be marked with import type.

Apply this diff to fix the imports:
-import { OrganizationControl } from "@bubba/db";
+import type { OrganizationControl } from "@bubba/db";
 import useSWR from "swr";
-import {
-  getOrganizationControl,
-  OrganizationControlResponse,
+import type {
+  OrganizationControlResponse,
+} from "../Actions/getOrganizationControl";
+import {
+  getOrganizationControl,
 } from "../Actions/getOrganizationControl";
🧰 Tools

🪛 Biome (1.9.4)

[error] 5-8: Some named imports are only used as types.

This import is only used as a type.

Importing the types with import type ensures that they are removed by the compilers and avoids loading unnecessary modules.
Safe fix: Add inline type keywords.

(lint/style/useImportType)
apps/app/src/app/[locale]/(app)/(dashboard)/frameworks/[frameworkId]/hooks/useOrganizationCategories.ts (2)
14-14: Remove debug log statement.

The console.log statement should be removed before merging to production.
-  console.log({ result });
16-18: Update error message for clarity.

The error message mentions "frameworks" but the function fetches organization categories.
-    throw new Error("Failed to fetch frameworks");
+    throw new Error("Failed to fetch organization categories");
apps/app/src/components/tables/frameworks/columns.tsx (1)
32-40: Consider adding aria-label for accessibility.

The Link component should have an aria-label to improve accessibility for screen readers.
   <Link
     href={`/controls/${row.original.id}`}
     className="flex flex-col"
+    aria-label={`View details for control ${row.original.name}`}
   >
apps/app/src/app/[locale]/(app)/(dashboard)/frameworks/[frameworkId]/Components/FrameworkControls.tsx (1)
35-49: Enhance accessibility for the controls list.

The controls list should have proper ARIA attributes and semantic structure.
-        {organizationCategories.map((category) => (
+        {organizationCategories.map((category, index) => (
           <div key={category.id} className="mb-8">
-            <h3 className="text-lg font-semibold mb-4">{category.name}</h3>
+            <h3 
+              id={`category-${category.id}`}
+              className="text-lg font-semibold mb-4"
+            >
+              {category.name}
+            </h3>
             <DataTable
+              aria-labelledby={`category-${category.id}`}
               data={category.organizationControl.map((control) => ({
                 code: control.control.code,
                 description: control.control.description,
apps/app/src/app/[locale]/(app)/(dashboard)/frameworks/[frameworkId]/Actions/getOrganizationFramework.ts (1)
64-69: Enhance error logging and error messages.

The error handling could be more specific to help with debugging and provide better user feedback.
     } catch (error) {
-      console.error("Error fetching framework:", error);
+      console.error("Error fetching framework:", {
+        error,
+        frameworkId,
+        organizationId: user.organizationId,
+      });
       return {
-        error: "Failed to fetch framework",
+        error: error instanceof Error 
+          ? `Failed to fetch framework: ${error.message}`
+          : "Failed to fetch framework",
       };
     }
apps/app/src/components/tables/frameworks/data-table.tsx (1)
18-25: Optimize table performance with memoization.

The table configuration and columns could be memoized to prevent unnecessary re-renders.
+import { useMemo } from "react";

 export function DataTable({ data }: DataTableProps) {
-  const columns = getColumns();
+  const columns = useMemo(() => getColumns(), []);
 
-  const table = useReactTable({
+  const table = useMemo(() => useReactTable({
     data: data,
     columns,
     getCoreRowModel: getCoreRowModel(),
-  });
+  }), [data, columns]);
apps/app/src/actions/framework/select-frameworks-action.ts (1)
37-41: Consider sequential framework creation for better error handling.

Using Promise.all for framework creation could mask errors if multiple frameworks fail. Consider sequential creation for better error tracking and debugging.
-     await Promise.all(
-       frameworkIds.map((frameworkId) =>
-         createOrganizationFramework(user as User, frameworkId)
-       )
-     );
+     for (const frameworkId of frameworkIds) {
+       await createOrganizationFramework(user as User, frameworkId);
+     }
packages/db/prisma/seed.ts (1)
17-33: Consider environment-based cleanup strategy.

Instead of commenting out cleanup code, consider making it configurable based on environment variables. This allows for flexible seeding strategies in different environments.
+const CLEAN_BEFORE_SEED = process.env.CLEAN_BEFORE_SEED === 'true';

async function main() {
-  // console.log("\n🗑️  Cleaning up existing data...");
-  // Delete in order of dependencies
-  // await prisma.organizationFramework.deleteMany();
+  if (CLEAN_BEFORE_SEED) {
+    console.log("\n🗑️  Cleaning up existing data...");
+    // Delete in order of dependencies
+    await prisma.organizationFramework.deleteMany();
    // ... rest of cleanup code
+    console.log("✅ Database cleaned");
+  }
packages/db/prisma/migrations/20250212204100_add_organization_category_table/migration.sql (1)

4-15: New Table Creation: OrganizationCategory
The new table is defined with essential columns and a primary key on id. Note that while createdAt has a default value, updatedAt does not—ensure that your application logic handles updates to this field appropriately. Also, review whether the absence of a NOT NULL constraint on description meets your business requirements.

packages/data/policies/workstation.json (1)

72-371: Comprehensive Content Organization in Policy Sections
The remaining sections—from the "Purpose and Scope" (starting around line 72) through to the detailed policy requirements for workstation devices, desktop & laptop devices, mobile devices, and removable media—are clearly organized using ordered lists and hierarchical headings. The content is comprehensive and adheres to a consistent format. As a future enhancement, consider including versioning or last-update metadata directly in the document to support change tracking.

packages/data/policies/data_center.json (1)

74-358: Detailed Policy Content and Sectioning
The document continues with clearly delineated sections covering "Purpose and Scope", "Datacenter Security Requirements", "Environmental Controls", "Datacenter Access and Auditing", and "Disaster Recovery and Business Continuity". Each ordered list effectively summarizes the requirements. For future iterations, you might consider adding a revision history or version field in the metadata to help with tracking updates.
apps/app/src/app/[locale]/(app)/(dashboard)/controls/[id]/Actions/getOrganizationControl.ts (3)
3-3: Use import type for type-only imports.

Since OrganizationControl and Control are only used as types, they should be imported using the import type syntax to ensure proper tree-shaking.

Apply this diff to optimize the imports:
-import { db, OrganizationControl, Control } from "@bubba/db";
+import { db } from "@bubba/db";
+import type { OrganizationControl, Control } from "@bubba/db";
🧰 Tools

🪛 Biome (1.9.4)

[error] 3-3: Some named imports are only used as types.

This import is only used as a type.

This import is only used as a type.

Importing the types with import type ensures that they are removed by the compilers and avoids loading unnecessary modules.
Safe fix: Add inline type keywords.

(lint/style/useImportType)

26-30: Enhance the error message for better clarity.

The current error message could be more specific about why the authorization failed.

Apply this diff to improve the error message:
-        error: "Not authorized - no organization found",
+        error: "User is not associated with any organization. Please ensure you are part of an organization to access controls.",
54-59: Enhance error handling with more specific error messages.

While the error handling catches and logs errors, it returns a generic message. Consider categorizing errors and providing more specific messages to help with debugging and user experience.

Apply this diff to improve error handling:
     } catch (error) {
       console.error("Error fetching organization control:", error);
+      if (error instanceof Error) {
+        return {
+          error: `Database operation failed: ${error.message}`,
+        };
+      }
       return {
         error: "Failed to fetch organization control",
       };
     }

📜 Review details

Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between ec480f5 and 09b3d2c.

📒 Files selected for processing (53)

apps/app/src/actions/framework/select-frameworks-action.ts (3 hunks)
apps/app/src/app/[locale]/(app)/(dashboard)/(home)/components/FrameworksOverview.tsx (0 hunks)
apps/app/src/app/[locale]/(app)/(dashboard)/controls/[id]/Actions/getOrganizationControl.ts (1 hunks)
apps/app/src/app/[locale]/(app)/(dashboard)/controls/[id]/Components/SingleControl.tsx (1 hunks)
apps/app/src/app/[locale]/(app)/(dashboard)/controls/[id]/hooks/useOrganizationControl.tsx (1 hunks)
apps/app/src/app/[locale]/(app)/(dashboard)/controls/[id]/page.tsx (1 hunks)
apps/app/src/app/[locale]/(app)/(dashboard)/controls/page.tsx (1 hunks)
apps/app/src/app/[locale]/(app)/(dashboard)/frameworks/[frameworkId]/Actions/getOrganizationCategories.ts (1 hunks)
apps/app/src/app/[locale]/(app)/(dashboard)/frameworks/[frameworkId]/Actions/getOrganizationFramework.ts (1 hunks)
apps/app/src/app/[locale]/(app)/(dashboard)/frameworks/[frameworkId]/Components/FrameworkControls.tsx (1 hunks)
apps/app/src/app/[locale]/(app)/(dashboard)/frameworks/[frameworkId]/Components/FrameworkOverview.tsx (3 hunks)
apps/app/src/app/[locale]/(app)/(dashboard)/frameworks/[frameworkId]/hooks/useOrganizationCategories.ts (1 hunks)
apps/app/src/app/[locale]/(app)/(dashboard)/frameworks/[frameworkId]/hooks/useOrganizationFramework.ts (1 hunks)
apps/app/src/app/[locale]/(app)/(dashboard)/frameworks/[frameworkId]/layout.tsx (1 hunks)
apps/app/src/app/[locale]/(app)/(dashboard)/frameworks/[frameworkId]/page.tsx (2 hunks)
apps/app/src/app/[locale]/(app)/(dashboard)/integrations/page.tsx (1 hunks)
apps/app/src/app/[locale]/(app)/(dashboard)/policies/(overview)/layout.tsx (1 hunks)
apps/app/src/app/[locale]/(app)/(dashboard)/risk/(overview)/layout.tsx (1 hunks)
apps/app/src/app/[locale]/(app)/(dashboard)/risk/[riskId]/layout.tsx (2 hunks)
apps/app/src/app/[locale]/(app)/(dashboard)/risk/register/layout.tsx (1 hunks)
apps/app/src/app/[locale]/(app)/(dashboard)/settings/layout.tsx (1 hunks)
apps/app/src/components/frameworks/framework-controls.tsx (0 hunks)
apps/app/src/components/tables/frameworks/columns.tsx (2 hunks)
apps/app/src/components/tables/frameworks/data-table.tsx (2 hunks)
packages/data/controls/soc2.json (43 hunks)
packages/data/policies/access.json (0 hunks)
packages/data/policies/access_control.json (1 hunks)
packages/data/policies/business_continuity.json (1 hunks)
packages/data/policies/change_management.json (1 hunks)
packages/data/policies/code_of_conduct.json (1 hunks)
packages/data/policies/confidentiality.json (1 hunks)
packages/data/policies/corporate_governance.json (1 hunks)
packages/data/policies/cyber_risk.json (1 hunks)
packages/data/policies/data_center.json (1 hunks)
packages/data/policies/data_classification.json (1 hunks)
packages/data/policies/disaster_recovery.json (1 hunks)
packages/data/policies/human_resources.json (1 hunks)
packages/data/policies/incident_response.json (1 hunks)
packages/data/policies/information_security.json (1 hunks)
packages/data/policies/privacy.json (1 hunks)
packages/data/policies/risk_assessment.json (1 hunks)
packages/data/policies/risk_management.json (1 hunks)
packages/data/policies/software_development.json (1 hunks)
packages/data/policies/thirdparty.json (1 hunks)
packages/data/policies/vendor_risk_management.json (1 hunks)
packages/data/policies/workstation.json (1 hunks)
packages/db/prisma/migrations/20250212204100_add_organization_category_table/migration.sql (1 hunks)
packages/db/prisma/migrations/20250212205810_fix_unique_constraint/migration.sql (1 hunks)
packages/db/prisma/migrations/20250212210730_add_framework_id_to_org_cat/migration.sql (1 hunks)
packages/db/prisma/migrations/migration_lock.toml (1 hunks)
packages/db/prisma/schema.prisma (4 hunks)
packages/db/prisma/seed.ts (2 hunks)
packages/db/prisma/seedTypes.ts (1 hunks)

💤 Files with no reviewable changes (3)

packages/data/policies/access.json
apps/app/src/components/frameworks/framework-controls.tsx
apps/app/src/app/[locale]/(app)/(dashboard)/(home)/components/FrameworksOverview.tsx

✅ Files skipped from review due to trivial changes (7)

packages/db/prisma/migrations/migration_lock.toml
apps/app/src/app/[locale]/(app)/(dashboard)/integrations/page.tsx
apps/app/src/app/[locale]/(app)/(dashboard)/policies/(overview)/layout.tsx
apps/app/src/app/[locale]/(app)/(dashboard)/risk/(overview)/layout.tsx
apps/app/src/app/[locale]/(app)/(dashboard)/frameworks/[frameworkId]/layout.tsx
apps/app/src/app/[locale]/(app)/(dashboard)/risk/[riskId]/layout.tsx
apps/app/src/app/[locale]/(app)/(dashboard)/risk/register/layout.tsx

🧰 Additional context used

🪛 Biome (1.9.4)

apps/app/src/app/[locale]/(app)/(dashboard)/frameworks/[frameworkId]/hooks/useOrganizationCategories.ts

[error] 4-7: Some named imports are only used as types.