mirror of
https://github.com/ramvignesh-b/pi-ku.git
synced 2026-05-04 08:56:52 +00:00
refactor: improve type safety for canvas data objects and remove unused FabricObject import
This commit is contained in:
@@ -3,9 +3,11 @@ import { forwardRef, useEffect, useImperativeHandle, useRef } from "react";
|
|||||||
|
|
||||||
const PAD = 36;
|
const PAD = 36;
|
||||||
|
|
||||||
|
type CanvasJSON = ReturnType<fabric.Canvas["toJSON"]>;
|
||||||
|
|
||||||
export type CanvasTools = {
|
export type CanvasTools = {
|
||||||
addImage: (url: string, file: File) => void;
|
addImage: (url: string, file: File) => void;
|
||||||
getData: () => { objects: any[] };
|
getData: () => { objects: CanvasJSON["objects"] }; // no-any hack :/
|
||||||
getJsonData: () => string;
|
getJsonData: () => string;
|
||||||
getImages: () => { src: string; file: File }[];
|
getImages: () => { src: string; file: File }[];
|
||||||
};
|
};
|
||||||
|
|||||||
@@ -4,7 +4,6 @@ import {
|
|||||||
LockIcon,
|
LockIcon,
|
||||||
TrayIcon,
|
TrayIcon,
|
||||||
} from "@phosphor-icons/react";
|
} from "@phosphor-icons/react";
|
||||||
import type { FabricObject } from "fabric";
|
|
||||||
import { useRef, useState } from "react";
|
import { useRef, useState } from "react";
|
||||||
import { useNavigate, useParams } from "react-router-dom";
|
import { useNavigate, useParams } from "react-router-dom";
|
||||||
import { api } from "../api/apiClient";
|
import { api } from "../api/apiClient";
|
||||||
@@ -73,10 +72,14 @@ export default function Editor() {
|
|||||||
}
|
}
|
||||||
|
|
||||||
// replace image src with encrypted image filename
|
// replace image src with encrypted image filename
|
||||||
const canvasData = canvasRef.current?.getData() ?? { objects: [] };
|
const canvasData = canvasRef.current?.getData();
|
||||||
canvasData.objects = canvasData.objects?.map(
|
canvasData.objects = canvasData.objects?.map(
|
||||||
(obj: FabricObject & { src: string }) =>
|
(
|
||||||
obj.type === "Image" ? { ...obj, src: imageEncMap.get(obj.src) } : obj,
|
obj: Record<string, unknown>, // fabric is too quirky for any other type
|
||||||
|
) =>
|
||||||
|
obj.type === "Image"
|
||||||
|
? { ...obj, src: imageEncMap.get(obj.src as string) }
|
||||||
|
: obj,
|
||||||
);
|
);
|
||||||
|
|
||||||
const encrypted_letter = await cryptoUtils.encryptLetter(
|
const encrypted_letter = await cryptoUtils.encryptLetter(
|
||||||
|
|||||||
Reference in New Issue
Block a user