mirror of
https://github.com/eliasstepanik/strudel-docker.git
synced 2026-01-21 02:28:34 +00:00
mutate viewing pattern
This commit is contained in:
parent
02b9bd82cf
commit
3604d3940c
@ -2,13 +2,13 @@ import { DocumentDuplicateIcon, PencilSquareIcon, TrashIcon } from '@heroicons/r
|
|||||||
import { useMemo } from 'react';
|
import { useMemo } from 'react';
|
||||||
import {
|
import {
|
||||||
clearUserPatterns,
|
clearUserPatterns,
|
||||||
deleteActivePattern,
|
deletePattern,
|
||||||
duplicateActivePattern,
|
duplicatePattern,
|
||||||
exportPatterns,
|
exportPatterns,
|
||||||
getUserPattern,
|
getUserPattern,
|
||||||
importPatterns,
|
importPatterns,
|
||||||
newUserPattern,
|
newUserPattern,
|
||||||
renameActivePattern,
|
renamePattern,
|
||||||
useActivePattern,
|
useActivePattern,
|
||||||
useViewingPattern,
|
useViewingPattern,
|
||||||
useSettings,
|
useSettings,
|
||||||
@ -66,21 +66,21 @@ export function PatternsTab({ context }) {
|
|||||||
return (
|
return (
|
||||||
<div className="px-4 w-full dark:text-white text-stone-900 space-y-4 pb-4">
|
<div className="px-4 w-full dark:text-white text-stone-900 space-y-4 pb-4">
|
||||||
<section>
|
<section>
|
||||||
{activePattern && (
|
{viewingPattern && (
|
||||||
<div className="flex items-center mb-2 space-x-2 overflow-auto">
|
<div className="flex items-center mb-2 space-x-2 overflow-auto">
|
||||||
<h1 className="text-xl">{activePattern}</h1>
|
<h1 className="text-xl">{viewingPattern}</h1>
|
||||||
<div className="space-x-4 flex w-min">
|
<div className="space-x-4 flex w-min">
|
||||||
{!isExample && (
|
{!isExample && (
|
||||||
<button className="hover:opacity-50" onClick={() => renameActivePattern()} title="Rename">
|
<button className="hover:opacity-50" onClick={() => renamePattern(viewingPattern)} title="Rename">
|
||||||
<PencilSquareIcon className="w-5 h-5" />
|
<PencilSquareIcon className="w-5 h-5" />
|
||||||
{/* <PencilIcon className="w-5 h-5" /> */}
|
{/* <PencilIcon className="w-5 h-5" /> */}
|
||||||
</button>
|
</button>
|
||||||
)}
|
)}
|
||||||
<button className="hover:opacity-50" onClick={() => duplicateActivePattern()} title="Duplicate">
|
<button className="hover:opacity-50" onClick={() => duplicatePattern(viewingPattern)} title="Duplicate">
|
||||||
<DocumentDuplicateIcon className="w-5 h-5" />
|
<DocumentDuplicateIcon className="w-5 h-5" />
|
||||||
</button>
|
</button>
|
||||||
{!isExample && (
|
{!isExample && (
|
||||||
<button className="hover:opacity-50" onClick={() => deleteActivePattern()} title="Delete">
|
<button className="hover:opacity-50" onClick={() => deletePattern(viewingPattern)} title="Delete">
|
||||||
<TrashIcon className="w-5 h-5" />
|
<TrashIcon className="w-5 h-5" />
|
||||||
</button>
|
</button>
|
||||||
)}
|
)}
|
||||||
|
|||||||
@ -152,14 +152,13 @@ export function getUserPattern(key) {
|
|||||||
return userPatterns[key];
|
return userPatterns[key];
|
||||||
}
|
}
|
||||||
|
|
||||||
export function renameActivePattern() {
|
export function renamePattern(pattern) {
|
||||||
let activePattern = getActivePattern();
|
|
||||||
let userPatterns = getUserPatterns();
|
let userPatterns = getUserPatterns();
|
||||||
if (!userPatterns[activePattern]) {
|
if (!userPatterns[pattern]) {
|
||||||
alert('Cannot rename examples');
|
alert('Cannot rename examples');
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
const newName = prompt('Enter new name', activePattern);
|
const newName = prompt('Enter new name', pattern);
|
||||||
if (newName === null) {
|
if (newName === null) {
|
||||||
// canceled
|
// canceled
|
||||||
return;
|
return;
|
||||||
@ -168,10 +167,10 @@ export function renameActivePattern() {
|
|||||||
alert('Name already taken!');
|
alert('Name already taken!');
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
userPatterns[newName] = userPatterns[activePattern]; // copy code
|
userPatterns[newName] = userPatterns[pattern]; // copy code
|
||||||
delete userPatterns[activePattern];
|
delete userPatterns[pattern];
|
||||||
setUserPatterns({ ...userPatterns });
|
setUserPatterns({ ...userPatterns });
|
||||||
setActivePattern(newName);
|
setViewingPattern(newName);
|
||||||
}
|
}
|
||||||
|
|
||||||
export function updateUserCode(code) {
|
export function updateUserCode(code) {
|
||||||
@ -196,35 +195,34 @@ export function updateUserCode(code) {
|
|||||||
setUserPatterns({ ...userPatterns, [activePattern]: { code } });
|
setUserPatterns({ ...userPatterns, [activePattern]: { code } });
|
||||||
}
|
}
|
||||||
|
|
||||||
export function deleteActivePattern() {
|
export function deletePattern(pattern) {
|
||||||
let activePattern = getActivePattern();
|
|
||||||
if (!activePattern) {
|
if (!pattern) {
|
||||||
console.warn('cannot delete: no pattern selected');
|
console.warn('cannot delete: no pattern selected');
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
const userPatterns = getUserPatterns();
|
const userPatterns = getUserPatterns();
|
||||||
if (!userPatterns[activePattern]) {
|
if (!userPatterns[pattern]) {
|
||||||
alert('Cannot delete examples');
|
alert('Cannot delete examples');
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
if (!confirm(`Really delete the selected pattern "${activePattern}"?`)) {
|
if (!confirm(`Really delete the selected pattern "${pattern}"?`)) {
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
setUserPatterns(Object.fromEntries(Object.entries(userPatterns).filter(([key]) => key !== activePattern)));
|
setUserPatterns(Object.fromEntries(Object.entries(userPatterns).filter(([key]) => key !== pattern)));
|
||||||
setActivePattern('');
|
setViewingPattern('');
|
||||||
}
|
}
|
||||||
|
|
||||||
export function duplicateActivePattern() {
|
export function duplicatePattern(pattern) {
|
||||||
let activePattern = getActivePattern();
|
|
||||||
let latestCode = getSetting('latestCode');
|
let latestCode = getSetting('latestCode');
|
||||||
if (!activePattern) {
|
if (!pattern) {
|
||||||
console.warn('cannot duplicate: no pattern selected');
|
console.warn('cannot duplicate: no pattern selected');
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
const userPatterns = getUserPatterns();
|
const userPatterns = getUserPatterns();
|
||||||
activePattern = getNextCloneName(activePattern);
|
const newPattern = getNextCloneName(pattern);
|
||||||
setUserPatterns({ ...userPatterns, [activePattern]: { code: latestCode } });
|
setUserPatterns({ ...userPatterns, [newPattern]: { code: latestCode } });
|
||||||
setActivePattern(activePattern);
|
setViewingPattern(newPattern);
|
||||||
}
|
}
|
||||||
|
|
||||||
export async function importPatterns(fileList) {
|
export async function importPatterns(fileList) {
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user