Ryan/Reactive-Resume
1
0
Fork 0
mirror of https://github.com/AmruthPillai/Reactive-Resume.git synced 2025-11-10 04:22:27 +10:00
Code Issues Packages Projects Releases Wiki Activity

resolve formatting and linting issues

Browse Source
This commit is contained in:
Amruth Pillai
2025-01-12 16:35:35 +01:00
parent 39daed3502
commit 3ae651fece
2 changed files with 15 additions and 22 deletions
Download Patch File Download Diff File Expand all files Collapse all files

19
apps/artboard/src/pages/builder.tsx
View File

@ -9,13 +9,14 @@ import { useArtboardStore } from "../store/artboard";
import { getTemplate } from "../templates";
export const BuilderLayout = () => {
const transformRef = useRef<ReactZoomPanPinchRef>(null);
const format = useArtboardStore((state) => state.resume.metadata.page.format);
const layout = useArtboardStore((state) => state.resume.metadata.layout);
const template = useArtboardStore((state) => state.resume.metadata.template as Template);
const [wheelPanning, setWheelPanning] = useState(true);
const transformRef = useRef<ReactZoomPanPinchRef>(null);
const layout = useArtboardStore((state) => state.resume.metadata.layout);
const format = useArtboardStore((state) => state.resume.metadata.page.format);
const template = useArtboardStore((state) => state.resume.metadata.template as Template);
const Template = useMemo(() => getTemplate(template), [template]);
useEffect(() => {
@ -49,12 +50,8 @@ export const BuilderLayout = () => {
minScale={0.4}
initialScale={0.8}
limitToBounds={false}
panning={{
wheelPanning: wheelPanning,
}}
wheel={{
wheelDisabled: wheelPanning,
}}
wheel={{ wheelDisabled: wheelPanning }}
panning={{ wheelPanning: wheelPanning }}
>
<TransformComponent
wrapperClass="!w-screen !h-screen"

18
apps/client/src/pages/builder/_components/toolbar.tsx
View File

@ -16,12 +16,12 @@ import {
} from "@phosphor-icons/react";
import { Button, Separator, Toggle, Tooltip } from "@reactive-resume/ui";
import { motion } from "framer-motion";
import { useState } from "react";
import { useToast } from "@/client/hooks/use-toast";
import { usePrintResume } from "@/client/services/resume";
import { useBuilderStore } from "@/client/stores/builder";
import { useResumeStore, useTemporalResumeStore } from "@/client/stores/resume";
import { useState } from "react";
const openInNewTab = (url: string) => {
const win = window.open(url, "_blank");
@ -30,11 +30,13 @@ const openInNewTab = (url: string) => {
export const BuilderToolbar = () => {
const { toast } = useToast();
const [panMode, setPanMode] = useState<boolean>(true);
const setValue = useResumeStore((state) => state.setValue);
const undo = useTemporalResumeStore((state) => state.undo);
const redo = useTemporalResumeStore((state) => state.redo);
const frameRef = useBuilderStore((state) => state.frame.ref);
const [panMode, setPanMode] = useState<boolean>(true);
const id = useResumeStore((state) => state.resume.id);
const isPublic = useResumeStore((state) => state.resume.visibility === "public");
@ -64,8 +66,8 @@ export const BuilderToolbar = () => {
const onResetView = () => frameRef?.contentWindow?.postMessage({ type: "RESET_VIEW" }, "*");
const onCenterView = () => frameRef?.contentWindow?.postMessage({ type: "CENTER_VIEW" }, "*");
const onTogglePanMode = () => {
setPanMode(!panMode); // local button state
frameRef?.contentWindow?.postMessage({ type: "TOGGLE_PAN_MODE", panMode: !panMode }, "*"); // toggle artboard state
setPanMode(!panMode);
frameRef?.contentWindow?.postMessage({ type: "TOGGLE_PAN_MODE", panMode: !panMode }, "*");
};
return (
@ -99,13 +101,7 @@ export const BuilderToolbar = () => {
<Separator orientation="vertical" className="h-9" />
<Tooltip
content={
panMode
? t`Scroll to Pan (Click to switch to Zoom)`
: t`Scroll to Zoom (Click to switch to Pan)`
}
>
<Tooltip content={panMode ? t`Scroll to Pan` : t`Scroll to Zoom`}>
<Toggle className="rounded-none" pressed={panMode} onPressedChange={onTogglePanMode}>
{panMode ? <ArrowsOutCardinal /> : <MagnifyingGlass />}
</Toggle>