tycho-components 0.0.15-SNAPSHOT-10 → 0.0.15-SNAPSHOT-12

package/dist/AppDropzone/AppDropzone.d.ts

@@ -0,0 +1,14 @@
+import './style.scss';
+import { UploadedFile } from './UploadedFile';
+type Props = {
+    folder: string;
+    onClose: () => void;
+    onSuccess: (response: UploadedFile) => void;
+    onError?: (err: any) => void;
+    accept: Record<string, string[]>;
+    onDrop?: () => void;
+    keepName?: boolean;
+    title?: string;
+};
+export default function AppDropzone({ folder, onClose, onSuccess, onError, accept, onDrop, keepName, title, }: Props): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/AppDropzone/AppDropzone.js

@@ -0,0 +1,43 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState } from 'react';
+import Dropzone from 'react-dropzone';
+import { useTranslation } from 'react-i18next';
+import './style.scss';
+import UploadService from './UploadService';
+import { useMessageUtils } from '../configs/useMessageUtils';
+import AppModal from '../AppModal';
+export default function AppDropzone({ folder, onClose, onSuccess, onError, accept, onDrop, keepName, title, }) {
+    const { t } = useTranslation('upload');
+    const { dispatchError } = useMessageUtils();
+    const [file, setFile] = useState();
+    const [preview, setPreview] = useState();
+    const isImageFile = (file) => {
+        return file.type.startsWith('image/');
+    };
+    const handleDrop = async (files) => {
+        const file = files[0];
+        setFile(file);
+        if (isImageFile(file))
+            setPreview(URL.createObjectURL(file));
+        onDrop && onDrop();
+    };
+    const upload = async () => {
+        if (!file)
+            return;
+        const data = new FormData();
+        data.append('file', file);
+        data.append('folder', folder);
+        keepName && data.append('keepOriginalName', 'true');
+        UploadService.execute(data)
+            .then((r) => {
+            onSuccess(r.data);
+        })
+            .catch((err) => {
+            dispatchError({ err: 'error.uploading.image', t });
+            onError && onError(err);
+        });
+    };
+    return (_jsx(AppModal, { title: title || t('modal.title'), className: "modal-upload", close: onClose, confirm: upload, children: _jsxs("div", { className: "dropzone-container", children: [!file && (_jsx(Dropzone, { onDrop: (acceptedFiles) => handleDrop(acceptedFiles), accept: accept, maxFiles: 1, children: ({ getRootProps, getInputProps }) => (_jsxs("div", { ...getRootProps(), className: "dropzone", children: [_jsx("input", { ...getInputProps() }), _jsx("span", { children: t('label.dropzone') })] })) })), file && preview && (_jsx("img", { className: "preview", src: preview, onLoad: () => {
+                        URL.revokeObjectURL(preview);
+                    } })), file && !preview && (_jsxs("div", { className: "uploaded-message", children: [_jsx("b", { children: t('label.uploaded.file') }), _jsx("span", { children: file.name }), _jsx("b", { children: t('label.confirm') })] }))] }) }));
+}

package/dist/AppDropzone/UploadService.d.ts

@@ -0,0 +1,6 @@
+import { UploadedFile } from './UploadedFile';
+declare function execute(data: FormData): Promise<import("axios").AxiosResponse<UploadedFile, any>>;
+declare const UploadService: {
+    execute: typeof execute;
+};
+export default UploadService;

package/dist/AppDropzone/UploadService.js

@@ -0,0 +1,18 @@
+import axios from 'axios';
+import Cookies from 'js-cookie';
+const JWT_TOKEN = 'jwt_token_tycho';
+const getJwtToken = () => {
+    const cookie = Cookies.get(JWT_TOKEN);
+    return cookie === 'undefined' ? '' : cookie;
+};
+function execute(data) {
+    const token = getJwtToken() || '';
+    const header = {
+        Authorization: `Bearer ${token}`,
+    };
+    return axios.post(import.meta.env.VITE_APP_UPLOAD_URL, data, {
+        headers: header,
+    });
+}
+const UploadService = { execute };
+export default UploadService;

package/dist/AppDropzone/UploadedFile.d.ts

@@ -0,0 +1,13 @@
+export interface UploadedFile {
+    url: string;
+    path: string;
+    filetype: string;
+    name: string;
+    original: string;
+    width?: number;
+    height?: number;
+}
+export interface UploadedPreview {
+    file: File;
+    preview: any;
+}

package/dist/AppDropzone/UploadedFile.js

