refactor(base64-to-file): clean validation to convert base64 to file

This commit is contained in:
Corentin Thomasset 2022-07-29 10:56:04 +02:00
parent 5f03619ab4
commit 750a76b00f
No known key found for this signature in database
GPG key ID: 3103EB5E79496F9C
4 changed files with 113 additions and 22 deletions

View file

@ -1,8 +1,16 @@
<template>
<n-card title="Base64 to file">
<n-input v-model:value="base64Input" type="textarea" placeholder="Put your base64 file string here..." rows="5" />
<n-form-item
:feedback="base64InputValidation.message"
:validation-status="base64InputValidation.status"
:show-label="false"
>
<n-input v-model:value="base64Input" type="textarea" placeholder="Put your base64 file string here..." rows="5" />
</n-form-item>
<n-space justify="center">
<n-button secondary @click="download()"> Download file </n-button>
<n-button :disabled="base64Input === '' || !base64InputValidation.isValid" secondary @click="downloadFile()">
Download file
</n-button>
</n-space>
</n-card>
@ -26,6 +34,7 @@
<script setup lang="ts">
import { useCopy } from '@/composable/copy';
import { useDownloadFileFromBase64 } from '@/composable/downloadBase64';
import { useValidation } from '@/composable/validation';
import { Upload } from '@vicons/tabler';
import { useBase64 } from '@vueuse/core';
import type { UploadFileInfo } from 'naive-ui';
@ -33,6 +42,25 @@ import { ref, type Ref } from 'vue';
const base64Input = ref('');
const { download } = useDownloadFileFromBase64({ source: base64Input });
const base64InputValidation = useValidation({
source: base64Input,
rules: [
{
message: 'Invalid base 64 string',
validator: (value) => window.atob(value.replace(/^data:.*?;base64,/, '')),
},
],
});
function downloadFile() {
if (!base64InputValidation.isValid) return;
try {
download();
} catch (_) {
//
}
}
const fileList = ref();
const fileInput = ref() as Ref<File>;