refactor: streamline policy creation and editing components, enhance …#246
Conversation
…validation logic, and improve UI responsiveness
|
The latest updates on your projects. Learn more about Vercel for Git ↗︎
|
WalkthroughThis pull request makes a series of modifications across policy-related files. The changes include cosmetic formatting updates (e.g., switching from two-space to tab indentation), refactoring and simplification of component props and hooks, and minor UI adjustments such as renaming columns and updating button labels. New helper functions (like Changes
Sequence Diagram(s)Policy Update FlowsequenceDiagram
participant User
participant PolicyEditor
participant getPolicy
participant DB
participant UpdatePolicy
participant cleanContent
User->>PolicyEditor: Open Policy Editor Page
PolicyEditor->>getPolicy: Request policy detail (by ID)
getPolicy->>DB: Query policy (with session/org check)
DB-->>getPolicy: Return policy data
getPolicy-->>PolicyEditor: Send policyContent
PolicyEditor->>User: Render editor with policyContent
User->>PolicyEditor: Modify content and click Save
PolicyEditor->>UpdatePolicy: Submit updated content
UpdatePolicy->>cleanContent: Clean the content payload
cleanContent-->>UpdatePolicy: Return sanitized content
UpdatePolicy->>DB: Update policy record
DB-->>UpdatePolicy: Confirm update
UpdatePolicy-->>PolicyEditor: Return update success
DataTable Row NavigationsequenceDiagram
participant User
participant DataTable
participant getRowId
User->>DataTable: Click on a table row
DataTable->>getRowId: Retrieve row's unique ID
getRowId-->>DataTable: Return row ID
DataTable->>User: Navigate to policy details page using row ID
Possibly related PRs
Suggested labels
Poem
✨ Finishing Touches
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. 🪧 TipsChatThere are 3 ways to chat with CodeRabbit:
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)
Other keywords and placeholders
CodeRabbit Configuration File (
|
There was a problem hiding this comment.
Actionable comments posted: 2
🧹 Nitpick comments (5)
apps/app/src/components/editor/advanced-editor.tsx (2)
28-36: Well-Defined Props Interface
TheAdvancedEditorPropsinterface now lists the component’s configurable properties in a clear, consistent fashion. One suggestion is to explicitly type thecharsCountstate (declared later) for added type safety.
47-56: State Initialization and Unused State Warning
- The states for
saveStatus,initialLoadComplete, and UI toggles (e.g.,openNode,openLink,openAI) are well declared.- Unused State: The state variable
openColoris declared (line 54) but is not used anywhere in the component. If it is not planned for future use, consider removing it to reduce clutter.- Initialization Note: The
charsCountstate is declared without an initial value. If this state is meant to represent a numeric word count, initializing it as0(and typing it accordingly) could improve clarity and prevent potential issues when evaluating its truthiness.A suggested diff for
charsCountis as follows:- const [charsCount, setCharsCount] = useState(); + const [charsCount, setCharsCount] = useState<number>(0);apps/app/src/app/[locale]/(app)/(dashboard)/[orgId]/policies/all/[policyId]/editor/page.tsx (2)
20-22: Type assertion for policy content should be validatedThe type assertion
policy?.content as JSONContent[]bypasses TypeScript's type checking. Consider adding runtime validation before the assertion to ensure type safety.- return <PolicyDetails policyId={policyId} policyContent={policy?.content as JSONContent[]} />; + // Validate content structure before passing it + const policyContent = policy?.content && Array.isArray(policy.content) + ? policy.content as JSONContent[] + : undefined; + return <PolicyDetails policyId={policyId} policyContent={policyContent} />;
40-60: Well-implemented policy retrieval with cachingThe
getPolicyfunction is well structured with:
- Proper use of React's
cachefor performance optimization- Authentication and authorization checks
- Clear error handling with redirect for missing policies
- Clean separation of concerns
The redirect to root ("/") when a policy is not found is appropriate but consider providing a more descriptive error or notification to explain why the user was redirected.
if (!policy) { - return redirect("/"); + // Consider redirecting to a more specific path with error information + return redirect("/?error=policy-not-found"); }apps/app/src/app/[locale]/(app)/(dashboard)/[orgId]/policies/all/[policyId]/page.tsx (1)
42-62: Policy retrieval behavior differs from editor pageThis implementation of
getPolicyreturns null when a policy is not found, while the editor page implementation redirects to "/". Consider standardizing this behavior across both files for consistency, unless the different behavior is intentional.Could you confirm if the different handling of missing policies (redirect vs. returning null) between the editor and overview pages is intentional? If not, consider unifying the approach:
if (!policy) { - return null; + // Option 1: Match editor page behavior with redirect + return redirect("/?error=policy-not-found"); // OR // Option 2: Update editor page to return null instead of redirecting // and handle the null case in the component }
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (24)
apps/app/src/actions/policies/create-new-policy.ts(1 hunks)apps/app/src/app/[locale]/(app)/(dashboard)/[orgId]/employees/[employeeId]/layout.tsx(1 hunks)apps/app/src/app/[locale]/(app)/(dashboard)/[orgId]/policies/all/(overview)/components/policies-table-columns.tsx(3 hunks)apps/app/src/app/[locale]/(app)/(dashboard)/[orgId]/policies/all/(overview)/components/policies-table.tsx(2 hunks)apps/app/src/app/[locale]/(app)/(dashboard)/[orgId]/policies/all/(overview)/data/queries.ts(2 hunks)apps/app/src/app/[locale]/(app)/(dashboard)/[orgId]/policies/all/(overview)/data/validations.ts(1 hunks)apps/app/src/app/[locale]/(app)/(dashboard)/[orgId]/policies/all/(overview)/page.tsx(3 hunks)apps/app/src/app/[locale]/(app)/(dashboard)/[orgId]/policies/all/[policyId]/editor/actions/update-policy.ts(3 hunks)apps/app/src/app/[locale]/(app)/(dashboard)/[orgId]/policies/all/[policyId]/editor/components/PolicyDetails.tsx(1 hunks)apps/app/src/app/[locale]/(app)/(dashboard)/[orgId]/policies/all/[policyId]/editor/page.tsx(1 hunks)apps/app/src/app/[locale]/(app)/(dashboard)/[orgId]/policies/all/[policyId]/layout.tsx(1 hunks)apps/app/src/app/[locale]/(app)/(dashboard)/[orgId]/policies/all/[policyId]/page.tsx(1 hunks)apps/app/src/components/data-table/data-table-pagination.tsx(1 hunks)apps/app/src/components/data-table/data-table-sort-list.tsx(1 hunks)apps/app/src/components/data-table/data-table-toolbar.tsx(5 hunks)apps/app/src/components/data-table/data-table.tsx(4 hunks)apps/app/src/components/editor/advanced-editor.tsx(2 hunks)apps/app/src/components/editor/extensions.ts(1 hunks)apps/app/src/components/editor/policy-editor.tsx(1 hunks)apps/app/src/components/forms/policies/create-new-policy.tsx(1 hunks)apps/app/src/components/forms/policies/policy-overview.tsx(0 hunks)apps/app/src/components/policies/policy-overview.tsx(1 hunks)apps/app/src/lib/validations.ts(1 hunks)packages/ui/src/components/input.tsx(1 hunks)
💤 Files with no reviewable changes (1)
- apps/app/src/components/forms/policies/policy-overview.tsx
🧰 Additional context used
🧬 Code Definitions (7)
apps/app/src/app/[locale]/(app)/(dashboard)/[orgId]/policies/all/(overview)/components/policies-table.tsx (3)
apps/app/src/components/data-table/data-table-toolbar.tsx (1)
DataTableToolbar(22-84)apps/app/src/components/data-table/data-table-sort-list.tsx (1)
DataTableSortList(52-262)apps/app/src/components/data-table/data-table.tsx (1)
DataTable(23-126)
apps/app/src/app/[locale]/(app)/(dashboard)/[orgId]/policies/all/(overview)/data/validations.ts (1)
apps/app/src/lib/validations.ts (2)
searchParamsCache(12-25)GetPolicySchema(32-34)
apps/app/src/components/editor/advanced-editor.tsx (2)
apps/app/src/components/editor/slash-command.tsx (1)
suggestionItems(16-113)apps/app/src/components/editor/selectors/node-selector.tsx (1)
NodeSelector(93-133)
apps/app/src/actions/policies/create-new-policy.ts (1)
apps/app/src/lib/validations.ts (1)
createPolicySchema(27-30)
apps/app/src/app/[locale]/(app)/(dashboard)/[orgId]/policies/all/[policyId]/editor/components/PolicyDetails.tsx (3)
apps/app/src/app/[locale]/(app)/(dashboard)/[orgId]/policies/all/[policyId]/editor/actions/update-policy.ts (1)
updatePolicy(31-132)apps/app/src/app/[locale]/(app)/(dashboard)/[orgId]/policies/all/[policyId]/editor/page.tsx (1)
PolicyEditor(12-23)apps/app/src/components/editor/policy-editor.tsx (1)
PolicyEditor(13-51)
apps/app/src/components/policies/policy-overview.tsx (2)
apps/app/src/components/forms/policies/policy-overview.tsx (1)
UpdatePolicyOverview(48-287)apps/app/src/components/policies/sheets/policy-overview-sheet.tsx (1)
PolicyOverviewSheet(20-76)
apps/app/src/app/[locale]/(app)/(dashboard)/[orgId]/policies/all/[policyId]/page.tsx (1)
apps/app/src/components/policies/policy-overview.tsx (1)
PolicyOverview(17-119)
🔇 Additional comments (57)
apps/app/src/components/editor/advanced-editor.tsx (10)
1-13: Consistent Reformatting of Imports
The import block has been reformatted neatly, ensuring that imported components from "novel" (and others) are clearly aligned and easy to read. There’s no change in functionality, and the adjustments improve consistency.
38-46: Clear Props Destructuring in Component Declaration
The destructuring of props in theAdvancedEditorcomponent is formatted cleanly, with sensible defaults (e.g.,readOnly = false,placeholder = "Start writing...",saveDebounceMs = 500). This improves readability while preserving functionality.
58-60: Effect Hook Usage is Correct
TheuseEffecthook that setsinitialLoadCompletetotrueon component mount is concise and works as expected.
62-74: Debounced Save Handler Implementation
The implementation of thedebouncedSavefunction is solid. It correctly updates the save status, performs an asynchronous save with proper error handling, and leverages theuseDebouncedCallbackhook.
76-76: Guard Clause for Initial Content
The early return withif (!initialContent) return null;is a clear defensive check ensuring that the editor isn’t rendered without content. Confirm that this behavior aligns with your design requirements.
78-93: Editor Status Display is Clear
The JSX for displaying the save status and word count is structured well. The conditional rendering based oncharsCountis easy to follow, providing immediate visual feedback to the user.
94-121: Rich Editor Configuration and Update Logic
TheEditorContentis configured with multiple properties includinginitialContent,extensions, and a comprehensiveonUpdatecallback that:
- Retrieves the latest JSON content from the editor,
- Updates the character/word count using
editor.storage.characterCount.words(),- Calls the external
onUpdateprop if provided, and- Manages debounced saving based on the
initialLoadCompleteflag.Note: Although the same name
onUpdateis used both for the prop and the callback parameter, the closure ensures correctness. If there’s any risk of confusion in the future, consider renaming the internal callback variable.
123-147: Command Palette Implementation is Well-Formatted
The command palette section—rendering components likeEditorCommand,EditorCommandEmpty, andEditorCommandListalongside mapping over thesuggestionItems—is clearly structured. This refactored style supports maintainability and ensures the UI remains consistent.
148-160: Structured Menu and Selector Layout
The arrangement of the generative menu and various selectors (NodeSelector, LinkSelector, MathSelector, TextButtons) is clear and provides a logical grouping of related UI actions. The consistent use ofSeparatorcomponents further enhances readability.
167-168: Clean Component Export
The export of theAdvancedEditorcomponent with a default export is straightforward and adheres to common conventions.apps/app/src/app/[locale]/(app)/(dashboard)/[orgId]/employees/[employeeId]/layout.tsx (1)
11-16: Code cleanup: Removed unused variable extraction.The removal of the unused
uservariable extraction from the session object streamlines the component and removes unnecessary code, which aligns with the overall refactoring goal.apps/app/src/components/data-table/data-table-sort-list.tsx (1)
178-178: Improved responsive design for sort button icon.Adding the
md:block hiddenclasses to the ArrowDownUp icon ensures better space utilization on mobile devices by hiding the icon on smaller screens and only displaying it on medium-sized screens and larger.apps/app/src/components/forms/policies/create-new-policy.tsx (1)
111-122: Enhanced user interface clarity with more specific action label.Changing the button label from "save" to "create" better reflects the actual action being performed, improving the user experience by setting clear expectations for the button's function.
apps/app/src/components/editor/policy-editor.tsx (1)
22-24: Improved code readability with better formatting.The conditional expression for setting the content has been reformatted to span multiple lines, making it more readable while maintaining the same logic. This is a good practice for complex conditional expressions.
apps/app/src/app/[locale]/(app)/(dashboard)/[orgId]/policies/all/(overview)/components/policies-table.tsx (4)
11-11: New component integration adds policy creation capability.Adding the
CreatePolicySheetimport enhances the policies table with creation functionality, which aligns with the PR's objective to streamline policy management components.
41-41: Good addition of row identification function.Adding the
getRowIdprop ensures proper row identification for navigation, improving the user experience when interacting with policy items.
43-43: Sheet integration enhances toolbar functionality.The addition of
sheetandactionprops to theDataTableToolbarenables the "Create Policy" action button, providing a more intuitive user flow for policy creation.
47-47: Component inclusion completes the integration.Adding the
CreatePolicySheetcomponent to the render output completes the integration of the policy creation functionality within the policies table view.packages/ui/src/components/input.tsx (1)
11-18: UI enhancement with simplified styling.The styling changes to the Input component improve its visual consistency by:
- Simplifying the border styling
- Reducing the text size to
text-smfor better readability- Updating focus states to use
focus-visible:ring-muted-foregroundfor a more subtle effectThese changes align with modern UI practices and improve the overall user experience.
apps/app/src/app/[locale]/(app)/(dashboard)/[orgId]/policies/all/(overview)/page.tsx (1)
5-5: Code optimization with direct Suspense import.Replacing the full React import with a specific Suspense import enhances code efficiency. Directly using
Suspenseinstead ofReact.Suspensemakes the code more concise while maintaining the same functionality.Also applies to: 36-36, 55-55
apps/app/src/lib/validations.ts (2)
10-10: Import optimization by removing unused types.Removing the unused
DepartmentsandFrequencytypes from imports keeps the code clean and reduces potential confusion about which types are actually used in the module.
27-30:Details
❓ Verification inconclusive
Schema simplification improves policy creation flow.
The simplification of the
createPolicySchemato include only the essentialnameandstatusfields streamlines the policy creation process, which aligns with the PR objective of enhancing the policy management components.Can you verify if any downstream components relied on the removed fields (
frequencyanddepartment) that might need updates?
🏁 Script executed:
#!/bin/bash # Search for components that might have referenced the removed schema fields echo "Searching for references to removed policy schema fields..." rg -A 3 -B 3 "frequency|department" --type typescript --glob "**/policies/**/*.tsx"Length of output: 249
Below is a revised review comment with updated instructions for verifying downstream dependencies. Note that the initial search failed due to an unrecognized file type; please run the new command manually to confirm that no components reference the removed fields.
Policy Schema Simplification: Downstream Dependencies Check
The simplified
createPolicySchema(retaining onlynameandstatus) clearly streamlines policy creation. However, to ensure no downstream component still depends on the removedfrequencyanddepartmentfields, please verify manually by running the following search command:#!/bin/bash echo "Searching for references to removed policy schema fields in TypeScript files..." rg -g "**/policies/**/*.ts" -g "**/policies/**/*.tsx" -A 3 -B 3 "frequency|department"If the search returns no references, the change is safe to merge. Otherwise, please update any affected components accordingly.
apps/app/src/components/editor/extensions.ts (1)
189-213: Enhanced editor capabilities with additional extensionsThe changes appropriately uncomment several previously defined extensions to enhance the editor's functionality. These added extensions (starterKit, placeholder, horizontalRule, aiHighlight, twitter, mathematics, HighlightExtension, TextStyle, and CustomKeymap) provide valuable editing capabilities that align with improving the policy editing experience.
apps/app/src/app/[locale]/(app)/(dashboard)/[orgId]/policies/all/(overview)/data/validations.ts (1)
1-29: Well-structured search parameters validationThis new file adds a clean implementation for policy search parameters validation using
nuqs. The approach provides strong typing with zod and sensible defaults for pagination, sorting, filtering, and advanced filtering options. The exportedGetPolicySchematype ensures type safety when consuming these parameters elsewhere.apps/app/src/components/data-table/data-table.tsx (4)
17-21: LGTM: Row navigation capability added to DataTableAdding the optional
getRowIdproperty to the interface enables row-level navigation, which improves the user experience for policy management.
31-39: Clean implementation of row click navigationThe implementation correctly uses Next.js router hooks to enable navigation to detail views when rows are clicked, improving user experience.
75-75: Good UX improvement with cursor pointerAdding the cursor pointer style to table rows provides a clear visual indication that rows are clickable, enhancing user experience.
52-59: Responsive column display implementationThe conditional class application based on column index effectively handles responsive display, ensuring the first column is always visible while others show only on larger screens.
Also applies to: 86-92
apps/app/src/app/[locale]/(app)/(dashboard)/[orgId]/policies/all/(overview)/components/policies-table-columns.tsx (3)
15-15: Improved naming consistencyChanging from "Name" to "Policy Name" provides better context and clarity in the UI. The corresponding metadata updates maintain consistency.
Also applies to: 27-28
6-7: Enhanced status display with dedicated componentReplacing the simple text display with the
StatusPoliciescomponent improves visual representation of policy statuses, enhancing the UI.Also applies to: 40-40
48-66: Useful addition of Last Updated columnAdding the "Last Updated" column with formatted dates provides valuable information for users managing policies. The implementation follows the established pattern for column definitions.
apps/app/src/app/[locale]/(app)/(dashboard)/[orgId]/policies/all/[policyId]/layout.tsx (1)
9-33:Details
✅ Verification successful
Verify policy validation has been properly relocated
The Layout component has been simplified by removing session management, policy retrieval, and validation logic. While this creates a cleaner separation of concerns, please verify that these important validations (checking for valid organization ID and policy existence) have been properly implemented in the components that consume this layout.
According to the PR summary, this logic was moved to the editor page component, but it's essential to ensure proper validation occurs across all routes using this layout to maintain security and prevent unexpected behaviors.
🏁 Script executed:
#!/bin/bash # Check if validation logic exists in the editor page or other components echo "Searching for policy validation in editor page:" cat apps/app/src/app/\[locale\]/\(app\)/\(dashboard\)/\[orgId\]/policies/all/\[policyId\]/editor/page.tsx 2>/dev/null | grep -A 10 "getPolicy\|redirect\|!organizationId" || echo "Not found in editor page" echo -e "\nSearching for policy validation in other related files:" fd --type f --extension tsx --extension ts . apps/app/src/app/\[locale\]/\(app\)/\(dashboard\)/\[orgId\]/policies/all/\[policyId\] --exec grep -l "getPolicy\|redirect\|!organizationId" {} \;Length of output: 1988
Policy Validation Relocation Confirmed
The Layout component now strictly manages layout concerns while the validation logic has been successfully shifted to the Policy Editor and associated action handlers. For example, the
PolicyEditorcomponent and related action files now use thegetPolicyfunction to verify the session, confirm the existence of an organization, and redirect when a valid policy isn’t found. This separation of concerns appears intentional and appropriate.Please ensure that all routes relying on this layout consistently apply the same validation logic to maintain security across the application.
apps/app/src/components/data-table/data-table-pagination.tsx (2)
38-42: Great addition of item count display!Adding the total item count provides valuable context to users about the data they're viewing.
43-43: Good UX improvement with select-noneAdding the
select-noneclass prevents accidental text selection when users interact with the pagination controls, improving the overall user experience.apps/app/src/app/[locale]/(app)/(dashboard)/[orgId]/policies/all/(overview)/data/queries.ts (2)
5-5: Good module organization improvementChanging from an absolute to a relative import path improves module organization by keeping related files' imports localized, which can help with code maintainability.
32-36:Details
❓ Verification inconclusive
Nice enhancement to filtering capabilities
Adding the ability to filter policies by status is a valuable feature that improves the flexibility of the query system.
Please verify that the
input.statusproperty is properly initialized as an array in theGetPolicySchemavalidation to prevent potential runtime errors. Ifinput.statuscan be undefined or null, the length check could throw an error.
🏁 Script executed:
#!/bin/bash # Check the definition of GetPolicySchema to ensure status is properly initialized echo "Checking GetPolicySchema definition:" cat apps/app/src/app/\[locale\]/\(app\)/\(dashboard\)/\[orgId\]/policies/all/\(overview\)/data/validations.ts | grep -A 15 "GetPolicySchema"Length of output: 301
Action Required: Verify input.status Array Initialization
The enhancement for filtering policies by status is well executed. However, please double-check that theinput.statusproperty in theGetPolicySchemais reliably initialized as an array. The current schema definition in validations (i.e., the use ofReturnType<typeof searchParamsCache.parse>) does not explicitly guarantee a default empty array forstatus, which might lead to runtime errors when invoking.length.
File to Review:
apps/app/src/app/[locale]/(app)/(dashboard)/[orgId]/policies/all/(overview)/data/validations.ts
Ensure that the parsing or default values set insearchParamsCache.parsecorrectly initializestatusas an array (or provide an array fallback if undefined).Diff Context:
...(input.status.length > 0 && { status: { in: input.status, }, }),apps/app/src/actions/policies/create-new-policy.ts (1)
82-82: Good addition of revalidation pathAdding revalidation for the
policies/allpath ensures that the UI is properly updated after a new policy is created.apps/app/src/app/[locale]/(app)/(dashboard)/[orgId]/policies/all/[policyId]/editor/actions/update-policy.ts (4)
10-29: Well-structured helper function for content sanitizationThe
cleanContentfunction effectively prevents serialization issues by recursively removing function references from the content before processing. This is a good approach for handling complex JSON content with potential function properties.
75-76: Good implementation of content cleaningUsing the helper function here ensures that function references won't cause serialization errors during the database operation.
77-92: Properly updated conditional logicThe conditional logic has been correctly updated to reference the cleaned content throughout the function, ensuring consistent handling of the sanitized data.
109-109: Security enhancement by explicitly including organizationIdIncluding the
organizationIdin the where clause improves security by ensuring users can only update policies within their organization.apps/app/src/app/[locale]/(app)/(dashboard)/[orgId]/policies/all/[policyId]/editor/components/PolicyDetails.tsx (4)
6-10: Clean interface update with proper type definitionsThe interface has been properly updated to include the new
policyContentprop with appropriate typing. This clearly communicates the component's requirements to other developers.
12-19: Well-implemented content formatting logicThe formatting logic handles different content formats gracefully, providing good flexibility for various input types. The component now correctly accepts content directly instead of fetching it internally.
20-29: Simplified and more direct save functionalityThe
handleSavePolicyfunction has been streamlined to directly use the providedpolicyIdand content, improving code clarity and maintainability. The error handling is appropriately implemented with logging and re-throwing.
31-35: Cleaner component renderingThe rendering has been simplified to a more focused component structure that passes the relevant props to the
PolicyEditor. This makes the component more maintainable and easier to understand.apps/app/src/components/policies/policy-overview.tsx (5)
18-21: Improved type definition to handle nullable policyThe update to accept a nullable policy prop increases the component's flexibility and robustness, allowing it to handle cases where policy data might not be available yet.
29-56: Robust null handling with optional chainingThe implementation of optional chaining (
?.) throughout the component ensures it gracefully handles cases where policy might be null, preventing runtime errors.
39-44: Good fallback date handlingThe addition of a fallback date (
new Date()) ensures the component won't break ifupdatedAtis unexpectedly null or undefined.
70-80: Well-implemented conditional UI elementsThe conditional rendering of UI elements based on the policy's status is properly implemented with the optional chaining operator, making the code more robust.
107-116: Appropriate conditional renderingThe component correctly conditionally renders the
UpdatePolicyOverviewand related components only when policy data is available, preventing errors when policy is null.apps/app/src/components/data-table/data-table-toolbar.tsx (4)
18-20: Well-structured component props extensionThe
DataTableToolbarPropsinterface has been properly extended with optionalsheetandactionproperties, maintaining backward compatibility while adding new functionality.Also applies to: 24-26
31-32: Clean state management implementationThe use of
useQueryStatefor managing the sheet's open state allows for URL-based state persistence, which is beneficial for preserving UI state across page reloads and sharing links.
75-80: Good conditional button renderingThe implementation of the conditional action button is clean and only appears when the
sheetprop is provided, making the component more flexible and reusable across different contexts.
65-68: Improved button content structureThe button content has been restructured to include an icon that's properly responsive (hidden on mobile), improving the user experience across different device sizes.
apps/app/src/app/[locale]/(app)/(dashboard)/[orgId]/policies/all/[policyId]/editor/page.tsx (1)
5-10: Well-structured imports for enhanced functionalityThe addition of these imports supports the new authentication, database access, and navigation features. Good practice to group related imports together.
apps/app/src/app/[locale]/(app)/(dashboard)/[orgId]/policies/all/[policyId]/page.tsx (2)
16-23: Clean implementation of policy details renderingThe code correctly:
- Extracts parameters from the request
- Sets locale appropriately
- Fetches policy data
- Handles the null case with the nullish coalescing operator
The
PolicyOverviewcomponent is properly configured to handle null policies as seen in the relevant code snippet.
47-51: Good authorization checkThe function properly checks for an active organization ID from the session before attempting to query the database, enhancing security and preventing unnecessary database operations.
| className={cn( | ||
| getRowId | ||
| )} |
There was a problem hiding this comment.
Fix incomplete className definition
The cn() utility is being used incorrectly here. It's receiving only a function reference without any class strings.
className={cn(
- getRowId
+ // Add appropriate conditional classes here if needed
)}Committable suggestion skipped: line range outside the PR's diff.
| }, | ||
| }) | ||
| .action(async ({ parsedInput, ctx }) => { | ||
| const { title, description, frameworkIds, controlIds } = parsedInput; |
There was a problem hiding this comment.
💡 Verification agent
🧩 Analysis chain
Verify schema and usage alignment
There appears to be a potential mismatch between the fields being destructured (title, description, frameworkIds, controlIds) and what's defined in the createPolicySchema (which according to the provided snippet only includes name and status).
Please verify that the schema correctly validates all fields being used in this function to prevent potential runtime errors.
🏁 Script executed:
#!/bin/bash
# Check the complete definition of createPolicySchema
echo "Checking createPolicySchema definition:"
cat apps/app/src/lib/schema.ts | grep -A 20 "export const createPolicySchema"
# Look for any field mapping or transformation between schema and action
echo -e "\nChecking for any mapping between schema fields and action parameters:"
grep -r "createPolicySchema" --include="*.ts" --include="*.tsx" apps/app/src/ | grep -v "import"Length of output: 1169
🏁 Script executed:
#!/bin/bash
# Attempt to output the definition of createPolicySchema from the validations file.
echo "Checking createPolicySchema definition in apps/app/src/lib/validations.ts:"
grep -A 30 "export const createPolicySchema" apps/app/src/lib/validations.tsLength of output: 498
Action Required: Align Schema Definition with Input Fields
It has been verified that the createPolicySchema in apps/app/src/lib/validations.ts only defines the fields name and status, while the action in apps/app/src/actions/policies/create-new-policy.ts is destructuring title, description, frameworkIds, and controlIds from the parsed input. This discrepancy likely indicates either an omitted transformation step or a misalignment between the expected schema and the actual input used in the action. Please review and update the schema or the input handling accordingly.
- File:
apps/app/src/actions/policies/create-new-policy.ts
Issue: Destructured fields (title,description,frameworkIds,controlIds) do not match the schema fields (name,status).
…validation logic, and improve UI responsiveness
Summary by CodeRabbit
New Features
Style