@@ -0,0 +1 @@
+export {};

package/dist/AppDropzone/index.d.ts

@@ -0,0 +1,2 @@
+import AppDropzone from './AppDropzone';
+export default AppDropzone;

package/dist/AppDropzone/index.js

@@ -0,0 +1,2 @@
+import AppDropzone from './AppDropzone';
+export default AppDropzone;

package/dist/AppDropzone/style.scss

@@ -0,0 +1,35 @@
+.dropzone-container {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+
+  .dropzone {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    text-align: center;
+    width: 100%;
+    padding: var(--spacing-700);
+    border-radius: var(--radius-100);
+    border: 2px dashed var(--border-subtle-3);
+    background-color: var(--layer-layer-2);
+    cursor: pointer;
+  }
+
+  .preview {
+    margin: 0 auto;
+    width: 400px;
+    height: 400px;
+  }
+
+  .uploaded-message {
+    display: flex;
+    flex-direction: column;
+    width: 100%;
+    gap: 16px;
+    text-align: center;
+    border: 1px solid var(--border-subtle-3);
+    border-radius: var(--radius-100);
+    padding: 16px;
+  }
+}

package/dist/configs/Localization.d.ts

@@ -121,6 +121,13 @@ export declare const commonResources: {
             'platform.name': string;
             'platform.desc': string;
         };
