From baa28c9d6b6562a54eee0ad726e22d1b8811751b Mon Sep 17 00:00:00 2001
From: Kristóf Marussy <kristof@marussy.com>
Date: Wed, 3 Jan 2024 18:38:22 +0100
Subject: feat(web): toggle identifier coloring

---
 subprojects/frontend/src/editor/EditorButtons.tsx | 16 +++++++++++++---
 1 file changed, 13 insertions(+), 3 deletions(-)

(limited to 'subprojects/frontend/src/editor/EditorButtons.tsx')

diff --git a/subprojects/frontend/src/editor/EditorButtons.tsx b/subprojects/frontend/src/editor/EditorButtons.tsx
index ca51f975..f4513909 100644
--- a/subprojects/frontend/src/editor/EditorButtons.tsx
+++ b/subprojects/frontend/src/editor/EditorButtons.tsx
@@ -1,5 +1,5 @@
 /*
- * SPDX-FileCopyrightText: 2021-2023 The Refinery Authors <https://refinery.tools/>
+ * SPDX-FileCopyrightText: 2021-2024 The Refinery Authors <https://refinery.tools/>
  *
  * SPDX-License-Identifier: EPL-2.0
  */
@@ -8,8 +8,9 @@ import type { Diagnostic } from '@codemirror/lint';
 import CancelIcon from '@mui/icons-material/Cancel';
 import CheckIcon from '@mui/icons-material/Check';
 import FormatListNumberedIcon from '@mui/icons-material/FormatListNumbered';
-import FormatPaint from '@mui/icons-material/FormatPaint';
+import FormatPaintIcon from '@mui/icons-material/FormatPaint';
 import InfoOutlinedIcon from '@mui/icons-material/InfoOutlined';
+import LooksIcon from '@mui/icons-material/Looks';
 import RedoIcon from '@mui/icons-material/Redo';
 import SearchIcon from '@mui/icons-material/Search';
 import UndoIcon from '@mui/icons-material/Undo';
@@ -71,6 +72,15 @@ export default observer(function EditorButtons({
         >
           <FormatListNumberedIcon fontSize="small" />
         </ToggleButton>
+        <ToggleButton
+          selected={editorStore?.colorIdentifiers ?? false}
+          disabled={editorStore === undefined}
+          onClick={() => editorStore?.toggleColorIdentifiers()}
+          aria-label="Color identifiers"
+          value="color-identifiers"
+        >
+          <LooksIcon fontSize="small" />
+        </ToggleButton>
         <ToggleButton
           selected={editorStore?.searchPanel?.state ?? false}
           disabled={editorStore === undefined}
@@ -104,7 +114,7 @@ export default observer(function EditorButtons({
         aria-label="Automatic format"
         color="inherit"
       >
-        <FormatPaint fontSize="small" />
+        <FormatPaintIcon fontSize="small" />
       </IconButton>
       <ConnectButton editorStore={editorStore} />
     </Stack>
-- 
cgit v1.2.3-54-g00ecf