[PB-5462] Version History UI (panel + menu entry) #1764
Conversation
Add "Version history" option to drive item context menu for files across all drive views (personal, shared, workspace). Menu item is disabled for folders and includes placeholder implementation in useDriveItemActions hook.
Add version history sidebar with UI for viewing, restoring, and deleting file versions. Includes state management in UI slice, integration with drive explorer context menus, and mock data structure for version display.
Deploying drive-web with
|
| Latest commit: |
19e5544
|
| Status: | ✅ Deploy successful! |
| Preview URL: | https://5d04d4cd.drive-web.pages.dev |
| Branch Preview URL: | https://feature-file-version-history.drive-web.pages.dev |
terrerox
force-pushed
the
feature/file-version-history
branch
from
e0a0878 to
cc7a1ac
Compare
Refactors the version history sidebar by extracting components into separate files for better maintainability and code organization. Replaces magic strings with constants for dropdown positioning.
terrerox
force-pushed
the
feature/file-version-history
branch
from
cc7a1ac to
fc14a30
Compare
NOTE: Tests will be added in another PR. |
There was a problem hiding this comment.
You must add the translations for the other 7 languages.
| className="h-4 w-4" | ||
| /> | ||
| <span className="text-base text-gray-80"> | ||
| {totalAutosaveCount}/{totalAutosaveCount} autosave versions |
There was a problem hiding this comment.
Add the text to the JSON and add its translations.
Also, these values are the same {totalAutosaveCount}/{totalAutosaveCount}. How should it look like?
There was a problem hiding this comment.
The {totalAutosaveCount}/{totalAutosaveCount} was intentional. I plan to address that in a separate PR
| <div className="flex min-w-0 flex-1 flex-col space-y-1"> | ||
| <div className="flex items-center justify-between"> | ||
| <span className="text-base font-semibold text-gray-100"> | ||
| {dateService.format(version.date, 'MMM D, h:mm A')} |
There was a problem hiding this comment.
Extract that to a variable, something like const versionDate = dateService.format...
| {dateService.format(version.date, 'MMM D, h:mm A')} | ||
| </span> | ||
| <span className="rounded bg-primary/10 px-[4px] py-[2px] text-xs font-semibold text-primary dark:bg-[#082D66] dark:text-[#72AAFF]"> | ||
| Current |
There was a problem hiding this comment.
Extract the text to the JSON and add its translations.
| <div className="flex min-w-0 flex-1 flex-col space-y-1"> | ||
| <div className="flex items-center justify-between"> | ||
| <span className="text-base font-semibold text-gray-100"> | ||
| {dateService.format(version.date, 'MMM D, h:mm A')} |
There was a problem hiding this comment.
I see you use the date with the same format. What about format the date when you fetch it so you can use directly version.date instead of formatting it every time?
| {version.expiresInDays !== undefined && ( | ||
| <div className="flex items-center space-x-1 text-[12px] text-red-dark"> | ||
| <Info size={16} weight="regular" /> | ||
| <span>Expires in {version.expiresInDays} days</span> |
There was a problem hiding this comment.
Add the text to the JSONs and ad its translations.
| { | ||
| name: 'Restore version', | ||
| icon: ClockCounterClockwise, | ||
| action: handleRestore, | ||
| }, | ||
| { | ||
| name: 'Download version', | ||
| icon: DownloadSimple, | ||
| action: handleDownload, | ||
| }, | ||
| { | ||
| separator: true, | ||
| }, | ||
| { | ||
| name: 'Delete version', | ||
| icon: Trash, | ||
| action: handleDelete, | ||
| }, |
There was a problem hiding this comment.
Add the text to the JSONs and add its translations.
|
Description
Add version history sidebar with UI for viewing, restoring, and deleting file versions. Includes state management in UI slice, integration with drive explorer context menus, and mock data structure for version display.
Related Issues
Related Pull Requests
Checklist
Testing Process
Additional Notes