Add description, fix regex to allow copy-pasting YT links

Samfundet · Nov 1, 2024 · 1c1804c · 1c1804c
1 parent d865c4e
commit 1c1804c
Show file tree

Hide file tree

Showing 4 changed files with 11 additions and 6 deletions.
diff --git a/frontend/src/PagesAdmin/RecruitmentFormAdminPage/RecruitmentFormAdminPage.tsx b/frontend/src/PagesAdmin/RecruitmentFormAdminPage/RecruitmentFormAdminPage.tsx
@@ -17,6 +17,7 @@ import {
   NumberInput,
 } from '~/Components';
 import type { DropdownOption } from '~/Components/Dropdown/Dropdown';
+import { FormDescription } from '~/Components/Forms/Form';
 import { getOrganizations, postRecruitment, putRecruitment } from '~/api';
 import type { OrganizationDto, RecruitmentDto } from '~/dto';
 import { useTitle } from '~/hooks';
@@ -238,7 +239,8 @@ export function RecruitmentFormAdminPage() {
                 name="promo_media"
                 render={({ field }) => (
                   <FormItem className={styles.item}>
-                    <FormLabel>{`${t(KEY.recruitment_promo_media)}`}</FormLabel>
+                    <FormLabel>{t(KEY.recruitment_promo_media)}</FormLabel>
+                    <FormDescription>{t(KEY.promo_media_description)}</FormDescription>
                     <FormControl>
                       <Input type="text" {...field} />
                     </FormControl>

diff --git a/frontend/src/PagesAdmin/RecruitmentFormAdminPage/recruitmentSchema.ts b/frontend/src/PagesAdmin/RecruitmentFormAdminPage/recruitmentSchema.ts
@@ -64,11 +64,11 @@ export const recruitmentSchema = z
   .refine(
     (data) => {
       const promoMedia = data.promo_media;
-      const regex = /(youtu.*be.*)\/(watch\?v=|embed\/|v|shorts|)(.*?((?=[&#?])|$))/;
+      const regex = /^(https?:\/\/)?(www\.)?(youtu.*be.*)\/(watch\?v=|embed\/|v|shorts|)(.*?((?=[&#?])|$))/;
       return promoMedia.match(regex) || promoMedia.length === 11 || promoMedia === '';
     },
     {
-      message: i18next.t(KEY.promo_video_invalid),
+      message: i18next.t(KEY.promo_media_invalid),
       path: ['promo_media'],
     },
   );

diff --git a/frontend/src/i18n/constants.ts b/frontend/src/i18n/constants.ts
@@ -471,7 +471,8 @@ export const KEY = {
   notfoundpage_contact_prompt: 'notfoundpage_contact_prompt',
   saksdokumentpage_publication_date: 'saksdokumentpage_publication_date',
   eventsadminpage_successful_delete_toast: 'eventsadminpage_successful_delete_toast',
-  promo_video_invalid: 'promo_video_invalid',
+  promo_media_description: 'promo_media_description',
+  promo_media_invalid: 'promo_media_invalid',
 
   error_generic: 'error_generic',
   error_generic_description: 'error_generic_description',

diff --git a/frontend/src/i18n/translations.ts b/frontend/src/i18n/translations.ts
@@ -472,7 +472,8 @@ export const nb = prepareTranslations({
   [KEY.admin_saksdokumenter_cannot_reupload]: 'Det er ikke mulig å endre filen som er lastet opp.',
   [KEY.eventsadminpage_successful_delete_toast]: 'Slettingen av arrangementet var vellykket.',
 
-  [KEY.promo_video_invalid]: 'Må være en lenke til en YouTube-video',
+  [KEY.promo_media_description]: 'Lenke eller ID til en YouTube-video',
+  [KEY.promo_media_invalid]: 'Må være en gyldig lenke til en YouTube-video',
 
   // Errors
   [KEY.error_generic]: 'Uventet feil',
@@ -891,7 +892,8 @@ export const en = prepareTranslations({
   [KEY.admin_saksdokumenter_cannot_reupload]: 'It is not possible to change the uploaded file.',
   [KEY.eventsadminpage_successful_delete_toast]: 'Succsessfully deleted event.',
 
-  [KEY.promo_video_invalid]: 'Must be a link to a YouTube video',
+  [KEY.promo_media_description]: 'Link or ID of a YouTube video',
+  [KEY.promo_media_invalid]: 'Must be a valid link to a YouTube video',
 
   [KEY.recruitment_three_interviews_criteria_header]:
     'Applicants with less than 3 interviews, but have applied to more than 3 positions',