From ac30edffd6b1c2ae99df4d3733b4ec0bda0acf30 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?V=C3=ADctor=20Losada=20Hern=C3=A1ndez?= Date: Sun, 23 Aug 2026 20:16:10 +0200 Subject: [PATCH] lint --- client/homebrew/editor/editor.jsx | 236 +++++++++++++++--------------- 1 file changed, 115 insertions(+), 121 deletions(-) diff --git a/client/homebrew/editor/editor.jsx b/client/homebrew/editor/editor.jsx index 18cc59913..7daf8511b 100644 --- a/client/homebrew/editor/editor.jsx +++ b/client/homebrew/editor/editor.jsx @@ -1,22 +1,22 @@ -import "./editor.less"; -import React, { useState, useRef, useEffect, forwardRef, useImperativeHandle } from "react"; -import dedent from "dedent"; +import './editor.less'; +import React, { useState, useRef, useEffect, forwardRef, useImperativeHandle } from 'react'; +import dedent from 'dedent'; -import CodeEditor from "@components/codeEditor/codeEditor.jsx"; -import SnippetBar from "./snippetbar/snippetbar.jsx"; -import MetadataEditor from "./metadataEditor/metadataEditor.jsx"; +import CodeEditor from '@components/codeEditor/codeEditor.jsx'; +import SnippetBar from './snippetbar/snippetbar.jsx'; +import MetadataEditor from './metadataEditor/metadataEditor.jsx'; -const EDITOR_THEME_KEY = "HB_editor_theme"; +const EDITOR_THEME_KEY = 'HB_editor_theme'; -import defaultCM5Theme from "@themes/codeMirror/default.js"; -import darkbrewery from "@themes/codeMirror/darkbrewery.js"; -import cm5Themes from "codemirror-5-themes"; +import defaultCM5Theme from '@themes/codeMirror/default.js'; +import darkbrewery from '@themes/codeMirror/darkbrewery.js'; +import cm5Themes from 'codemirror-5-themes'; const themes = { default: defaultCM5Theme, ...cm5Themes, darkbrewery }; const EditorThemes = Object.entries(themes) - .filter(([name, value]) => Array.isArray(value) && !name.endsWith("Init") && !name.endsWith("Style")) - .map(([name]) => name); + .filter(([name, value])=>Array.isArray(value) && !name.endsWith('Init') && !name.endsWith('Style')) + .map(([name])=>name); //const PAGEBREAK_REGEX_V3 = /^(?=\\page(?:break)?(?: *{[^\n{}]*})?$)/m; //const SNIPPETBREAK_REGEX_V3 = /^\\snippet\ .*$/; @@ -43,14 +43,14 @@ const Editor = forwardRef( { brew = {}, - onBrewChange = () => {}, - reportError = () => {}, + onBrewChange = ()=>{}, + reportError = ()=>{}, - onCursorPageChange = () => {}, - onViewPageChange = () => {}, + onCursorPageChange = ()=>{}, + onViewPageChange = ()=>{}, - editorTheme = "default", - renderer = "legacy", + editorTheme = 'default', + renderer = 'legacy', moveBrew, moveSource, @@ -67,53 +67,47 @@ const Editor = forwardRef( currentBrewRendererPageNum = 1, }, ref, - ) => { + )=>{ const [currentEditorTheme, setEditorTheme] = useState(editorTheme); - const [view, setView] = useState("text"); // 'text', 'style', 'meta', 'snippet' + const [view, setView] = useState('text'); // 'text', 'style', 'meta', 'snippet' const [snippetBarHeight, setSnippetBarHeight] = useState(26); const editor = useRef(null); const codeEditor = useRef(null); const throttleBrewMove = useRef(null); - const isText = () => { - return view === "text"; - }; - const isStyle = () => { - return view === "style"; - }; - const isMeta = () => { - return view === "meta"; - }; - const isSnip = () => { - return view === "snippet"; - }; + const isText = ()=>isView('text'); + const isStyle = ()=>isView('style'); + const isMeta = ()=>isView('meta'); + const isSnip = ()=>isView('snippet'); + + const isView = (name)=>view === name; //componentDidMount equivalent - useEffect(() => { - const brewRenderer = document.getElementById("BrewRenderer"); - brewRenderer.onload = () => brewRenderer.contentDocument?.addEventListener("keydown", handleControlKeys); - document.addEventListener("keydown", handleControlKeys); + useEffect(()=>{ + const brewRenderer = document.getElementById('BrewRenderer'); + brewRenderer.onload = ()=>brewRenderer.contentDocument?.addEventListener('keydown', handleControlKeys); + document.addEventListener('keydown', handleControlKeys); const editorTheme = window.localStorage.getItem(EDITOR_THEME_KEY); - if (editorTheme && EditorThemes.includes(editorTheme)) { + if(editorTheme && EditorThemes.includes(editorTheme)) { setEditorTheme(editorTheme); } else { - setEditorTheme("default"); + setEditorTheme('default'); } - const snippetBar = document.querySelector(".editor > .snippetBar"); - if (!snippetBar) return; + const snippetBar = document.querySelector('.editor > .snippetBar'); + if(!snippetBar) return; - const resizeObserver = new ResizeObserver((entries) => { - const height = document.querySelector(".editor > .snippetBar").offsetHeight; + const resizeObserver = new ResizeObserver((entries)=>{ + const height = document.querySelector('.editor > .snippetBar').offsetHeight; setSnippetBarHeight(height); }); resizeObserver.observe(snippetBar); //ComponentWillUnmount equivalent - return () => { - if (resizeObserver) resizeObserver.disconnect(); + return ()=>{ + if(resizeObserver) resizeObserver.disconnect(); }; }, []); @@ -126,23 +120,23 @@ const Editor = forwardRef( }); //componentDidUpdate Equivalent - useEffect(() => { + useEffect(()=>{ const prev = previousProps.current; - if (prev.moveBrew !== moveBrew) { + if(prev.moveBrew !== moveBrew) { brewJump(); } - if (prev.moveSource !== moveSource) { + if(prev.moveSource !== moveSource) { sourceJump(); } - if (liveScroll) { - if (prev.currentBrewRendererPageNum !== currentBrewRendererPageNum) { + if(liveScroll) { + if(prev.currentBrewRendererPageNum !== currentBrewRendererPageNum) { sourceJump(currentBrewRendererPageNum, false); - } else if (prev.currentEditorViewPageNum !== currentEditorViewPageNum) { + } else if(prev.currentEditorViewPageNum !== currentEditorViewPageNum) { brewJump(currentEditorViewPageNum, false); - } else if (prev.currentEditorCursorPageNum !== currentEditorCursorPageNum) { + } else if(prev.currentEditorCursorPageNum !== currentEditorCursorPageNum) { brewJump(currentEditorCursorPageNum, false); } } @@ -163,95 +157,95 @@ const Editor = forwardRef( currentEditorCursorPageNum, ]); - const handleControlKeys = (e) => { - if (!(e.ctrlKey && e.metaKey && e.shiftKey)) return; + const handleControlKeys = (e)=>{ + if(!(e.ctrlKey && e.metaKey && e.shiftKey)) return; const LEFTARROW_KEY = 37; const RIGHTARROW_KEY = 39; - if (e.keyCode == RIGHTARROW_KEY) brewJump(); - if (e.keyCode == LEFTARROW_KEY) sourceJump(); - if (e.keyCode == LEFTARROW_KEY || e.keyCode == RIGHTARROW_KEY) { + if(e.keyCode == RIGHTARROW_KEY) brewJump(); + if(e.keyCode == LEFTARROW_KEY) sourceJump(); + if(e.keyCode == LEFTARROW_KEY || e.keyCode == RIGHTARROW_KEY) { e.stopPropagation(); e.preventDefault(); } }; - const updateCurrentCursorPage = (pageNumber) => { + const updateCurrentCursorPage = (pageNumber)=>{ onCursorPageChange(pageNumber); }; - const updateCurrentViewPage = (pageNumber) => { + const updateCurrentViewPage = (pageNumber)=>{ onViewPageChange(pageNumber); }; - const handleInject = (injectText) => { + const handleInject = (injectText)=>{ codeEditor.current?.injectText(injectText); }; - const handleViewChange = (newView) => { - setMoveArrows(newView === "text"); + const handleViewChange = (newView)=>{ + setMoveArrows(newView === 'text'); setView(newView); }; - useEffect(() => { + useEffect(()=>{ codeEditor.current?.focus(); }, [view]); - const brewJump = (targetPage = currentEditorCursorPageNum, smooth = true) => { - if (!window || !isText() || isJumping || jumpSource === "source") return; + const brewJump = (targetPage = currentEditorCursorPageNum, smooth = true)=>{ + if(!window || !isText() || isJumping || jumpSource === 'source') return; const brewRenderer = - window.frames["BrewRenderer"].contentDocument.getElementsByClassName("brewRenderer")[0]; + window.frames['BrewRenderer'].contentDocument.getElementsByClassName('brewRenderer')[0]; const currentPos = brewRenderer.scrollTop; - const targetPos = window.frames["BrewRenderer"].contentDocument + const targetPos = window.frames['BrewRenderer'].contentDocument .getElementById(`p${targetPage}`) .getBoundingClientRect().top; let scrollingTimeout; - const checkIfScrollComplete = () => { + const checkIfScrollComplete = ()=>{ clearTimeout(scrollingTimeout); - scrollingTimeout = setTimeout(() => { + scrollingTimeout = setTimeout(()=>{ isJumping = false; jumpSource = null; - brewRenderer.removeEventListener("scroll", checkIfScrollComplete); + brewRenderer.removeEventListener('scroll', checkIfScrollComplete); }, 150); }; isJumping = true; - jumpSource = "brew"; + jumpSource = 'brew'; checkIfScrollComplete(); - brewRenderer.addEventListener("scroll", checkIfScrollComplete); + brewRenderer.addEventListener('scroll', checkIfScrollComplete); - if (smooth) { + if(smooth) { const bouncePos = targetPos >= 0 ? -30 : 30; const bounceDelay = 100; const scrollDelay = 500; - if (!throttleBrewMove.current) { + if(!throttleBrewMove.current) { throttleBrewMove.current = _.throttle( - (currentPos, bouncePos, targetPos) => { + (currentPos, bouncePos, targetPos)=>{ brewRenderer.scrollTo({ - top: currentPos + bouncePos, - behavior: "smooth", + top : currentPos + bouncePos, + behavior : 'smooth', }); - setTimeout(() => { + setTimeout(()=>{ brewRenderer.scrollTo({ - top: currentPos + targetPos, - behavior: "smooth", - block: "start", + top : currentPos + targetPos, + behavior : 'smooth', + block : 'start', }); }, bounceDelay); }, scrollDelay, { - leading: true, - trailing: false, + leading : true, + trailing : false, }, ); } @@ -259,45 +253,45 @@ const Editor = forwardRef( throttleBrewMove.current(currentPos, bouncePos, targetPos); } else { brewRenderer.scrollTo({ - top: currentPos + targetPos, - behavior: "instant", - block: "start", + top : currentPos + targetPos, + behavior : 'instant', + block : 'start', }); } }; - const sourceJump = (targetPage = currentBrewRendererPageNum, smooth = true) => { - if (!isText() || isJumping || jumpSource === "brew") return; + const sourceJump = (targetPage = currentBrewRendererPageNum, smooth = true)=>{ + if(!isText() || isJumping || jumpSource === 'brew') return; const editor = codeEditor.current; - if (!editor) return; - jumpSource = "source"; + if(!editor) return; + jumpSource = 'source'; editor.scrollToPage(targetPage); - setTimeout(() => { + setTimeout(()=>{ jumpSource = null; }, 200); }; - const updateEditorTheme = (newTheme) => { + const updateEditorTheme = (newTheme)=>{ window.localStorage.setItem(EDITOR_THEME_KEY, newTheme); setEditorTheme(newTheme); }; - const renderEditor = () => { - if (isText()) { + const renderEditor = ()=>{ + if(isText()) { return ( <> updateCurrentCursorPage(page)} - onViewChange={(page) => updateCurrentViewPage(page)} + onChange={onBrewChange('text')} + onCursorChange={(page)=>updateCurrentCursorPage(page)} + onViewChange={(page)=>updateCurrentViewPage(page)} editorTheme={currentEditorTheme} renderer={brew.renderer} style={{ height: `calc(100% - ${snippetBarHeight}px)` }} @@ -305,17 +299,17 @@ const Editor = forwardRef( ); } - if (isStyle()) { + if(isStyle()) { return ( <> ); } - if (isMeta()) { + if(isMeta()) { return ( <> - + ); } - if (isSnip()) { - if (!brew.snippets) { + if(isSnip()) { + if(!brew.snippets) { brew.snippets = DEFAULT_SNIPPET_TEXT; } return ( <> { + const redo = ()=>{ return codeEditor.current?.redo(); }; - const historySize = () => { + const historySize = ()=>{ return codeEditor.current?.historySize(); }; - const undo = () => { + const undo = ()=>{ return codeEditor.current?.undo(); }; - const foldCode = () => { + const foldCode = ()=>{ return codeEditor.current?.foldAll(); }; - const unfoldCode = () => { + const unfoldCode = ()=>{ return codeEditor.current?.unfoldAll(); }; - const update = () => {}; + const update = ()=>{}; - useImperativeHandle(ref, () => ({ + useImperativeHandle(ref, ()=>({ update, undo, redo, @@ -392,7 +386,7 @@ const Editor = forwardRef( })); return ( -
+