Expanded document download capability #3453
Conversation
|
WalkthroughThis update renames the variable and prop Changes
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:
SupportNeed help? Create a ticket on our support page for assistance with any issues or questions. 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 (
|
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 1
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (5)
apps/backoffice-v2/src/common/constants.ts(1 hunks)apps/backoffice-v2/src/pages/Entity/components/Case/Case.Documents.Toolbar.tsx(6 hunks)apps/backoffice-v2/src/pages/Entity/components/Case/Case.Documents.tsx(4 hunks)apps/backoffice-v2/src/pages/Entity/components/Case/hooks/useDocuments/useDocumentsLogic.tsx(2 hunks)services/workflows-service/prisma/data-migrations(1 hunks)
🧰 Additional context used
📓 Path-based instructions (1)
`apps/backoffice-v2/**/*.{ts,tsx}`: Use functional components with TypeScript. I...
apps/backoffice-v2/**/*.{ts,tsx}: Use functional components with TypeScript.
Implement smart/dumb component pattern.
Place components in feature-based directories.
Use compound components for complex UIs.
Follow atomic design principles.
Use React Query for server state and API calls.
Use Context for shared state.
Implement state machines for complex flows.
Use local state for UI-only state.
Follow unidirectional data flow.
Use strict TypeScript configuration.
Define interfaces for all props.
Use discriminated unions for state.
Leverage type inference.
Use Radix UI for accessible components.
Implement proper ARIA attributes.
Follow consistent styling patterns.
Use composition over inheritance.
Keep components small and focused.
Use React Hook Form for forms.
Implement Zod for validation.
Handle form submission states.
Show validation feedback.
Use controlled inputs when needed.
Implement proper loading states for data fetching.
Handle error states gracefully.
Cache responses appropriately.
Type API responses.
Use error boundaries.
Implement fallback UI.
Handle async errors.
Show user-friendly error messages.
Log errors appropriately.
Use React.memo wisely.
Implement proper code splitting.
Use lazy loading for routes.
Optimize re-renders.
Profile performance regularly.
Write unit tests for components.
Use React Testing Library.
Mock external dependencies in tests.
Maintain good test coverage.
Follow feature-based organization.
Use index files for exports.
Keep related files together.
Use consistent naming.
Implement barrel exports.
Use Tailwind CSS for styling.
Follow utility-first approach for styling.
Use CSS variables for theming.
Keep styles maintainable.
Use CSS modules when needed.
Document complex logic.
Write clear component documentation.
Keep documentation up to date.
Use JSDoc when helpful.
Follow ESLint rules.
Use consistent formatting.
Write clear variable names.
Keep functions pure.
Use meaningful types.
Validate user input.
Implement proper authentication.
Handle sensitive data carefully.
Follow security best practices.
Use HTTPS for API calls.
Follow WCAG guidelines for accessibility.
Use semantic HTML.
Test with screen readers.
Ensure keyboard navigation.
Provide proper focus management.
📄 Source: CodeRabbit Inference Engine (.cursor/rules/backoffice-v2.mdc)
List of files the instruction was applied to:
apps/backoffice-v2/src/common/constants.tsapps/backoffice-v2/src/pages/Entity/components/Case/hooks/useDocuments/useDocumentsLogic.tsxapps/backoffice-v2/src/pages/Entity/components/Case/Case.Documents.Toolbar.tsxapps/backoffice-v2/src/pages/Entity/components/Case/Case.Documents.tsx
⏰ Context from checks skipped due to timeout of 90000ms (4)
- GitHub Check: Analyze (javascript)
- GitHub Check: build (ubuntu-latest)
- GitHub Check: test_linux
- GitHub Check: lint
🔇 Additional comments (11)
services/workflows-service/prisma/data-migrations (1)
1-1: Submodule pointer bumped – please confirm CI/CD & local environments pull the new commitThe file now references
493a22283db566fbcd5381e71c6709223950370b.
Ensure that:
- The referenced hash exists on the remote repository (no force-push loss).
- All CI jobs (
build,migrate,deploy) rungit submodule update --init --recursiveso the new migrations are actually present when the service starts.- Any pending Prisma migration files introduced in that submodule revision are applied in staging before merging.
If you have already verified these, feel free to ignore. Otherwise, a quick check prevents runtime schema drift.
apps/backoffice-v2/src/common/constants.ts (1)
4-4: LGTM! Valid MIME type addition.The
application/x-cfbMIME type for Compound File Binary format is correctly added to the download-only types list, appropriately positioned among Excel-related formats.apps/backoffice-v2/src/pages/Entity/components/Case/hooks/useDocuments/useDocumentsLogic.tsx (2)
61-61: Excellent semantic improvement!The renaming from
shouldDownloadtoisDocumentWithoutViewersignificantly improves code readability and clearly expresses the intent - identifying documents that cannot be viewed and must be downloaded.
82-82: Consistent return value naming.The returned value maintains consistency with the internal variable renaming.
apps/backoffice-v2/src/pages/Entity/components/Case/Case.Documents.tsx (3)
50-50: Good variable renaming for clarity.Consistent with the hook's return value renaming, improving semantic clarity.
59-59: Conditional logic correctly updated.The component properly uses the renamed variable in both conditional rendering blocks.
Also applies to: 76-76
77-77: Improved responsive design.The change from fixed width (
w-[441px]) to responsive full width with fixed height (h-[600px] w-full) provides better layout flexibility.apps/backoffice-v2/src/pages/Entity/components/Case/Case.Documents.Toolbar.tsx (4)
54-54: Consistent prop interface update.The prop renaming from
shouldDownloadtoisDocumentWithoutViewermaintains consistency across the component API and improves semantic clarity.Also applies to: 66-66
112-112: Correctly updated button disabled states.All toolbar buttons consistently use the renamed variable for their disabled conditions.
Also applies to: 130-130, 169-169
142-146: Excellent UX improvement for disabled state.The conditional styling (
pointer-events-none opacity-50) provides clear visual feedback when the download button is unavailable, improving user experience.
152-155: Outstanding accessibility implementation!The addition of
aria-disabledand conditionaltabIndex={-1}follows WCAG guidelines perfectly, ensuring screen readers and keyboard navigation work correctly for disabled download links.
| @@ -85,7 +85,7 @@ export const Documents: FunctionComponent<IDocumentsProps> = ({ | |||
| onRotateDocument={onRotateDocument} | |||
| onOpenDocumentInNewTab={onOpenDocumentInNewTab} | |||
| // isRotatedOrTransformed={isRotatedOrTransformed} | |||
| shouldDownload={shouldDownload} | |||
| shouldDownload={isDocumentWithoutViewer} | |||
There was a problem hiding this comment.
Fix prop name inconsistency.
The DocumentsToolbar component interface expects isDocumentWithoutViewer prop, but you're passing shouldDownload. This will cause a TypeScript error.
Apply this fix:
- shouldDownload={isDocumentWithoutViewer}
+ isDocumentWithoutViewer={isDocumentWithoutViewer}📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| shouldDownload={isDocumentWithoutViewer} | |
| isDocumentWithoutViewer={isDocumentWithoutViewer} |
🤖 Prompt for AI Agents
In apps/backoffice-v2/src/pages/Entity/components/Case/Case.Documents.tsx at
line 88, replace the prop name `shouldDownload` with `isDocumentWithoutViewer`
when passing props to the DocumentsToolbar component to match its expected
interface and avoid TypeScript errors.
Summary by CodeRabbit
New Features
Refactor
shouldDownloadtoisDocumentWithoutVieweracross document-related components for improved clarity.Chores