Make record step mobile friendly

localization/TranscriberAdmin-en-1.2.xliff

@@ -8700,6 +8700,13 @@
                <context context-type="sourcefile">PlanSheet.tsx</context>
             </context-group>
          </trans-unit>
+        <trans-unit id="shared.upload">
+          <source>Upload</source>
+          <target/>
+          <context-group>
+              <context context-type="sourcefile">PlanSheet.tsx</context>
+          </context-group>
+        </trans-unit>
       	<trans-unit id="shared.uploadRights">
       		<source>Upload Rights File</source>
       		<target/>

localization/strings-3.csv

@@ -181,6 +181,7 @@ mediaTab.loadingTable	Loading data	Chargement des données	Carregando dados	Carg
 faithbridge.loading	Loading result...	Chargement du résultat...	A carregar resultado...	Cargando resultado...	Memuat hasil...	Загрузка результата...	正在加载结果...
 passageRecord.loading	Loading...	Chargement...	Carregando...	Cargando...	Sedang memuat...	Загрузка...	加载中...
 shared.uploadRights	Upload Rights File	Télécharger le fichier des droits	Upload de ficheiros de direitos	Cargar archivo de derechos	Unggah File Hak Cipta	Загрузить файл с правами	上传权利文件
+shared.upload Upload  Annuler	Cancelar	Cancelar	Batal	Отмена	取消
 passageRecord.loadlatest	Load Latest Audio	Charger le dernier fichier audio	Carregar Último Áudio	Cargar audio más reciente	Muat Audio Terbaru	Загрузить последнее аудио	家在最新的音频
 mediaUpload.resourceTitle	Upload Resources	Télécharger les ressources	Carregar Recursos	Cargar recursos	Unggah Sumber	Загрузить ресурсы	上传资源
 community.loading	Loading:	Chargement :	Carregando:	Cargar:	Memuat:	Загрузка:	正在加载中
@@ -376,7 +377,7 @@ main.apiError	API Error:	Erreur API:	Erro de API:	Error de la API:	Kesalahan API
 integration.usernameError	Username error:	Erreur de nom d'utilisateur:	Erro de nome de usuário:	Error de nombre de usuario:	Kesalahan nama pengguna:	Ошибка имени пользователя:	用户名错误：
 integration.syncError	Sync error:	Erreur de synchronisation:	Erro de sincronização:	Error de sincronización:	Kesalahan kirim/terima:	Ошибка синхронизации:	同步出错
 transcriptionTab.error	Export Error	Erreur d'exportation	Erro de Exportação	Error en la exportación	Kesalahan Saat Mengekspor	Ошибка экспорта	导出错误
-faithbridge.error	Error: 	Erreur : 	Erro: 	Error: 	Error: 	Ошибка:	错误： 
+faithbridge.error	Error: 	Erreur : 	Erro: 	Error: 	Error: 	Ошибка:	错误：
 grid.equal	Equals	Équivaut à	Igual	Es igual a	Sama dengan	Равно	等于
 vProject.scenes	Scene/Scenes	Scène/Scènes	Cena/Cenas	Escena/Escenas	Adegan	Сцена/Сцены	场景
 control.scripture	Scripture	Écritures	Referência Bíblica	Escritura	Alkitab	Писание	经文

localization/strings-3u.csv

@@ -260,7 +260,7 @@ template.end	Ending verse number	Numéro du verset de fin	Número do versículo
 grid.endsWith	Ends with	Se termine par	Termina com	Termina con	Berakhir dengan	Заканчивается на	结束于
 mediaUpload.markdownTitle	Enter Text	Saisir le texte	Inserir texto	Introducir Texto	Ketik Teks	Введите текст	输入文本
 grid.equal	Equals	Équivaut à	Igual	Es igual a	Sama dengan	Равно	等于
-faithbridge.error	Error: 	Erreur : 	Erro: 	Error: 	Error: 	Ошибка:	错误： 
+faithbridge.error	Error: 	Erreur : 	Erro: 	Error: 	Error: 	Ошибка:	错误：
 keyTerms.exclude	Exclude	Exclure	Excluir	Excluir	Kecualikan	Исключить	排除
 voice.excludeName	Exclude my name.	Exclure mon nom.	Exclua meu nome.	Excluir mi nombre.	Kecualikan nama saya.	Исключите мое имя.	排除我的姓名。
 voice.excludedLanguages	Excluded languages	Langues exclues	Idiomas excluídos	Idiomas excluidos	Bahasa yang dikecualikan	Исключенные языки	排除的语言
