testeranto
Version:
the AI powered BDD test framework for typescript projects
209 lines (208 loc) • 9.41 kB
JavaScript
;
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
if (k2 === undefined) k2 = k;
var desc = Object.getOwnPropertyDescriptor(m, k);
if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
desc = { enumerable: true, get: function() { return m[k]; } };
}
Object.defineProperty(o, k2, desc);
}) : (function(o, m, k, k2) {
if (k2 === undefined) k2 = k;
o[k2] = m[k];
}));
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
Object.defineProperty(o, "default", { enumerable: true, value: v });
}) : function(o, v) {
o["default"] = v;
});
var __importStar = (this && this.__importStar) || (function () {
var ownKeys = function(o) {
ownKeys = Object.getOwnPropertyNames || function (o) {
var ar = [];
for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
return ar;
};
return ownKeys(o);
};
return function (mod) {
if (mod && mod.__esModule) return mod;
var result = {};
if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
__setModuleDefault(result, mod);
return result;
};
})();
Object.defineProperty(exports, "__esModule", { value: true });
exports.DesignEditorPage = void 0;
/* eslint-disable @typescript-eslint/ban-ts-comment */
/* eslint-disable @typescript-eslint/no-explicit-any */
/* eslint-disable @typescript-eslint/no-unused-vars */
const react_1 = __importStar(require("react"));
const react_bootstrap_1 = require("react-bootstrap");
const file_saver_1 = require("file-saver");
const DesignEditorPage = () => {
const [projectId, setProjectId] = (0, react_1.useState)('default-project');
const [fileHandle, setFileHandle] = (0, react_1.useState)(null);
const handleSave = async () => {
try {
// if (!designEditorRef.current) {
// console.warn('Design editor ref not available');
// return;
// }
// Get and save current design state
// const designData = designEditorRef.current.saveDesign();
// if (!designData) {
// console.warn('No design data to save');
// return;
// }
// Include projectId in the saved data
// const fullDesign = {
// ...designData,
// projectId
// };
// Force immediate render after save
// if (designEditorRef.current) {
// designEditorRef.current.loadDesign(fullDesign);
// }
let newHandle;
if ('showSaveFilePicker' in window && window.showSaveFilePicker) {
try {
newHandle = await window.showSaveFilePicker({
types: [{
description: 'Design Files',
accept: {
'application/json': ['.json'],
},
}],
suggestedName: `${projectId}.json`
});
}
catch (err) {
console.warn('Error using showSaveFilePicker:', err);
// Fall back to traditional download
// const jsonData = JSON.stringify(fullDesign, null, 2);
// const blob = new Blob([jsonData], { type: 'application/json' });
// const url = URL.createObjectURL(blob);
// const a = document.createElement('a');
// a.href = url;
// a.download = `${projectId}.json`;
// a.click();
// URL.revokeObjectURL(url);
return;
}
}
else {
// Fall back to traditional download
// const jsonData = JSON.stringify(fullDesign, null, 2);
// const blob = new Blob([jsonData], { type: 'application/json' });
// const url = URL.createObjectURL(blob);
// const a = document.createElement('a');
// a.href = url;
// a.download = `${projectId}.json`;
// a.click();
// URL.revokeObjectURL(url);
return;
}
// const jsonData = JSON.stringify(fullDesign, null, 2);
// const writable = await newHandle.createWritable();
// await writable.write(jsonData);
// await writable.close();
// setFileHandle(newHandle);
// console.log('Design saved successfully:', fullDesign);
}
catch (err) {
console.error('Error saving file:', err);
if (err instanceof Error) {
console.error('Error details:', {
name: err.name,
message: err.message,
stack: err.stack
});
}
}
};
const [design, setDesign] = (0, react_1.useState)(null);
// const designEditorRef = useRef<DesignEditorRef>(null);
const handleOpen = async () => {
console.log('handleOpen triggered');
try {
// if (!window.showOpenFilePicker) {
// throw new Error('File System Access API not supported in this browser');
// }
console.log('Attempting to show file picker...');
let handle;
if ('showOpenFilePicker' in window) {
// @ts-ignore
[handle] = await window.showOpenFilePicker({
types: [{
description: 'Design Files',
accept: {
'application/json': ['.json'],
},
}],
multiple: false
});
}
else {
throw new Error('File System Access API not supported');
}
if (!handle) {
throw new Error('No file selected');
}
console.log('File handle obtained:', handle);
const file = await handle.getFile();
console.log('File object obtained:', file);
const contents = await file.text();
console.log('File contents loaded, length:', contents.length);
let loadedDesign = JSON.parse(contents);
console.log('Design parsed successfully:', loadedDesign);
// Ensure design has proper structure
if (!loadedDesign.objects || !loadedDesign.version) {
loadedDesign = Object.assign({ version: '1.0', background: '#ffffff', objects: [] }, loadedDesign);
}
// Validate objects array exists
if (!Array.isArray(loadedDesign.objects)) {
loadedDesign.objects = [];
}
const newProjectId = loadedDesign.projectId || 'default-project';
console.log('Setting projectId to:', newProjectId);
setProjectId(newProjectId);
console.log('Setting design state...');
setDesign(loadedDesign);
setFileHandle(handle);
// Load the design into the editor
// if (designEditorRef.current) {
// console.log('Calling loadDesign on editor ref with:', loadedDesign);
// designEditorRef.current.loadDesign(loadedDesign);
// } else {
// console.warn('designEditorRef.current is null');
// }
}
catch (err) {
console.error('Error opening file:', err);
if (err instanceof Error) {
console.error('Error details:', {
name: err.name,
message: err.message,
stack: err.stack
});
}
}
};
const handleExport = () => {
const designData = JSON.stringify({ projectId }, null, 2);
const blob = new Blob([designData], { type: 'application/json' });
(0, file_saver_1.saveAs)(blob, `${projectId}.json`);
};
return (react_1.default.createElement(react_bootstrap_1.Container, { fluid: true },
react_1.default.createElement(react_bootstrap_1.Row, { className: "mb-3" },
react_1.default.createElement(react_bootstrap_1.Col, null,
react_1.default.createElement("h1", null, "Design Editor"),
react_1.default.createElement("div", { className: "d-flex gap-2" },
react_1.default.createElement(react_bootstrap_1.Button, { variant: "primary", onClick: handleOpen }, "Open"),
react_1.default.createElement(react_bootstrap_1.Button, { variant: "success", onClick: handleSave }, "Save"),
react_1.default.createElement(react_bootstrap_1.Button, { variant: "secondary", onClick: handleExport }, "Export")))),
react_1.default.createElement(react_bootstrap_1.Row, null,
react_1.default.createElement(react_bootstrap_1.Col, null))));
};
exports.DesignEditorPage = DesignEditorPage;