Actually generate and save JSON file

This commit is contained in:
Badri Sunderarajan 2022-08-05 12:58:07 +05:30
parent 9adb072dc3
commit 8c07139112
3 changed files with 54 additions and 3 deletions

View file

@ -26,6 +26,7 @@
}, },
"dependencies": { "dependencies": {
"email-validator": "^2.0.4", "email-validator": "^2.0.4",
"file-saver": "^2.0.5",
"sirv-cli": "^2.0.0", "sirv-cli": "^2.0.0",
"slug": "^5.3.0" "slug": "^5.3.0"
} }

View file

@ -1,5 +1,6 @@
<script lang="ts"> <script lang="ts">
import * as EmailValidator from 'email-validator' import * as EmailValidator from 'email-validator'
import saveAs from 'file-saver'
import Slug from 'slug' import Slug from 'slug'
export let name: string; export let name: string;
@ -10,7 +11,39 @@
let slugIsAuto = true; let slugIsAuto = true;
let errors = []; let errors = [];
function generateAuthor(e) { let file: file;
function generateAuthor() {
/*
Generates the author JSON. Note that this
function is very naïve and doesn't perform
any background checks! Please make sure
those have been performed already.
*/
let data = {
data: {
users: [
{
id: 1,
slug: slug,
bio: bio,
email: email,
name: name,
profile_image: ""
},
],
},
meta: {
exported_on: new Date(), // That's today!
version: '2.14.0',
}
}
return JSON.stringify(data)
}
function processForm(e) {
e.preventDefault() e.preventDefault()
// Check the formatting // Check the formatting
@ -35,7 +68,19 @@
// Validate slug formatting // Validate slug formatting
if (!errors.length) { if (!errors.length) {
alert(`Name: ${name} email, ${email} has slug ${slug} and bio ${bio}`) // Generate the file!
file = new File([
generateAuthor()
],
`user-${slug}.json`,
{
type: 'application/json',
})
// Use FileSaver.js magic to save it
saveAs(file, `user-${slug}.json`)
console.log(`Name: ${name} email, ${email} has slug ${slug} and bio ${bio}`)
} }
} }
@ -120,7 +165,7 @@
<input id="input-bio" name="bio" bind:value={bio}/> <input id="input-bio" name="bio" bind:value={bio}/>
</div> </div>
<button on:click={generateAuthor}>Generate</button> <button on:click={processForm}>Generate</button>
</fieldset> </fieldset>
</form> </form>

View file

@ -357,6 +357,11 @@ fastq@^1.6.0:
dependencies: dependencies:
reusify "^1.0.4" reusify "^1.0.4"
file-saver@^2.0.5:
version "2.0.5"
resolved "https://registry.yarnpkg.com/file-saver/-/file-saver-2.0.5.tgz#d61cfe2ce059f414d899e9dd6d4107ee25670c38"
integrity sha512-P9bmyZ3h/PRG+Nzga+rbdI4OEpNDzAVyy74uVO9ATgzLK6VtAsYybF/+TOCvrc0MO793d6+42lLyZTw7/ArVzA==
fill-range@^7.0.1: fill-range@^7.0.1:
version "7.0.1" version "7.0.1"
resolved "https://registry.yarnpkg.com/fill-range/-/fill-range-7.0.1.tgz#1919a6a7c75fe38b2c7c77e5198535da9acdda40" resolved "https://registry.yarnpkg.com/fill-range/-/fill-range-7.0.1.tgz#1919a6a7c75fe38b2c7c77e5198535da9acdda40"