+        upload: {
+            'label.dropzone': string;
+            'label.uploaded.file': string;
+            'label.confirm': string;
+            'modal.title': string;
+            'error.uploading.image': string;
+        };
     };
     'pt-BR': {
         common: {
@@ -241,6 +248,13 @@ export declare const commonResources: {
             'platform.name': string;
             'platform.desc': string;
         };
+        upload: {
+            'label.dropzone': string;
+            'label.uploaded.file': string;
+            'label.confirm': string;
+            'modal.title': string;
+            'error.uploading.image': string;
+        };
     };
     it: {
         header: {

package/dist/configs/Localization.js

@@ -1,22 +1,25 @@
 import i18n from 'i18next';
 import languageDetector from 'i18next-browser-languagedetector';
 import { initReactI18next } from 'react-i18next';
-import { ParticipantsTexts } from './localization/ParticipantsTexts';
-import { CommonTexts } from './localization/CommonTexts';
 import { CommentsTexts } from './localization/CommentsTexts';
+import { CommonTexts } from './localization/CommonTexts';
 import { HeaderTexts } from './localization/HeaderTexts';
+import { ParticipantsTexts } from './localization/ParticipantsTexts';
+import { UploadTexts } from './localization/UploadTexts';
 export const commonResources = {
     en: {
         common: CommonTexts.en,
         participants: ParticipantsTexts.en,
         comments: CommentsTexts.en,
         header: HeaderTexts.en,
+        upload: UploadTexts.en,
     },
     'pt-BR': {
         common: CommonTexts['pt-BR'],
         participants: ParticipantsTexts['pt-BR'],
         comments: CommentsTexts['pt-BR'],
         header: HeaderTexts['pt-BR'],
+        upload: UploadTexts['pt-BR'],
     },
     it: {
         header: HeaderTexts.it,

package/dist/configs/localization/UploadTexts.d.ts

@@ -0,0 +1,23 @@
+export declare const UploadTexts: {
+    en: {
+        'label.dropzone': string;
+        'label.uploaded.file': string;
+        'label.confirm': string;
+        'modal.title': string;
+        'error.uploading.image': string;
+    };
+    'pt-BR': {
+        'label.dropzone': string;
+        'label.uploaded.file': string;
+        'label.confirm': string;
+        'modal.title': string;
+        'error.uploading.image': string;
+    };
+    it: {
+        'label.dropzone': string;
+        'label.uploaded.file': string;
+        'label.confirm': string;
+        'modal.title': string;
+        'error.uploading.image': string;
+    };
+};

package/dist/configs/localization/UploadTexts.js

@@ -0,0 +1,23 @@
+export const UploadTexts = {
+    en: {
+        'label.dropzone': 'Drag and drop or click to upload a file',
+        'label.uploaded.file': 'You are uploading the following file',
+        'label.confirm': 'Press confirm to continue',
+        'modal.title': 'Upload a file',
+        'error.uploading.image': 'An error occurred while uploading a file. Contact the administrator.',
+    },
+    'pt-BR': {
+        'label.dropzone': 'Arraste e solte ou clique para enviar um arquivo.',
+        'label.uploaded.file': 'Você está enviando o seguinte arquivo',
+        'label.confirm': 'Pressione confirmar para continuar',
+        'modal.title': 'Upload de arquivo',
+        'error.uploading.image': 'Ocorreu um erro ao enviar o arquivo. Entre em contato com o administrador.',
+    },
+    it: {
+        'label.dropzone': 'Trascina e rilascia o clicca per caricare un file',
+        'label.uploaded.file': 'Stai caricando il seguente file',
+        'label.confirm': 'Premi conferma per continuare',
+        'modal.title': 'Carica un file',
+        'error.uploading.image': "Si è verificato un errore durante il caricamento del file. Contatta l'amministratore.",
+    },
+};

package/dist/configs/useCorpusUtils.d.ts

@@ -3,4 +3,5 @@ export declare const useCorpusUtils: () => {
     getCorpus: () => Corpus;
     setCorpus: (thisCorpus: Corpus | undefined) => void;
     hasCorpus: () => boolean;
+    hasParameter: (corpus: Corpus, param: string) => boolean;
 };

package/dist/configs/useCorpusUtils.js

@@ -13,9 +13,13 @@ export const useCorpusUtils = () => {
     const hasCorpus = () => {
         return state.corpus !== undefined;
     };
+    const hasParameter = (corpus, param) => {
+        return corpus.parameters[param];
+    };
     return {
         getCorpus,
         setCorpus,
         hasCorpus,
+        hasParameter,
     };
 };

package/dist/index.d.ts

@@ -1,5 +1,6 @@
 export { default as AppAnalytics } from './AppAnalytics';
 export { default as AppColorpicker } from './AppColorpicker';
+export { default as AppDropzone } from './AppDropzone';
 export { default as AppEditable } from './AppEditable';
 export { default as AppLoading } from './AppLoading';
 export { default as AppModal } from './AppModal';
@@ -24,7 +25,6 @@ export { commonResources } from './configs/Localization';
 export { KeyboardCustomLayouts } from './VirtualKeyboard/KeyboardCustomLayout';
 export { CorpusImageTypeNames } from './configs/CorpusImage';
 export { UserStatusNames } from './configs/User';
-export { default as CorpusUtils } from './functions/CorpusUtils';
 export { default as DateUtils } from './functions/DateUtils';
 export { default as FormUtils } from './functions/FormUtils';
 export { default as ImageUtils } from './functions/ImageUtils';
@@ -39,5 +39,6 @@ export type { Github } from './configs/Corpus';
 export type { FormFieldOption } from './AppEditable/FormFieldOption';
 export type { FieldOperations, FormField } from './AppEditable/FormField';
 export type { KeyboardLayout } from './VirtualKeyboard/KeyboardCustomLayout';
+export type { UploadedFile } from './AppDropzone/UploadedFile';
 export type { User } from './configs/User';
 export type { UserStatus } from './configs/User';

package/dist/index.js

@@ -1,5 +1,6 @@
 export { default as AppAnalytics } from './AppAnalytics';
 export { default as AppColorpicker } from './AppColorpicker';
+export { default as AppDropzone } from './AppDropzone';
 export { default as AppEditable } from './AppEditable';
 export { default as AppLoading } from './AppLoading';
 export { default as AppModal } from './AppModal';
@@ -24,7 +25,6 @@ export { commonResources } from './configs/Localization';
 export { KeyboardCustomLayouts } from './VirtualKeyboard/KeyboardCustomLayout';
 export { CorpusImageTypeNames } from './configs/CorpusImage';
 export { UserStatusNames } from './configs/User';
-export { default as CorpusUtils } from './functions/CorpusUtils';
 export { default as DateUtils } from './functions/DateUtils';
 export { default as FormUtils } from './functions/FormUtils';
 export { default as ImageUtils } from './functions/ImageUtils';

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "tycho-components",
   "private": false,
-  "version": "0.0.15-SNAPSHOT-10",
+  "version": "0.0.15-SNAPSHOT-12",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
   "exports": {

package/dist/functions/CorpusUtils.d.ts

@@ -1,5 +0,0 @@
-import { Corpus } from '../configs/Corpus';
-declare const CorpusUtils: {
-    hasParameter: (corpus: Corpus, param: string) => boolean;
-};
-export default CorpusUtils;

package/dist/functions/CorpusUtils.js

@@ -1,7 +0,0 @@
-const hasParameter = (corpus, param) => {
-    return corpus.parameters[param];
-};
-const CorpusUtils = {
-    hasParameter,
-};
-export default CorpusUtils;