Add optional link to video page for video blocks (#926)

closes #854 This adds an optional link to video blocks which links directly to the video page of that block. Right now it is a link button but I wouldn't mind if this were just a link (just text + icon without the background and outline).
elan-ev · Sep 12, 2023 · 8c98f26 · 8c98f26
2 parents 03e5289 + 67d939a
commit 8c98f26
Show file tree

Hide file tree

Showing 28 changed files with 177 additions and 119 deletions.
diff --git a/backend/src/api/model/block/mod.rs b/backend/src/api/model/block/mod.rs
@@ -207,6 +207,7 @@ pub(crate) struct VideoBlock {
     // Is `None` if the video was removed from the DB.
     pub(crate) event: Option<Id>,
     pub(crate) show_title: bool,
+    pub(crate) show_link: bool,
 }
 
 impl Block for VideoBlock {
@@ -230,6 +231,10 @@ impl VideoBlock {
         self.show_title
     }
 
+    fn show_link(&self) -> bool {
+        self.show_link
+    }
+
     fn id(&self) -> Id {
         Block::id(self)
     }
@@ -255,6 +260,7 @@ impl_from_db!(
             videolist_order,
             video,
             show_title,
+            show_link,
             show_metadata,
             realm,
         },
@@ -290,6 +296,7 @@ impl_from_db!(
                 shared,
                 event: row.video::<Option<Key>>().map(Id::event),
                 show_title: unwrap_type_dep(row.show_title(), "event", "show_title"),
+                show_link: unwrap_type_dep(row.show_link(), "event", "show_link"),
             }.into(),
         }
     }

