Skip to content

Commit 0c13e9b

Browse files
bobsingorbobsingor
committed
Improve some translations and add overflow menu to the annotations / shapes toolbar
1 parent 01d8210 commit 0c13e9b

5 files changed

Lines changed: 87 additions & 70 deletions

File tree

‎viewers/snippet/src/components/app.tsx‎

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -37,7 +37,7 @@ import {
3737
useActiveDocument,
3838
} from '@embedpdf/plugin-document-manager/preact';
3939
import { CommandsPluginPackage, CommandsPluginConfig } from '@embedpdf/plugin-commands/preact';
40-
import { I18nPluginPackage, I18nPluginConfig } from '@embedpdf/plugin-i18n/preact';
40+
import { I18nPluginPackage, I18nPluginConfig, useTranslations } from '@embedpdf/plugin-i18n/preact';
4141
import {
4242
MarqueeZoom,
4343
ZoomMode,
@@ -325,6 +325,7 @@ interface ViewerLayoutProps {
325325
function ViewerLayout({ documentId, tabBarVisibility = 'multiple' }: ViewerLayoutProps) {
326326
const { renderToolbar, renderSidebar, renderModal, renderOverlays } =
327327
useSchemaRenderer(documentId);
328+
const { translate } = useTranslations(documentId);
328329

329330
const selectionMenu = useSelectionMenu('selection', documentId);
330331
const annotationMenu = useSelectionMenu('annotation', documentId);
@@ -361,7 +362,7 @@ function ViewerLayout({ documentId, tabBarVisibility = 'multiple' }: ViewerLayou
361362
<>
362363
{isLoading && (
363364
<div className="flex h-full items-center justify-center">
364-
<LoadingIndicator size="lg" text="Loading document..." />
365+
<LoadingIndicator size="lg" text={translate('document.loading')} />
365366
</div>
366367
)}
367368
{isError && <DocumentPasswordPrompt documentState={documentState} />}

‎viewers/snippet/src/config/commands.ts‎

Lines changed: 21 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1329,7 +1329,7 @@ export const commands: Record<string, Command<State>> = {
13291329

13301330
'annotation:overflow-tools': {
13311331
id: 'annotation:overflow-tools',
1332-
labelKey: 'annotation.overflowTools',
1332+
labelKey: 'annotation.moreTools',
13331333
icon: 'dots',
13341334
categories: ['annotation', 'annotation-overflow'],
13351335
action: ({ registry, documentId }) => {
@@ -1351,6 +1351,26 @@ export const commands: Record<string, Command<State>> = {
13511351
},
13521352
},
13531353

1354+
'annotation:overflow-shapes': {
1355+
id: 'annotation:overflow-shapes',
1356+
labelKey: 'annotation.moreTools',
1357+
icon: 'dots',
1358+
categories: ['annotation', 'annotation-shape', 'annotation-overflow'],
1359+
action: ({ registry, documentId }) => {
1360+
const uiCapability = registry.getPlugin<UIPlugin>('ui')?.provides();
1361+
if (!uiCapability) return;
1362+
1363+
const scope = uiCapability.forDocument(documentId);
1364+
if (!scope) return;
1365+
1366+
scope.toggleMenu('shapes-tools-menu', 'annotation:overflow-shapes', 'overflow-shapes-tools');
1367+
},
1368+
active: ({ state, documentId }) => {
1369+
const ui = state.plugins['ui']?.documents[documentId];
1370+
return ui?.openMenus['shapes-tools-menu'] !== undefined;
1371+
},
1372+
},
1373+
13541374
// ─────────────────────────────────────────────────────────
13551375
// Redaction Commands
13561376
// ─────────────────────────────────────────────────────────

‎viewers/snippet/src/config/translations.ts‎

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -38,6 +38,7 @@ export const englishTranslations: Locale = {
3838
print: 'Print',
3939
export: 'Export',
4040
fullscreen: 'Fullscreen',
41+
loading: 'Loading document...',
4142
},
4243
emptyState: {
4344
title: 'No Documents Open',
@@ -149,6 +150,7 @@ export const englishTranslations: Locale = {
149150
noStylesStamp: 'There are no styles for stamps.',
150151
selectAnnotation: 'Select an annotation to see styles',
151152
deleteSelected: 'Delete selected annotation',
153+
moreTools: 'More Tools',
152154
},
153155
redaction: {
154156
area: 'Redact Area',
@@ -231,6 +233,7 @@ export const germanTranslations: Locale = {
231233
print: 'Drucken',
232234
export: 'Exportieren',
233235
fullscreen: 'Vollbild',
236+
loading: 'Dokument wird geladen...',
234237
},
235238
emptyState: {
236239
title: 'Keine Dokumente geöffnet',
@@ -342,6 +345,7 @@ export const germanTranslations: Locale = {
342345
noStylesStamp: 'Für Stempel gibt es keine Stile.',
343346
selectAnnotation: 'Wählen Sie eine Anmerkung aus, um Stile anzuzeigen',
344347
deleteSelected: 'Ausgewählte Anmerkung löschen',
348+
moreTools: 'Weitere Werkzeuge',
345349
},
346350
redaction: {
347351
area: 'Bereich schwärzen',
@@ -424,6 +428,7 @@ export const dutchTranslations: Locale = {
424428
print: 'Afdrukken',
425429
export: 'Exporteren',
426430
fullscreen: 'Volledig scherm',
431+
loading: 'Document laden...',
427432
},
428433
emptyState: {
429434
title: 'Geen documenten geopend',
@@ -536,6 +541,7 @@ export const dutchTranslations: Locale = {
536541
noStylesStamp: 'Er zijn geen stijlen voor stempels.',
537542
selectAnnotation: 'Selecteer een annotatie om stijlen te zien',
538543
deleteSelected: 'Geselecteerde annotatie verwijderen',
544+
moreTools: 'Meer gereedschappen',
539545
},
540546
redaction: {
541547
area: 'Gebied redigeren',
@@ -618,6 +624,7 @@ export const frenchTranslations: Locale = {
618624
print: 'Imprimer',
619625
export: 'Exporter',
620626
fullscreen: 'Plein écran',
627+
loading: 'Chargement du document...',
621628
},
622629
emptyState: {
623630
title: 'Aucun document ouvert',
@@ -729,6 +736,7 @@ export const frenchTranslations: Locale = {
729736
noStylesStamp: "Il n'y a pas de styles pour les tampons.",
730737
selectAnnotation: 'Sélectionnez une annotation pour voir les styles',
731738
deleteSelected: "Supprimer l'annotation sélectionnée",
739+
moreTools: "Plus d'outils",
732740
},
733741
redaction: {
734742
area: 'Caviarder la zone',
@@ -811,6 +819,7 @@ export const spanishTranslations: Locale = {
811819
print: 'Imprimir',
812820
export: 'Exportar',
813821
fullscreen: 'Pantalla completa',
822+
loading: 'Cargando documento...',
814823
},
815824
emptyState: {
816825
title: 'No hay documentos abiertos',
@@ -923,6 +932,7 @@ export const spanishTranslations: Locale = {
923932
noStylesStamp: 'No hay estilos para los sellos.',
924933
selectAnnotation: 'Seleccione una anotación para ver los estilos',
925934
deleteSelected: 'Eliminar anotación seleccionada',
935+
moreTools: 'Más herramientas',
926936
},
927937
redaction: {
928938
area: 'Redactar área',

‎viewers/snippet/src/config/ui-schema.ts‎

Lines changed: 53 additions & 64 deletions
Original file line numberDiff line numberDiff line change
@@ -308,13 +308,13 @@ export const viewerUISchema: UISchema = {
308308
breakpoints: {
309309
sm: {
310310
maxWidth: 640,
311-
hide: ['redo-button', 'undo-button'],
311+
hide: ['add-text', 'add-stamp'],
312312
show: ['overflow-annotation-tools'],
313313
},
314314
md: {
315315
minWidth: 640,
316-
show: ['redo-button', 'undo-button'],
317316
hide: ['overflow-annotation-tools'],
317+
show: ['add-text', 'add-stamp'],
318318
},
319319
},
320320
},
@@ -370,6 +370,13 @@ export const viewerUISchema: UISchema = {
370370
variant: 'icon',
371371
categories: ['annotation', 'annotation-stamp'],
372372
},
373+
{
374+
type: 'command-button',
375+
id: 'overflow-annotation-tools',
376+
commandId: 'annotation:overflow-tools',
377+
variant: 'icon',
378+
categories: ['annotation', 'annotation-overflow'],
379+
},
373380
{
374381
type: 'divider',
375382
id: 'annotation-tools-divider-1',
@@ -404,13 +411,6 @@ export const viewerUISchema: UISchema = {
404411
variant: 'icon',
405412
categories: ['history', 'history-redo'],
406413
},
407-
{
408-
type: 'command-button',
409-
id: 'overflow-annotation-tools',
410-
commandId: 'annotation:overflow-tools',
411-
variant: 'icon',
412-
categories: ['annotation', 'annotation-overflow'],
413-
},
414414
],
415415
},
416416
{ type: 'spacer', id: 'spacer-4', flex: true },
@@ -424,6 +424,20 @@ export const viewerUISchema: UISchema = {
424424
slot: 'secondary',
425425
order: 0,
426426
},
427+
responsive: {
428+
breakpoints: {
429+
sm: {
430+
maxWidth: 640,
431+
hide: ['add-polygon', 'add-polyline'],
432+
show: ['overflow-shapes-tools'],
433+
},
434+
md: {
435+
minWidth: 640,
436+
hide: ['overflow-shapes-tools'],
437+
show: ['add-polygon', 'add-polyline'],
438+
},
439+
},
440+
},
427441
permanent: false,
428442
categories: ['annotation', 'annotation-shape'],
429443
items: [
@@ -476,6 +490,13 @@ export const viewerUISchema: UISchema = {
476490
variant: 'icon',
477491
categories: ['annotation', 'annotation-shape', 'annotation-polyline'],
478492
},
493+
{
494+
type: 'command-button',
495+
id: 'overflow-shapes-tools',
496+
commandId: 'annotation:overflow-shapes',
497+
variant: 'icon',
498+
categories: ['annotation', 'annotation-shape', 'annotation-overflow'],
499+
},
479500
{
480501
type: 'divider',
481502
id: 'shapes-tools-divider-1',
@@ -662,6 +683,20 @@ export const viewerUISchema: UISchema = {
662683
hide: ['mode:view', 'mode:annotate', 'mode:shapes'],
663684
},
664685
},
686+
localeOverrides: {
687+
groups: [
688+
{
689+
id: 'germanic-languages',
690+
locales: ['de', 'nl'],
691+
breakpoints: {
692+
md: {
693+
// Germanic languages hide shapes from toolbar at md, so show it in overflow
694+
replaceHide: ['mode:view', 'mode:annotate'],
695+
},
696+
},
697+
},
698+
],
699+
},
665700
},
666701
},
667702
'zoom-levels-menu': {
@@ -851,50 +886,16 @@ export const viewerUISchema: UISchema = {
851886
},
852887
{
853888
type: 'command',
854-
id: 'annotation:add-highlight',
855-
commandId: 'annotation:add-highlight',
856-
categories: ['annotation', 'annotation-markup', 'annotation-highlight'],
857-
},
858-
{
859-
type: 'command',
860-
id: 'annotation:add-strikeout',
861-
commandId: 'annotation:add-strikeout',
862-
categories: ['annotation', 'annotation-markup', 'annotation-strikeout'],
863-
},
864-
{
865-
type: 'command',
866-
id: 'annotation:add-underline',
867-
commandId: 'annotation:add-underline',
868-
categories: ['annotation', 'annotation-markup', 'annotation-underline'],
869-
},
870-
{
871-
type: 'divider',
872-
id: 'divider-12',
873-
},
874-
{
875-
type: 'command',
876-
id: 'annotation:add-rectangle',
877-
commandId: 'annotation:add-rectangle',
878-
categories: ['annotation', 'annotation-shape', 'annotation-rectangle'],
879-
},
880-
{
881-
type: 'command',
882-
id: 'annotation:add-circle',
883-
commandId: 'annotation:add-circle',
884-
categories: ['annotation', 'annotation-shape', 'annotation-circle'],
885-
},
886-
{
887-
type: 'command',
888-
id: 'annotation:add-line',
889-
commandId: 'annotation:add-line',
890-
categories: ['annotation', 'annotation-shape', 'annotation-line'],
891-
},
892-
{
893-
type: 'command',
894-
id: 'annotation:add-arrow',
895-
commandId: 'annotation:add-arrow',
896-
categories: ['annotation', 'annotation-shape', 'annotation-arrow'],
889+
id: 'annotation:add-stamp',
890+
commandId: 'annotation:add-stamp',
891+
categories: ['annotation', 'annotation-stamp'],
897892
},
893+
],
894+
},
895+
'shapes-tools-menu': {
896+
id: 'shapes-tools-menu',
897+
categories: ['annotation', 'annotation-shape'],
898+
items: [
898899
{
899900
type: 'command',
900901
id: 'annotation:add-polygon',
@@ -907,18 +908,6 @@ export const viewerUISchema: UISchema = {
907908
commandId: 'annotation:add-polyline',
908909
categories: ['annotation', 'annotation-shape', 'annotation-polyline'],
909910
},
910-
{
911-
type: 'command',
912-
id: 'annotation:add-ink',
913-
commandId: 'annotation:add-ink',
914-
categories: ['annotation', 'annotation-ink'],
915-
},
916-
{
917-
type: 'command',
918-
id: 'annotation:add-stamp',
919-
commandId: 'annotation:add-stamp',
920-
categories: ['annotation', 'annotation-stamp'],
921-
},
922911
],
923912
},
924913
'page-settings-menu': {

‎viewers/snippet/src/index.html‎

Lines changed: 0 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -25,9 +25,6 @@
2525
tabBar: 'always',
2626
theme: {
2727
preference: 'system'
28-
},
29-
i18n: {
30-
defaultLocale: 'fr',
3128
}
3229
})
3330
</script>

0 commit comments

Comments
 (0)