From 1a3407a218cf70371568c5c9f45ef025a1a24c67 Mon Sep 17 00:00:00 2001 From: Maurice Date: Tue, 14 Apr 2026 20:17:52 +0200 Subject: [PATCH] Add show more/less button for long journal entries (#623) - Show "Show more" button on both mobile and desktop when entry text is clamped - Add "Show less" button when expanded to collapse back - Add useTranslation hook to ExpandableStory component - Add i18n keys common.showMore and common.showLess for all 14 languages --- client/src/i18n/translations/ar.ts | 2 ++ client/src/i18n/translations/br.ts | 2 ++ client/src/i18n/translations/cs.ts | 2 ++ client/src/i18n/translations/de.ts | 2 ++ client/src/i18n/translations/en.ts | 2 ++ client/src/i18n/translations/es.ts | 2 ++ client/src/i18n/translations/fr.ts | 2 ++ client/src/i18n/translations/hu.ts | 2 ++ client/src/i18n/translations/it.ts | 2 ++ client/src/i18n/translations/nl.ts | 2 ++ client/src/i18n/translations/pl.ts | 2 ++ client/src/i18n/translations/ru.ts | 2 ++ client/src/i18n/translations/zh.ts | 2 ++ client/src/i18n/translations/zhTw.ts | 2 ++ client/src/pages/JourneyDetailPage.tsx | 15 ++++++++++++--- 15 files changed, 40 insertions(+), 3 deletions(-) diff --git a/client/src/i18n/translations/ar.ts b/client/src/i18n/translations/ar.ts index e77b0d47..3a37d8f5 100644 --- a/client/src/i18n/translations/ar.ts +++ b/client/src/i18n/translations/ar.ts @@ -5,6 +5,8 @@ const ar: Record = { // Common 'common.save': 'حفظ', + 'common.showMore': 'عرض المزيد', + 'common.showLess': 'عرض أقل', 'common.cancel': 'إلغاء', 'common.delete': 'حذف', 'common.edit': 'تعديل', diff --git a/client/src/i18n/translations/br.ts b/client/src/i18n/translations/br.ts index 448815e2..ef89acd7 100644 --- a/client/src/i18n/translations/br.ts +++ b/client/src/i18n/translations/br.ts @@ -1,6 +1,8 @@ const br: Record = { // Common 'common.save': 'Salvar', + 'common.showMore': 'Mostrar mais', + 'common.showLess': 'Mostrar menos', 'common.cancel': 'Cancelar', 'common.delete': 'Excluir', 'common.edit': 'Editar', diff --git a/client/src/i18n/translations/cs.ts b/client/src/i18n/translations/cs.ts index f9250361..3a0cf375 100644 --- a/client/src/i18n/translations/cs.ts +++ b/client/src/i18n/translations/cs.ts @@ -1,6 +1,8 @@ const cs: Record = { // Společné (Common) 'common.save': 'Uložit', + 'common.showMore': 'Zobrazit více', + 'common.showLess': 'Zobrazit méně', 'common.cancel': 'Zrušit', 'common.delete': 'Smazat', 'common.edit': 'Upravit', diff --git a/client/src/i18n/translations/de.ts b/client/src/i18n/translations/de.ts index 2ff65611..107b9903 100644 --- a/client/src/i18n/translations/de.ts +++ b/client/src/i18n/translations/de.ts @@ -1,6 +1,8 @@ const de: Record = { // Allgemein 'common.save': 'Speichern', + 'common.showMore': 'Mehr anzeigen', + 'common.showLess': 'Weniger anzeigen', 'common.cancel': 'Abbrechen', 'common.delete': 'Löschen', 'common.edit': 'Bearbeiten', diff --git a/client/src/i18n/translations/en.ts b/client/src/i18n/translations/en.ts index 886c4213..8acb2238 100644 --- a/client/src/i18n/translations/en.ts +++ b/client/src/i18n/translations/en.ts @@ -1,6 +1,8 @@ const en: Record = { // Common 'common.save': 'Save', + 'common.showMore': 'Show more', + 'common.showLess': 'Show less', 'common.cancel': 'Cancel', 'common.delete': 'Delete', 'common.edit': 'Edit', diff --git a/client/src/i18n/translations/es.ts b/client/src/i18n/translations/es.ts index 5f3c4b17..518bac4e 100644 --- a/client/src/i18n/translations/es.ts +++ b/client/src/i18n/translations/es.ts @@ -1,6 +1,8 @@ const es: Record = { // Common 'common.save': 'Guardar', + 'common.showMore': 'Ver más', + 'common.showLess': 'Ver menos', 'common.cancel': 'Cancelar', 'common.delete': 'Eliminar', 'common.edit': 'Editar', diff --git a/client/src/i18n/translations/fr.ts b/client/src/i18n/translations/fr.ts index 88bda0bd..b5aaa41a 100644 --- a/client/src/i18n/translations/fr.ts +++ b/client/src/i18n/translations/fr.ts @@ -1,6 +1,8 @@ const fr: Record = { // Common 'common.save': 'Enregistrer', + 'common.showMore': 'Voir plus', + 'common.showLess': 'Voir moins', 'common.cancel': 'Annuler', 'common.delete': 'Supprimer', 'common.edit': 'Modifier', diff --git a/client/src/i18n/translations/hu.ts b/client/src/i18n/translations/hu.ts index 4fdc8f31..816fe69d 100644 --- a/client/src/i18n/translations/hu.ts +++ b/client/src/i18n/translations/hu.ts @@ -1,6 +1,8 @@ const hu: Record = { // Általános 'common.save': 'Mentés', + 'common.showMore': 'Továbbiak', + 'common.showLess': 'Kevesebb', 'common.cancel': 'Mégse', 'common.delete': 'Törlés', 'common.edit': 'Szerkesztés', diff --git a/client/src/i18n/translations/it.ts b/client/src/i18n/translations/it.ts index a781535f..8c7d986e 100644 --- a/client/src/i18n/translations/it.ts +++ b/client/src/i18n/translations/it.ts @@ -1,6 +1,8 @@ const it: Record = { // Common 'common.save': 'Salva', + 'common.showMore': 'Mostra di più', + 'common.showLess': 'Mostra meno', 'common.cancel': 'Annulla', 'common.delete': 'Elimina', 'common.edit': 'Modifica', diff --git a/client/src/i18n/translations/nl.ts b/client/src/i18n/translations/nl.ts index a8726b42..ab7790bc 100644 --- a/client/src/i18n/translations/nl.ts +++ b/client/src/i18n/translations/nl.ts @@ -1,6 +1,8 @@ const nl: Record = { // Common 'common.save': 'Opslaan', + 'common.showMore': 'Meer tonen', + 'common.showLess': 'Minder tonen', 'common.cancel': 'Annuleren', 'common.delete': 'Verwijderen', 'common.edit': 'Bewerken', diff --git a/client/src/i18n/translations/pl.ts b/client/src/i18n/translations/pl.ts index 45c83dde..a3a2953b 100644 --- a/client/src/i18n/translations/pl.ts +++ b/client/src/i18n/translations/pl.ts @@ -1,6 +1,8 @@ const pl: Record = { // Common 'common.save': 'Zapisz', + 'common.showMore': 'Pokaż więcej', + 'common.showLess': 'Pokaż mniej', 'common.cancel': 'Anuluj', 'common.delete': 'Usuń', 'common.edit': 'Edytuj', diff --git a/client/src/i18n/translations/ru.ts b/client/src/i18n/translations/ru.ts index 8fc08565..6842f015 100644 --- a/client/src/i18n/translations/ru.ts +++ b/client/src/i18n/translations/ru.ts @@ -1,6 +1,8 @@ const ru: Record = { // Common 'common.save': 'Сохранить', + 'common.showMore': 'Показать больше', + 'common.showLess': 'Показать меньше', 'common.cancel': 'Отмена', 'common.delete': 'Удалить', 'common.edit': 'Редактировать', diff --git a/client/src/i18n/translations/zh.ts b/client/src/i18n/translations/zh.ts index d998b5c0..e78e4b94 100644 --- a/client/src/i18n/translations/zh.ts +++ b/client/src/i18n/translations/zh.ts @@ -1,6 +1,8 @@ const zh: Record = { // Common 'common.save': '保存', + 'common.showMore': '显示更多', + 'common.showLess': '收起', 'common.cancel': '取消', 'common.delete': '删除', 'common.edit': '编辑', diff --git a/client/src/i18n/translations/zhTw.ts b/client/src/i18n/translations/zhTw.ts index 76612034..e7393705 100644 --- a/client/src/i18n/translations/zhTw.ts +++ b/client/src/i18n/translations/zhTw.ts @@ -1,6 +1,8 @@ const zhTw: Record = { // Common 'common.save': '儲存', + 'common.showMore': '顯示更多', + 'common.showLess': '收起', 'common.cancel': '取消', 'common.delete': '刪除', 'common.edit': '編輯', diff --git a/client/src/pages/JourneyDetailPage.tsx b/client/src/pages/JourneyDetailPage.tsx index ba69b1f7..d8875d19 100644 --- a/client/src/pages/JourneyDetailPage.tsx +++ b/client/src/pages/JourneyDetailPage.tsx @@ -992,6 +992,7 @@ function GalleryView({ entries, journeyId, userId, trips, onPhotoClick, onRefres // ── Expandable Story ───────────────────────────────────────────────────── function ExpandableStory({ story }: { story: string }) { + const { t } = useTranslation() const [expanded, setExpanded] = useState(false) const [clamped, setClamped] = useState(false) const ref = useRef(null) @@ -1017,16 +1018,24 @@ function ExpandableStory({ story }: { story: string }) { onClick={() => { if (clamped || expanded) setExpanded(e => !e) }} className={`text-[13px] text-zinc-700 dark:text-zinc-300 leading-relaxed ${ expanded ? '' : 'line-clamp-3 md:line-clamp-[9]' - } ${clamped || expanded ? 'cursor-pointer md:cursor-auto' : ''}`} + } ${clamped || expanded ? 'cursor-pointer' : ''}`} > {clamped && !expanded && ( + )} + {expanded && ( + )}