diff --git a/backend/src/api/model/block/mutations.rs b/backend/src/api/model/block/mutations.rs
@@ -82,9 +82,9 @@ impl BlockValue {
 
         context.db
             .execute(
-                "insert into blocks (realm, index, type, video, show_title) \
-                    values ($1, $2, 'video', $3, $4)",
-                &[&realm.key, &index, &event, &block.show_title],
+                "insert into blocks (realm, index, type, video, show_title, show_link) \
+                    values ($1, $2, 'video', $3, $4, $5)",
+                &[&realm.key, &index, &event, &block.show_title, &block.show_link],
             )
             .await?;
 
@@ -309,13 +309,14 @@ impl BlockValue {
         let query = format!(
             "update blocks set \
                 video = coalesce($2, video), \
-                show_title = coalesce($3, show_title) \
+                show_title = coalesce($3, show_title), \
+                show_link = coalesce($4, show_link) \
                 where id = $1 \
                 and type = 'video' \
                 returning {selection}",
         );
         context.db
-            .query_one(&query, &[&Self::key_for(id)?, &video_id, &set.show_title])
+            .query_one(&query, &[&Self::key_for(id)?, &video_id, &set.show_title, &set.show_link])
             .await?
             .pipe(|row| Ok(Self::from_row_start(&row)))
     }
@@ -395,6 +396,7 @@ pub(crate) struct NewSeriesBlock {
 pub(crate) struct NewVideoBlock {
     event: Id,
     show_title: bool,
+    show_link: bool,
 }
 
 
@@ -420,6 +422,7 @@ pub(crate) struct UpdateSeriesBlock {
 pub(crate) struct UpdateVideoBlock {
     event: Option<Id>,
     show_title: Option<bool>,
+    show_link: Option<bool>,
 }
 
 

diff --git a/backend/src/db/migrations.rs b/backend/src/db/migrations.rs
@@ -337,4 +337,5 @@ static MIGRATIONS: Lazy<BTreeMap<u64, Migration>> = include_migrations![
     20: "fix-queue-triggers",
     21: "fix-user-root-realm-name-block",
     22: "user-email",
+    23: "video-block-show-link",
 ];
diff --git a/backend/src/db/migrations/23-video-block-show-link.sql b/backend/src/db/migrations/23-video-block-show-link.sql
@@ -0,0 +1,10 @@
+-- Adds a single `show_link` field to blocks, used for video blocks to also show
+-- a link to the corresponding video page. We also drop and re-add the appropriate constraint.
+alter table blocks
+    add column show_link boolean default true,
+    drop constraint video_block_has_fields,
+    add constraint video_block_has_fields check (type <> 'video' or (
+        show_title is not null and
+        show_link is not null
+    ));
+
diff --git a/frontend/src/i18n/locales/de.yaml b/frontend/src/i18n/locales/de.yaml
@@ -1,34 +1,35 @@
-language-name: Deutsch
-language: Sprache
-language-selection: Sprachauswahl, Deutsch ausgewählt
-loading: Lade...
-close: Schließen
-cancel: Abbrechen
-save: Speichern
-back: Zurück
-home: Startseite
-navigation: Navigation
-rename: Umbenennen
-this-field-is-required: Dieses Feld ist erforderlich.
-version-information: Version
-
 general:
-  goto-homepage: Zur Startseite
+  language:
+    language_one: Sprache
+    language_other: Sprachen
+    name: Deutsch
+    selection: Sprachauswahl, Deutsch ausgewählt
+  loading: Lade...
+  home: Startseite
   homepage: Startseite
+  navigation: Navigation
   leave-page-confirmation: >
     Seite verlassen? Vorgenommene Änderungen sind möglicherweise noch nicht gespeichert!
+  action:
+    close: Schließen
+    cancel: Abbrechen
+    save: Speichern
+    back: Zurück
+    rename: Umbenennen
+    goto-homepage: Zur Startseite
+    share: Teilen
+  version-information: Version
   logo-alt: Das Logo von „{{title}}“
   no-root-children: Noch keine Seiten ...
-  failed-to-load-thumbnail: Konnte Vorschaubild nicht laden
+  failed-to-load-thumbnail: Vorschaubild konnte nicht geladen werden.
   yes: Ja
   no: Nein
-  share: Teilen
   form:
+    this-field-is-required: Dieses Feld ist erforderlich.
     select:
       no-options: Keine Optionen
       select-option: Option auswählen...
 
-
 welcome:
   title: Willkommen zu Tobira!
   body: >
@@ -50,7 +51,7 @@ errors:
   are-you-connected-to-internet: Sind Sie mit dem Internet verbunden?
   unknown: Unbekannter Fehler.
   detailed-error-info: Detaillierte Fehlerinformationen für Entwickler
-  embedded: In der eingebetteten Anwendung ist ein Fehler aufgetreten
+  embedded: In der eingebetteten Anwendung ist ein Fehler aufgetreten.
 
 not-found:
   page-not-found: Seite nicht gefunden
@@ -126,8 +127,7 @@ video:
   created: Erstellt
   updated: Zuletzt angepasst
   duration: Abspielzeit
-  language_one: Sprache
-  language_other: Sprachen
+  link: Zur Videoseite
   part-of-series: Teil von Serie
   more-from-series: Mehr von „{{series}}“
   deleted-video-block: Das hier referenzierte Video wurde gelöscht.
@@ -146,15 +146,14 @@ video:
   source: Quelle
   stream-ended: Dieser Stream ist beendet.
   stream-not-started-yet: Dieser Stream hat noch nicht begonnen.
-  started-generic: Gestartet
-  started: Gestartet {{duration}}
+  started: Gestartet
+  started-when: Gestartet {{duration}}
   starts: Startet 
   starts-in: Startet {{duration}}
   description:
     show-more: Mehr anzeigen
     show-less: Weniger anzeigen
   embed:
-    button: Einbetten
     title: Video einbetten
     copy-embed-code-to-clipboard: Einbettungscode in Zwischenablage kopieren
   caption: Untertitel
@@ -294,10 +293,6 @@ upload:
     jwt-invalid: 'Interner Fremdauthentifizierungsfehler: Opencast hat das Hochladen nicht autorisiert.'
 
 manage:
-  nav:
-    dashboard: Dashboard
-    my-videos: Meine Videos
-
   dashboard:
     title: Dashboard
     upload-tile: Hier können Sie Videos von Ihrem Computer hochladen.
@@ -469,14 +464,11 @@ manage:
           no-read-access-to-current: >
             Sie haben keinen Lesezugriff zu dem derzeit verlinkten Video.
 
-      titled:
-        title: Titel
-        show-title: Titel anzeigen
+      show-title: Titel anzeigen
+      show-link: Link zur Videoseite anzeigen
 
-      save: Speichern
       cancel: Verwerfen
       confirm-cancel: Änderungen verwerfen?
-
       cancel-warning: Ihre Änderungen wurden noch nicht gespeichert!
 
       removing-failed: Entfernen ist fehlgeschlagen.
@@ -524,4 +516,4 @@ api-remote-errors:
       Kontaktieren Sie einen Systemadministrator für weitere Unterstützung.
 
 embed:
-  not-supported: Diese Seite kann nicht eingebettet werden
+  not-supported: Diese Seite kann nicht eingebettet werden.
diff --git a/frontend/src/i18n/locales/en.yaml b/frontend/src/i18n/locales/en.yaml
@@ -1,28 +1,30 @@
-language-name: English
-language: Language
-language-selection: Language selection, English selected
-loading: Loading...
-close: Close
-cancel: Cancel
-save: Save
-back: Back
-home: Home
-navigation: Navigation
-rename: Rename
-this-field-is-required: This field is required.
-version-information: Version
-
 general:
+  language:
+    language_one: Language
+    language_other: Languages
+    name: English
+    selection: Language selection, English selected
+  loading: Loading...
+  home: Home
   homepage: Homepage
-  goto-homepage: Go to homepage
+  navigation: Navigation
   leave-page-confirmation: Leave page? Changes you made may not be saved!
+  action:
+    close: Close
+    cancel: Cancel
+    save: Save
+    back: Back
+    rename: Rename
+    goto-homepage: Go to homepage
+    share: Share
+  version-information: Version
   logo-alt: Logo of “{{title}}”
   no-root-children: No pages yet ...
-  failed-to-load-thumbnail: Failed to load thumbnail
+  failed-to-load-thumbnail: Failed to load thumbnail.
   yes: "Yes"
   no: "No"
-  share: Share
   form:
+    this-field-is-required: This field is required.
     select:
       no-options: No options
       select-option: Select option...
@@ -48,7 +50,7 @@ errors:
   are-you-connected-to-internet: Are you connected to the internet?
   unknown: Unknown error.
   detailed-error-info: Detailed error information for developers
-  embedded: An error occurred in the embedded application
+  embedded: An error occurred in the embedded application.
 
 not-found:
   page-not-found: Page not found
@@ -123,16 +125,15 @@ video:
   created: Created
   updated: Last updated
   duration: Duration
-  language_one: Language
-  language_other: Languages
+  link: Go to video page
   part-of-series: Part of series
   more-from-series: More from “{{series}}”
   deleted-video-block: The video referenced here was deleted.
   not-allowed-video-block: You are not allowed to view the video embedded here.
   not-ready:
-    title: Video not processed, yet
+    title: Video not processed yet
     text: >
-      This video hasn't been processed, yet. This should
+      This video hasn't been processed yet. This should
       happen automatically soon. Try again in a few minutes.
     label: unprocessed
   thumbnail-for: Thumbnail for “{{video}}”
@@ -143,15 +144,14 @@ video:
   source: Source
   stream-ended: This stream has ended.
   stream-not-started-yet: This stream has not started yet.
-  started-generic: Started
-  started: Started {{duration}}
+  started: Started
+  started-when: Started {{duration}}
   starts: Starts
   starts-in: Starts {{duration}}
   description:
     show-more: Show more
     show-less: Show less
   embed:
-    button: Embed
     title: Embed video
     copy-embed-code-to-clipboard: Copy embed code to clipboard
   caption: Caption
@@ -287,10 +287,6 @@ upload:
     jwt-invalid: 'Internal cross-authentication error: Opencast did not authorize the upload.'
 
 manage:
-  nav:
-    dashboard: Dashboard
-    my-videos: My videos
-
   dashboard:
     title: Dashboard
     upload-tile: Here you can upload a new video from your computer.
@@ -456,14 +452,11 @@ manage:
           no-read-access-to-current: >
             You do not have read access to the video that is currently referenced here.
 
-      titled:
-        title: Title
-        show-title: Show title
+      show-title: Show title
+      show-link: Show link to video page
 
-      save: Save
       cancel: Discard
       confirm-cancel: Discard changes?
-
       cancel-warning: Your changes have not yet been saved!
 
       removing-failed: Removing failed.
@@ -511,4 +504,4 @@ api-remote-errors:
       further assistance.
 
 embed:
-  not-supported: This page can't be embedded
+  not-supported: This page can't be embedded.
diff --git a/frontend/src/layout/Navigation.tsx b/frontend/src/layout/Navigation.tsx
@@ -49,7 +49,7 @@ export const Nav: React.FC<Props> = ({ fragRef }) => {
     const parent = realm.isUserRoot
         ? {
             path: "/",
-            name: t("home"),
+            name: t("general.home"),
             isMainRoot: true,
         }
         : realm.parent;
@@ -78,7 +78,7 @@ export const Nav: React.FC<Props> = ({ fragRef }) => {
                 {/* Show arrow and hide chevron in burger menu */}
                 <FiCornerLeftUp css={{ display: "none" }}/>
                 <FiChevronLeft />
-                {parent.isMainRoot ? t("home") : parent.name ?? <MissingRealmName />}
+                {parent.isMainRoot ? t("general.home") : parent.name ?? <MissingRealmName />}
             </LinkWithIcon>
             <div css={{
                 padding: "8px 14px 8px 16px",

diff --git a/frontend/src/layout/Root.tsx b/frontend/src/layout/Root.tsx
@@ -105,7 +105,7 @@ export const InitialLoading: React.FC = () => {
                         marginTop: 32,
                         animation: `${pulsing} 1.2s infinite`,
                         fontSize: 20,
-                    }}>{t("loading")}</div>
+                    }}>{t("general.loading")}</div>
                 </div>
             </Main>
             <Footer />