mirror of
https://github.com/suitenumerique/docs.git
synced 2026-10-01 05:55:16 +02:00
💄(frontend) update ui doc toolbox
We updated the UI of the doc toolbox to fit with the design system. The icons have been updated, we moved it to the doc management folder in order to use it to different places in the app.
This commit is contained in:
Anthony LC
@@ -19,7 +19,7 @@ test.describe('Doc Version', () => {
|
||||
|
||||
// Initially, there is no version
|
||||
await page.getByLabel('Open the document options').click();
|
||||
await page.getByRole('menuitem', { name: 'Version history' }).click();
|
||||
await page.getByRole('menuitem', { name: 'History' }).click();
|
||||
await expect(page.getByText('History', { exact: true })).toBeVisible();
|
||||
|
||||
const modal = page.getByRole('dialog', { name: 'Version history' });
|
||||
@@ -64,7 +64,7 @@ test.describe('Doc Version', () => {
|
||||
).toBeVisible();
|
||||
|
||||
await page.getByLabel('Open the document options').click();
|
||||
await page.getByRole('menuitem', { name: 'Version history' }).click();
|
||||
await page.getByRole('menuitem', { name: 'History' }).click();
|
||||
|
||||
await expect(panel).toBeVisible();
|
||||
await expect(page.getByText('History', { exact: true })).toBeVisible();
|
||||
@@ -114,9 +114,7 @@ test.describe('Doc Version', () => {
|
||||
await verifyDocName(page, 'Mocked document');
|
||||
|
||||
await page.getByLabel('Open the document options').click();
|
||||
await expect(
|
||||
page.getByRole('menuitem', { name: 'Version history' }),
|
||||
).toBeHidden();
|
||||
await expect(page.getByRole('menuitem', { name: 'History' })).toBeHidden();
|
||||
});
|
||||
|
||||
test('it restores the doc version', async ({ page, browserName }) => {
|
||||
@@ -151,7 +149,7 @@ test.describe('Doc Version', () => {
|
||||
await expect(thread).toBeHidden();
|
||||
|
||||
await page.getByLabel('Open the document options').click();
|
||||
await page.getByRole('menuitem', { name: 'Version history' }).click();
|
||||
await page.getByRole('menuitem', { name: 'History' }).click();
|
||||
|
||||
const modal = page.getByRole('dialog', { name: 'Version history' });
|
||||
const panel = modal.getByLabel('Version list');
|
||||
|
||||
@@ -1,3 +1,19 @@
|
||||
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M14.2637 1.91406C15.2623 1.91413 16.0175 2.17011 16.5293 2.68164C17.0411 3.18732 17.2979 3.93421 17.2979 4.9209V6.30859H18.8701C19.869 6.30863 20.6239 6.56444 21.1357 7.07617C21.6476 7.58801 21.9043 8.33394 21.9043 9.31445V18.75C21.9042 19.7365 21.6475 20.4827 21.1357 20.9883C20.6239 21.4999 19.8689 21.7558 18.8701 21.7559H9.49902C8.50021 21.7558 7.74517 21.5027 7.2334 20.9971C6.72166 20.4914 6.46587 19.7427 6.46582 18.75V17.3525H4.89258C3.89393 17.3525 3.13875 17.1001 2.62695 16.5947C2.11512 16.0891 1.85841 15.3395 1.8584 14.3467V4.9209C1.8584 3.92804 2.11511 3.17853 2.62695 2.67285C3.13875 2.16735 3.89381 1.91411 4.89258 1.91406H14.2637ZM9.61035 8.13086C9.17887 8.13088 8.84924 8.24466 8.62109 8.47266C8.39292 8.69466 8.27832 9.03127 8.27832 9.48145V18.5928C8.27838 19.0428 8.39298 19.3786 8.62109 19.6006C8.84924 19.8286 9.17881 19.9433 9.61035 19.9434H18.7588C19.1843 19.9434 19.5111 19.8287 19.7393 19.6006C19.9674 19.3786 20.082 19.0428 20.082 18.5928V9.48145C20.082 9.03127 19.9674 8.69466 19.7393 8.47266C19.5111 8.24456 19.1842 8.13086 18.7588 8.13086H9.61035ZM5.00391 3.72754C4.57223 3.72754 4.24184 3.84116 4.01367 4.06934C3.79171 4.29134 3.68066 4.62799 3.68066 5.07812V14.1895C3.68068 14.6395 3.79176 14.9789 4.01367 15.207C4.24184 15.429 4.57223 15.54 5.00391 15.54H6.46582V9.31445C6.46582 8.32778 6.72156 7.58185 7.2334 7.07617C7.74517 6.5644 8.50021 6.30867 9.49902 6.30859H15.4746V5.07812C15.4746 4.62795 15.361 4.29134 15.1328 4.06934C14.9047 3.84127 14.5777 3.72755 14.1523 3.72754H5.00391Z" fill="#222631"/>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16">
|
||||
<g clip-path="url(#a)">
|
||||
<path
|
||||
fill="currentColor"
|
||||
fill-rule="evenodd"
|
||||
d="M13.333 4.667a2 2 0 0 1 2 2v6.666a2 2 0 0 1-2 2H6.666a2 2 0 0 1-2-2V6.667a2 2 0 0 1 2-2zM6.666 6a.667.667 0 0 0-.667.667v6.666c0 .368.299.667.667.667h6.667a.667.667 0 0 0 .666-.667V6.667A.667.667 0 0 0 13.333 6z"
|
||||
clip-rule="evenodd"
|
||||
/>
|
||||
<path
|
||||
fill="currentColor"
|
||||
d="M9.333.667c1.101 0 2 .898 2 2a.667.667 0 0 1-1.334 0A.67.67 0 0 0 9.333 2H2.666a.67.67 0 0 0-.667.667v6.666a.67.67 0 0 0 .667.667.667.667 0 1 1 0 1.333c-1.102 0-2-.898-2-2V2.667c0-1.102.898-2 2-2z"
|
||||
/>
|
||||
</g>
|
||||
<defs>
|
||||
<clipPath id="a">
|
||||
<path fill="#fff" d="M0 0h16v16H0z" />
|
||||
</clipPath>
|
||||
</defs>
|
||||
</svg>
|
||||
|
||||
|
Before Width: | Height: | Size: 1.6 KiB After Width: | Height: | Size: 782 B |
@@ -1,3 +1,17 @@
|
||||
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M11 17H7C5.61667 17 4.4375 16.5125 3.4625 15.5375C2.4875 14.5625 2 13.3833 2 12C2 10.6167 2.4875 9.4375 3.4625 8.4625C4.4375 7.4875 5.61667 7 7 7H11V9H7C6.16667 9 5.45833 9.29167 4.875 9.875C4.29167 10.4583 4 11.1667 4 12C4 12.8333 4.29167 13.5417 4.875 14.125C5.45833 14.7083 6.16667 15 7 15H11V17ZM8 13V11H16V13H8ZM13 17V15H17C17.8333 15 18.5417 14.7083 19.125 14.125C19.7083 13.5417 20 12.8333 20 12C20 11.1667 19.7083 10.4583 19.125 9.875C18.5417 9.29167 17.8333 9 17 9H13V7H17C18.3833 7 19.5625 7.4875 20.5375 8.4625C21.5125 9.4375 22 10.6167 22 12C22 13.3833 21.5125 14.5625 20.5375 15.5375C19.5625 16.5125 18.3833 17 17 17H13Z" fill="#222631"/>
|
||||
<svg viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<g clip-path="url(#clip0_16126_11257)">
|
||||
<path
|
||||
d="M6.95067 5.3404C7.52275 5.38137 8.07951 5.54459 8.58283 5.81957C9.08618 6.09457 9.52443 6.47486 9.86799 6.93415C10.0885 7.2289 10.0285 7.64651 9.73388 7.86709C9.43908 8.0876 9.02084 8.02771 8.80028 7.73298C8.57124 7.42678 8.27907 7.17283 7.94351 6.98949C7.60801 6.80623 7.23693 6.69715 6.85562 6.66983C6.47429 6.64252 6.09143 6.6977 5.73322 6.83129C5.37495 6.96493 5.04914 7.17413 4.7788 7.44457L2.78661 9.4361C2.30088 9.93904 2.03249 10.6132 2.03856 11.3124C2.04468 12.0115 2.32543 12.6806 2.81981 13.175C3.31414 13.6692 3.98283 13.9495 4.68179 13.9556C5.38098 13.9617 6.05516 13.6927 6.55809 13.2069L7.6896 12.0754C7.94995 11.8151 8.37196 11.8151 8.63231 12.0754C8.89261 12.3358 8.89264 12.7578 8.63231 13.0181L7.48388 14.1666C6.72956 14.895 5.71929 15.298 4.67072 15.289C3.62207 15.2799 2.61871 14.8592 1.8771 14.1177C1.13554 13.3762 0.714416 12.3728 0.705229 11.3241C0.696116 10.2753 1.09964 9.26473 1.82828 8.51032L1.83609 8.50186L3.83609 6.50186C4.24158 6.09625 4.72971 5.78239 5.26708 5.58194C5.80441 5.38152 6.37864 5.29945 6.95067 5.3404Z"
|
||||
fill="currentColor"
|
||||
/>
|
||||
<path
|
||||
d="M11.3315 0.710843C12.3802 0.720025 13.3836 1.14124 14.1252 1.88272C14.8666 2.62429 15.2872 3.62773 15.2964 4.67634C15.3054 5.72491 14.9024 6.73517 14.174 7.48949L12.1655 9.49795C11.76 9.90356 11.2719 10.2174 10.7345 10.4179C10.1972 10.6183 9.62294 10.7004 9.05093 10.6594C8.47889 10.6184 7.92207 10.4552 7.41877 10.1802C6.91552 9.90525 6.47712 9.52489 6.13362 9.06566C5.91336 8.77085 5.97367 8.35318 6.26838 8.13272C6.56315 7.91235 6.98079 7.97284 7.20132 8.26748C7.43031 8.57356 7.72266 8.82703 8.05809 9.01032C8.39355 9.19359 8.76472 9.30263 9.14598 9.32998C9.52726 9.35729 9.91022 9.30207 10.2684 9.16853C10.6267 9.03488 10.9525 8.82568 11.2228 8.55524L13.2143 6.56371C13.7001 6.06077 13.9691 5.3866 13.963 4.68741C13.9569 3.98849 13.6766 3.31972 13.1824 2.82543C12.6881 2.33113 12.0189 2.05029 11.3198 2.04418C10.6207 2.03814 9.94706 2.30718 9.44416 2.79287L9.44351 2.79222L8.30419 3.92569C8.04308 4.18528 7.62107 4.18419 7.36148 3.92308C7.10206 3.66196 7.10303 3.23991 7.36408 2.98037L8.51057 1.8404C8.51283 1.83816 8.51544 1.8361 8.51773 1.83389C9.2721 1.10529 10.2828 0.70177 11.3315 0.710843Z"
|
||||
fill="currentColor"
|
||||
/>
|
||||
</g>
|
||||
<defs>
|
||||
<clipPath id="clip0_16126_11257">
|
||||
<rect width="16" height="16" fill="white" />
|
||||
</clipPath>
|
||||
</defs>
|
||||
</svg>
|
||||
|
||||
|
Before Width: | Height: | Size: 764 B After Width: | Height: | Size: 2.4 KiB |
@@ -1,20 +1,16 @@
|
||||
<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16">
|
||||
<path
|
||||
d="M12 14C13.3261 14 14.5975 14.5272 15.5352 15.4648C16.4728 16.4025 17 17.6739 17 19V21C17 21.5523 16.5523 22 16 22C15.4477 22 15 21.5523 15 21V19C15 18.2043 14.6837 17.4415 14.1211 16.8789C13.5585 16.3163 12.7956 16 12 16H6C5.20435 16 4.44152 16.3163 3.87891 16.8789C3.3163 17.4415 3 18.2044 3 19V21C3 21.5523 2.55228 22 2 22C1.44772 22 1 21.5523 1 21V19C1 17.6739 1.52716 16.4025 2.46484 15.4648C3.40253 14.5272 4.67392 14 6 14H12Z"
|
||||
fill="currentColor"
|
||||
d="M8 9.333a3.333 3.333 0 0 1 3.333 3.334V14a.667.667 0 0 1-1.334 0v-1.333a2 2 0 0 0-2-2H4a2 2 0 0 0-2 2V14a.667.667 0 1 1-1.333 0v-1.333A3.333 3.333 0 0 1 4 9.333zm4.02.587a.666.666 0 0 1 .813-.479 3.334 3.334 0 0 1 2.5 3.225V14a.667.667 0 0 1-1.334 0v-1.333l-.007-.165a2 2 0 0 0-1.493-1.77.666.666 0 0 1-.478-.812"
|
||||
/>
|
||||
<path
|
||||
d="M18.0322 14.8799C18.1703 14.3452 18.7153 14.024 19.25 14.1621C20.3226 14.4391 21.2734 15.0639 21.9521 15.9395C22.6308 16.815 22.9991 17.8913 23 18.999V21C22.9999 21.5522 22.5522 22 22 22C21.4478 22 21.0001 21.5522 21 21V19.001L20.9893 18.7529C20.9411 18.1768 20.7275 17.6248 20.3711 17.165C19.9639 16.6397 19.3936 16.2638 18.75 16.0977C18.2153 15.9595 17.8942 15.4146 18.0322 14.8799Z"
|
||||
fill="currentColor"
|
||||
/>
|
||||
<path
|
||||
fill-rule="evenodd"
|
||||
d="M6 1.333A3.333 3.333 0 1 1 6 8a3.333 3.333 0 0 1 0-6.667m0 1.334a2 2 0 1 0 0 4 2 2 0 0 0 0-4"
|
||||
clip-rule="evenodd"
|
||||
d="M9 2C11.7614 2 14 4.23858 14 7C14 9.76142 11.7614 12 9 12C6.23858 12 4 9.76142 4 7C4 4.23858 6.23858 2 9 2ZM9 4C7.34315 4 6 5.34315 6 7C6 8.65685 7.34315 10 9 10C10.6569 10 12 8.65685 12 7C12 5.34315 10.6569 4 9 4Z"
|
||||
fill="currentColor"
|
||||
/>
|
||||
<path
|
||||
d="M15.0322 2.87695C15.1709 2.34239 15.7164 2.02157 16.251 2.16016C17.3231 2.43813 18.2724 3.06445 18.9502 3.94043C19.628 4.81641 19.9961 5.8924 19.9961 7C19.9961 8.10761 19.628 9.18359 18.9502 10.0596C18.2723 10.9356 17.3232 11.5619 16.251 11.8398C15.7164 11.9784 15.1709 11.6575 15.0322 11.123C14.8936 10.5885 15.2145 10.0429 15.749 9.9043C16.3923 9.73752 16.9624 9.36154 17.3691 8.83594C17.7758 8.31038 17.9961 7.66451 17.9961 7C17.9961 6.33551 17.7757 5.68962 17.3691 5.16406C16.9624 4.63846 16.3923 4.26248 15.749 4.0957C15.2145 3.95707 14.8936 3.41154 15.0322 2.87695Z"
|
||||
fill="currentColor"
|
||||
d="M10.02 1.918a.667.667 0 0 1 .813-.478 3.333 3.333 0 0 1 0 6.453.667.667 0 0 1-.334-1.29 2.001 2.001 0 0 0 0-3.872.667.667 0 0 1-.478-.813"
|
||||
/>
|
||||
</svg>
|
||||
|
||||
|
Before Width: | Height: | Size: 1.9 KiB After Width: | Height: | Size: 807 B |
@@ -1,3 +1,12 @@
|
||||
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M9.27246 18.7681C9.08073 18.7681 8.92611 18.7155 8.80859 18.6104C8.69108 18.499 8.62923 18.3506 8.62305 18.165L8.34473 8.44238C8.33854 8.26302 8.39421 8.11768 8.51172 8.00635C8.62923 7.88883 8.78385 7.83008 8.97559 7.83008C9.16732 7.83008 9.32194 7.88574 9.43945 7.99707C9.55697 8.1084 9.61572 8.25374 9.61572 8.43311L9.90332 18.1558C9.90332 18.3413 9.84456 18.4897 9.72705 18.6011C9.61572 18.7124 9.46419 18.7681 9.27246 18.7681ZM12 18.7681C11.8083 18.7681 11.6506 18.7124 11.5269 18.6011C11.4093 18.4897 11.3506 18.3444 11.3506 18.165V8.44238C11.3506 8.26302 11.4093 8.11768 11.5269 8.00635C11.6506 7.88883 11.8083 7.83008 12 7.83008C12.1979 7.83008 12.3556 7.88883 12.4731 8.00635C12.5968 8.11768 12.6587 8.26302 12.6587 8.44238V18.165C12.6587 18.3444 12.5968 18.4897 12.4731 18.6011C12.3556 18.7124 12.1979 18.7681 12 18.7681ZM14.7368 18.7681C14.5389 18.7681 14.3812 18.7124 14.2637 18.6011C14.1523 18.4897 14.0998 18.3413 14.106 18.1558L14.3843 8.44238C14.3905 8.25684 14.4523 8.1084 14.5698 7.99707C14.6873 7.88574 14.8389 7.83008 15.0244 7.83008C15.2223 7.83008 15.377 7.88883 15.4883 8.00635C15.6058 8.11768 15.6615 8.26302 15.6553 8.44238L15.377 18.165C15.3708 18.3506 15.3089 18.499 15.1914 18.6104C15.0739 18.7155 14.9224 18.7681 14.7368 18.7681ZM7.78809 5.2417V3.23779C7.78809 2.52653 8.00146 1.97298 8.42822 1.57715C8.86117 1.17513 9.4611 0.974121 10.228 0.974121H13.7534C14.5203 0.974121 15.1203 1.17513 15.5532 1.57715C15.9862 1.97298 16.2026 2.52653 16.2026 3.23779V5.2417H14.4863V3.32129C14.4863 3.08626 14.409 2.89762 14.2544 2.75537C14.0998 2.60693 13.8926 2.53271 13.6328 2.53271H10.3486C10.0951 2.53271 9.89095 2.60693 9.73633 2.75537C9.58171 2.89762 9.50439 3.08626 9.50439 3.32129V5.2417H7.78809ZM3.67822 6.26221C3.44938 6.26221 3.25456 6.1818 3.09375 6.021C2.93294 5.86019 2.85254 5.66536 2.85254 5.43652C2.85254 5.21387 2.93294 5.02523 3.09375 4.87061C3.25456 4.7098 3.44938 4.62939 3.67822 4.62939H20.3311C20.5599 4.62939 20.7516 4.70671 20.9062 4.86133C21.0671 5.01595 21.1475 5.20768 21.1475 5.43652C21.1475 5.66536 21.0671 5.86019 20.9062 6.021C20.7516 6.1818 20.5599 6.26221 20.3311 6.26221H3.67822ZM7.7417 21.9131C7.02425 21.9131 6.44906 21.7121 6.01611 21.3101C5.58936 20.908 5.36051 20.3483 5.32959 19.6309L4.68018 6.08594H6.37793L7.01807 19.3433C7.03044 19.6154 7.12012 19.8381 7.28711 20.0112C7.4541 20.1844 7.66748 20.271 7.92725 20.271H16.0728C16.3325 20.271 16.5459 20.1844 16.7129 20.0112C16.8799 19.8442 16.9696 19.6216 16.9819 19.3433L17.5942 6.08594H19.3198L18.6797 19.6216C18.6488 20.339 18.4168 20.8988 17.9839 21.3008C17.5509 21.709 16.9788 21.9131 16.2676 21.9131H7.7417Z" fill="#222631"/>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16">
|
||||
<path
|
||||
fill="currentColor"
|
||||
d="M6.667 6.667c.369 0 .667.298.667.666v4a.667.667 0 1 1-1.333 0v-4c0-.368.298-.666.666-.666m2.667 0c.368 0 .667.298.667.666v4a.667.667 0 0 1-1.334 0v-4c0-.368.299-.666.667-.666"
|
||||
/>
|
||||
<path
|
||||
fill="currentColor"
|
||||
fill-rule="evenodd"
|
||||
d="M9.334.667a2 2 0 0 1 2 2v.666h2.667a.667.667 0 0 1 0 1.334h-.667v8.666a2 2 0 0 1-2 2H4.667a2 2 0 0 1-2-2V4.667h-.666a.667.667 0 0 1 0-1.334h2.666v-.666a2 2 0 0 1 2-2zM4.001 13.333a.666.666 0 0 0 .666.667h6.667a.666.666 0 0 0 .667-.667V4.667H4zM6.667 2a.667.667 0 0 0-.666.667v.666h4v-.666A.667.667 0 0 0 9.334 2z"
|
||||
clip-rule="evenodd"
|
||||
/>
|
||||
</svg>
|
||||
|
||||
|
Before Width: | Height: | Size: 2.7 KiB After Width: | Height: | Size: 706 B |
+2
-2
@@ -1,11 +1,11 @@
|
||||
import { Box } from '@/components';
|
||||
import { CardFloatingBar, FloatingBar } from '@/components/FloatingBar';
|
||||
import { DocToolBox } from '@/docs/doc-management/components/DocToolBox';
|
||||
import { useDocStore } from '@/docs/doc-management/stores/useDocStore';
|
||||
import { DocShareButton } from '@/features/docs/doc-share/components/DocShareButton';
|
||||
import { DocShareButton } from '@/docs/doc-share/components/DocShareButton';
|
||||
import { RightPanelCollapseButton } from '@/features/right-panel/components/RightPanelCollapseButton';
|
||||
|
||||
import { DocLeftPanelCollapseButton } from './DocLeftPanelCollapseButton';
|
||||
import { DocToolBox } from './DocToolBox';
|
||||
|
||||
export const DocFloatingBar = () => {
|
||||
const { currentDoc } = useDocStore();
|
||||
|
||||
+82
-67
@@ -10,31 +10,31 @@ import { useRouter } from 'next/router';
|
||||
import { useState } from 'react';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
|
||||
import AddLinkSVG from '@/assets/icons/ui-kit/add_link.svg';
|
||||
import ContentCopySVG from '@/assets/icons/ui-kit/content_copy.svg';
|
||||
import DeleteSVG from '@/assets/icons/ui-kit/delete.svg';
|
||||
import ContentCopyIcon from '@/assets/icons/ui-kit/copy.svg';
|
||||
import DownloadSVG from '@/assets/icons/ui-kit/download.svg';
|
||||
import SharedSVG from '@/assets/icons/ui-kit/group.svg';
|
||||
import HistorySVG from '@/assets/icons/ui-kit/history.svg';
|
||||
import KeepSVG from '@/assets/icons/ui-kit/keep.svg';
|
||||
import KeepOffSVG from '@/assets/icons/ui-kit/keep_off.svg';
|
||||
import LeaveSVG from '@/assets/icons/ui-kit/leave.svg';
|
||||
import LinkIcon from '@/assets/icons/ui-kit/link.svg';
|
||||
import MoreSVG from '@/assets/icons/ui-kit/more_horiz.svg';
|
||||
import {
|
||||
Doc,
|
||||
KEY_DOC,
|
||||
KEY_LIST_DOC,
|
||||
KEY_LIST_FAVORITE_DOC,
|
||||
useCopyDocLink,
|
||||
useCreateFavoriteDoc,
|
||||
useDeleteFavoriteDoc,
|
||||
useDocUtils,
|
||||
useDuplicateDoc,
|
||||
} from '@/docs/doc-management';
|
||||
import SharedIcon from '@/assets/icons/ui-kit/shared.svg';
|
||||
import DeleteIcon from '@/assets/icons/ui-kit/trash.svg';
|
||||
import { usePresenterStore } from '@/docs/doc-presenter/stores';
|
||||
import { useAuth } from '@/features/auth';
|
||||
import { useFocusStore, useResponsiveStore } from '@/stores';
|
||||
|
||||
import {
|
||||
KEY_DOC,
|
||||
KEY_LIST_DOC,
|
||||
KEY_LIST_FAVORITE_DOC,
|
||||
useCreateFavoriteDoc,
|
||||
useDeleteFavoriteDoc,
|
||||
useDuplicateDoc,
|
||||
} from '../api';
|
||||
import { useCopyDocLink } from '../hooks';
|
||||
import { Doc } from '../types';
|
||||
|
||||
const ModalRemoveDoc = dynamic(
|
||||
() =>
|
||||
import('@/docs/doc-management/components/ModalRemoveDoc').then((mod) => ({
|
||||
@@ -88,7 +88,6 @@ export const DocToolBox = ({ doc }: DocToolBoxProps) => {
|
||||
const { t } = useTranslation();
|
||||
const treeContext = useTreeContext<Doc>();
|
||||
const router = useRouter();
|
||||
const { isTopRoot } = useDocUtils(doc);
|
||||
const isTopParent = doc.id === treeContext?.root?.id; // it can be a child but not for the current user
|
||||
const { authenticated } = useAuth();
|
||||
const [openDropdown, setOpenDropdown] = useState(false);
|
||||
@@ -101,8 +100,6 @@ export const DocToolBox = ({ doc }: DocToolBoxProps) => {
|
||||
const { restoreFocus, addLastFocus } = useFocusStore();
|
||||
const { isMobile } = useResponsiveStore();
|
||||
const copyDocLink = useCopyDocLink(doc.id);
|
||||
// Deep-link (#2397) and slide/URL sync live in PresenterRoot; here we only
|
||||
// trigger the manual "Present" action.
|
||||
const openPresenter = usePresenterStore((state) => state.open);
|
||||
const { mutate: duplicateDoc } = useDuplicateDoc({
|
||||
onSuccess: (data) => {
|
||||
@@ -117,12 +114,53 @@ export const DocToolBox = ({ doc }: DocToolBoxProps) => {
|
||||
});
|
||||
|
||||
const options: DropdownMenuItem[] = [
|
||||
{
|
||||
label: t('Copy link', {
|
||||
description: 'Dropdown menu item to copy the document link',
|
||||
}),
|
||||
icon: <LinkIcon width={18} height={18} aria-hidden="true" />,
|
||||
callback: copyDocLink,
|
||||
},
|
||||
{
|
||||
label: t('Share', {
|
||||
description: 'Dropdown menu item to share the document',
|
||||
}),
|
||||
icon: <SharedIcon width={18} height={18} aria-hidden="true" />,
|
||||
callback: () => {
|
||||
setIsModalShareOpen(true);
|
||||
},
|
||||
isHidden: !authenticated,
|
||||
},
|
||||
{ type: 'separator' },
|
||||
{
|
||||
label: t('Present', {
|
||||
description:
|
||||
'Dropdown menu item to open the document in presentation mode',
|
||||
}),
|
||||
icon: <Present width={18} height={18} aria-hidden="true" />,
|
||||
callback: () => {
|
||||
openPresenter(0);
|
||||
},
|
||||
isHidden: Boolean(doc.deleted_at) || isMobile,
|
||||
testId: `docs-actions-present-${doc.id}`,
|
||||
},
|
||||
{
|
||||
label: t('Download', {
|
||||
description: 'Dropdown menu item to download the document',
|
||||
}),
|
||||
icon: <DownloadSVG width={18} height={18} aria-hidden="true" />,
|
||||
callback: () => {
|
||||
setIsModalExportOpen(true);
|
||||
},
|
||||
isHidden: !ModalExport,
|
||||
},
|
||||
{ type: 'separator' },
|
||||
{
|
||||
label: doc.is_favorite ? t('Unpin') : t('Pin'),
|
||||
icon: doc.is_favorite ? (
|
||||
<KeepOffSVG width={24} height={24} aria-hidden="true" />
|
||||
<KeepOffSVG width={18} height={18} aria-hidden="true" />
|
||||
) : (
|
||||
<KeepSVG width={24} height={24} aria-hidden="true" />
|
||||
<KeepSVG width={18} height={18} aria-hidden="true" />
|
||||
),
|
||||
callback: () => {
|
||||
if (doc.is_favorite) {
|
||||
@@ -134,50 +172,11 @@ export const DocToolBox = ({ doc }: DocToolBoxProps) => {
|
||||
isHidden: !doc.abilities.favorite,
|
||||
testId: `docs-actions-${doc.is_favorite ? 'unpin' : 'pin'}-${doc.id}`,
|
||||
},
|
||||
{ type: 'separator' },
|
||||
{
|
||||
label: t('Present'),
|
||||
icon: <Present width={24} height={24} aria-hidden="true" />,
|
||||
callback: () => {
|
||||
openPresenter(0);
|
||||
},
|
||||
isHidden: Boolean(doc.deleted_at) || isMobile,
|
||||
testId: `docs-actions-present-${doc.id}`,
|
||||
},
|
||||
{
|
||||
label: t('Copy link'),
|
||||
icon: <AddLinkSVG width={24} height={24} aria-hidden="true" />,
|
||||
callback: copyDocLink,
|
||||
},
|
||||
{
|
||||
label: t('Share'),
|
||||
icon: <SharedSVG width={24} height={24} aria-hidden="true" />,
|
||||
callback: () => {
|
||||
setIsModalShareOpen(true);
|
||||
},
|
||||
isHidden: !isTopRoot || !authenticated,
|
||||
},
|
||||
{
|
||||
label: t('Download'),
|
||||
icon: <DownloadSVG width={24} height={24} aria-hidden="true" />,
|
||||
callback: () => {
|
||||
setIsModalExportOpen(true);
|
||||
},
|
||||
isHidden: !ModalExport,
|
||||
},
|
||||
{
|
||||
label: t('Version history'),
|
||||
icon: <HistorySVG width={24} height={24} aria-hidden="true" />,
|
||||
isDisabled: !doc.abilities.versions_list,
|
||||
callback: () => {
|
||||
setIsModalHistoryOpen(true);
|
||||
},
|
||||
isHidden: isMobile || !doc.abilities.versions_list,
|
||||
showSeparator: true,
|
||||
},
|
||||
{
|
||||
label: t('Duplicate'),
|
||||
icon: <ContentCopySVG width={24} height={24} aria-hidden="true" />,
|
||||
label: t('Duplicate', {
|
||||
description: 'Dropdown menu item to duplicate the document',
|
||||
}),
|
||||
icon: <ContentCopyIcon width={18} height={18} aria-hidden="true" />,
|
||||
isDisabled: !doc.abilities.duplicate,
|
||||
callback: () => {
|
||||
duplicateDoc({
|
||||
@@ -187,11 +186,25 @@ export const DocToolBox = ({ doc }: DocToolBoxProps) => {
|
||||
});
|
||||
},
|
||||
isHidden: !doc.abilities.duplicate,
|
||||
},
|
||||
{ type: 'separator' },
|
||||
{
|
||||
label: t('History', {
|
||||
description: 'Dropdown menu item to view the document history',
|
||||
}),
|
||||
icon: <HistorySVG width={18} height={18} aria-hidden="true" />,
|
||||
isDisabled: !doc.abilities.versions_list,
|
||||
callback: () => {
|
||||
setIsModalHistoryOpen(true);
|
||||
},
|
||||
isHidden: isMobile || !doc.abilities.versions_list,
|
||||
showSeparator: true,
|
||||
},
|
||||
{
|
||||
label: t('Leave'),
|
||||
icon: <LeaveSVG width={24} height={24} aria-hidden="true" />,
|
||||
label: t('Leave', {
|
||||
description: 'Dropdown menu item to leave the document',
|
||||
}),
|
||||
icon: <LeaveSVG width={18} height={18} aria-hidden="true" />,
|
||||
callback: () => {
|
||||
setIsModalLeaveOpen(true);
|
||||
},
|
||||
@@ -203,8 +216,10 @@ export const DocToolBox = ({ doc }: DocToolBoxProps) => {
|
||||
isHidden: !isTopParent,
|
||||
},
|
||||
{
|
||||
label: t('Delete'),
|
||||
icon: <DeleteSVG width={24} height={24} aria-hidden="true" />,
|
||||
label: t('Delete', {
|
||||
description: 'Dropdown menu item to delete the document',
|
||||
}),
|
||||
icon: <DeleteIcon width={18} height={18} aria-hidden="true" />,
|
||||
callback: () => {
|
||||
setIsModalRemoveOpen(true);
|
||||
},
|
||||
Reference in New Issue
Block a user