slim down template

- move import + export logic to settings.mjs
This commit is contained in:
Felix Roos 2023-12-10 14:28:27 +01:00
parent 845571a716
commit f19ac748e6
2 changed files with 39 additions and 38 deletions

View File

@ -1,20 +1,18 @@
import { DocumentDuplicateIcon, PencilSquareIcon, TrashIcon } from '@heroicons/react/20/solid';
import { useMemo } from 'react'; import { useMemo } from 'react';
import * as tunes from '../tunes.mjs';
import { import {
useSettings,
clearUserPatterns, clearUserPatterns,
newUserPattern,
setActivePattern,
deleteActivePattern, deleteActivePattern,
duplicateActivePattern, duplicateActivePattern,
exportPatterns,
getUserPattern, getUserPattern,
getUserPatterns, importPatterns,
newUserPattern,
renameActivePattern, renameActivePattern,
addUserPattern, setActivePattern,
setUserPatterns, useSettings,
} from '../../settings.mjs'; } from '../../settings.mjs';
import { logger } from '@strudel.cycles/core'; import * as tunes from '../tunes.mjs';
import { DocumentDuplicateIcon, PencilSquareIcon, TrashIcon } from '@heroicons/react/20/solid';
function classNames(...classes) { function classNames(...classes) {
return classes.filter(Boolean).join(' '); return classes.filter(Boolean).join(' ');
@ -85,38 +83,11 @@ export function PatternsTab({ context }) {
type="file" type="file"
multiple multiple
accept="text/plain,application/json" accept="text/plain,application/json"
onChange={async (e) => { onChange={(e) => importPatterns(e.target.files)}
const files = Array.from(e.target.files);
await Promise.all(
files.map(async (file, i) => {
const content = await file.text();
if (file.type === 'application/json') {
const userPatterns = getUserPatterns() || {};
setUserPatterns({ ...userPatterns, ...JSON.parse(content) });
} else if (file.type === 'text/plain') {
const name = file.name.replace(/\.[^/.]+$/, '');
addUserPattern(name, { code: content });
}
}),
);
logger(`import done!`);
}}
/> />
import import
</label> </label>
<button <button className="hover:opacity-50" onClick={() => exportPatterns()}>
className="hover:opacity-50"
onClick={() => {
const blob = new Blob([JSON.stringify(userPatterns)], { type: 'application/json' });
const downloadLink = document.createElement('a');
downloadLink.href = window.URL.createObjectURL(blob);
const date = new Date().toISOString().split('T')[0];
downloadLink.download = `strudel_patterns_${date}.json`;
document.body.appendChild(downloadLink);
downloadLink.click();
document.body.removeChild(downloadLink);
}}
>
export export
</button> </button>
</div> </div>

View File

@ -2,6 +2,7 @@ import { persistentMap } from '@nanostores/persistent';
import { useStore } from '@nanostores/react'; import { useStore } from '@nanostores/react';
import { register } from '@strudel.cycles/core'; import { register } from '@strudel.cycles/core';
import * as tunes from './repl/tunes.mjs'; import * as tunes from './repl/tunes.mjs';
import { logger } from '@strudel.cycles/core';
export const defaultSettings = { export const defaultSettings = {
activeFooter: 'intro', activeFooter: 'intro',
@ -195,3 +196,32 @@ export function setActivePattern(key) {
} }
export function importUserPatternJSON(jsonString) {} export function importUserPatternJSON(jsonString) {}
export async function importPatterns(fileList) {
const files = Array.from(fileList);
await Promise.all(
files.map(async (file, i) => {
const content = await file.text();
if (file.type === 'application/json') {
const userPatterns = getUserPatterns() || {};
setUserPatterns({ ...userPatterns, ...JSON.parse(content) });
} else if (file.type === 'text/plain') {
const name = file.name.replace(/\.[^/.]+$/, '');
addUserPattern(name, { code: content });
}
}),
);
logger(`import done!`);
}
export async function exportPatterns() {
const userPatterns = getUserPatterns() || {};
const blob = new Blob([JSON.stringify(userPatterns)], { type: 'application/json' });
const downloadLink = document.createElement('a');
downloadLink.href = window.URL.createObjectURL(blob);
const date = new Date().toISOString().split('T')[0];
downloadLink.download = `strudel_patterns_${date}.json`;
document.body.appendChild(downloadLink);
downloadLink.click();
document.body.removeChild(downloadLink);
}