@@ -780,6 +780,7 @@ cards.uploadProgress	Upload Progress	Progression du téléchargement	Progresso d
 mediaUpload.resourceTitle	Upload Resources	Télécharger les ressources	Carregar Recursos	Cargar recursos	Unggah Sumber	Загрузить ресурсы	上传资源
 shared.uploadRights	Upload Rights File	Télécharger le fichier des droits	Upload de ficheiros de direitos	Cargar archivo de derechos	Unggah File Hak Cipta	Загрузить файл с правами	上传权利文件
 shared.uploadSuccess	Upload Successful	Téléchargement réussi	Carregamento bem sucedido	Carga correcta	Pengunggahan Berhasil	Загрузка успешна	上传成功
+shared.upload Upload  Annuler	Cancelar	Cancelar	Batal	Отмена	取消
 passageDetailArtifacts.upload	Uploads	Téléchargements	Uploads	Cargas	Unggahan	Загрузка	上传
 mediaTab.user	User	Utilisateur	Utilizador	Usuario	Pengguna	Пользователь	用户
 profile.userProfile	User profile	Profil du utilisateur	Perfil do usuário	Perfil de usuario	Profil pengguna	Профиль пользователя	用户资料

package.json

@@ -33,7 +33,7 @@
     "@electron/notarize": "^2.3.1",
     "@emotion/react": "^11.14.0",
     "@emotion/styled": "^11.14.1",
-    "@fingerprintjs/fingerprintjs": "^5.0.1",
+    "@fingerprintjs/fingerprintjs": "^5.1.0",
     "@fontsource/roboto": "^5.2.6",
     "@fortawesome/fontawesome-svg-core": "^7.0.1",
     "@fortawesome/free-regular-svg-icons": "^7.0.1",

src/renderer/src/business/voice/VoiceStatement.tsx

@@ -12,6 +12,7 @@ import { ISharedStrings, IVoiceStrings, Organization } from '../../model';
 import BigDialog from '../../hoc/BigDialog';
 import { shallowEqual, useSelector } from 'react-redux';
 import { sharedSelector, voiceSelector } from '../../selector';
+import { useMobile } from '../../utils/index';
 
 interface IProps {
   voice?: string;
@@ -42,6 +43,8 @@ export const VoiceStatement = ({
     navigator.clipboard.writeText(permStatement);
   };
 
+  const { isMobile: isMobileView } = useMobile();
+
   function handlePersonalize() {
     const newState = { ...state, fullName: voice };
     setState && setState(newState);
@@ -55,18 +58,22 @@ export const VoiceStatement = ({
 
   return (
     <Box>
-      <Stack direction="column" spacing={1} sx={{ mx: 1 }}>
-        <Typography sx={{ lineHeight: '1.2rem', pt: 1 }}>
+      <Stack direction="column" spacing={1} sx={{ mx: isMobileView ? 0 : 1 }}>
+        <Typography sx={{ lineHeight: '1.2rem', pt: 1, ...(isMobileView ? { maxHeight: '8rem', overflowY: 'auto', border: '1px solid gray', borderRadius: '4px', p: 1 } : {}) }}>
           {permStatement}
         </Typography>
         <ActionRow>
-          <IconButton onClick={handleCopy} title={ts.clipboardCopy}>
-            <ContentCopyIcon color="primary" fontSize="small" />
-          </IconButton>
-          <GrowingSpacer />
-          <AltButton onClick={handlePersonalize} disabled={saving}>
-            {t.personalize}
-          </AltButton>
+          {!isMobileView && (
+            <>
+              <IconButton onClick={handleCopy} title={ts.clipboardCopy}>
+                <ContentCopyIcon color="primary" fontSize="small" />
+              </IconButton>
+              <GrowingSpacer />
+              <AltButton onClick={handlePersonalize} disabled={saving}>
+                {t.personalize}
+              </AltButton>
+            </>
+          )}
         </ActionRow>
       </Stack>
       <BigDialog

src/renderer/src/components/MediaRecord.tsx

@@ -10,7 +10,7 @@ import { useGlobal } from '../context/useGlobal';
 import { IPassageRecordStrings, ISharedStrings } from '../model';
 import { Stack, Paper, Typography } from '@mui/material';
 import WSAudioPlayer, { WSAudioPlayerControls } from './WSAudioPlayer';
-import { loadBlobAsync, waitForIt } from '../utils';
+import { loadBlobAsync, useMobile, waitForIt } from '../utils';
 import {
   IMediaState,
   MediaSt,
@@ -556,8 +556,10 @@ function MediaRecord(props: IProps) {
     return content;
   }
 
+  const { isMobile: isMobileView } = useMobile();
+
   return (
-    <Paper id="mediaRecord" sx={{ width: width, maxWidth: width, minWidth: 0 }}>
+    <Paper id="mediaRecord" sx={{ width: isMobileView ? width - 12 : width, maxWidth: width, minWidth: 0 }}>
       {content}
     </Paper>
   );