From 2be93c7490dcdac027d8529953b4c36549f0eb2b Mon Sep 17 00:00:00 2001 From: Thijs Zijdel Date: Fri, 9 Aug 2024 16:54:27 +0200 Subject: [PATCH 1/7] Added vite-tsconfig-paths Quality of dev fix --- package.json | 3 ++- src/Components/MonacoWrapper.tsx | 8 +++----- src/Components/Welcome.tsx | 8 ++++---- src/Features/base64/Base64Image.tsx | 2 +- src/Features/base64/Base64Text.tsx | 2 +- src/Features/colors/Colors.tsx | 2 +- src/Features/css/CssPlayground.tsx | 2 +- src/Features/epoch/Epoch.tsx | 4 ++-- src/Features/faker/Faker.tsx | 2 +- src/Features/hash/FileHash.tsx | 2 +- src/Features/hash/Hash.tsx | 4 ++-- src/Features/hash/HashBox.tsx | 2 +- src/Features/html-preview/HtmlPreview.tsx | 2 +- src/Features/ids/Ids.tsx | 6 +++--- src/Features/json-yaml/Yaml.tsx | 3 +-- src/Features/json/JsonFormatter.tsx | 6 +++--- src/Features/json/SingleTab.tsx | 2 +- src/Features/lorem/Lorem.tsx | 2 +- src/Features/markdown/Markdown.tsx | 4 ++-- src/Features/minifiers/Minify.tsx | 2 +- src/Features/number-tools/Nums.tsx | 2 +- src/Features/password/index.tsx | 4 ++-- src/Features/pastebin/Pastebin.tsx | 2 +- src/Features/ping/Ping.tsx | 1 - src/Features/quicktype/Quicktype.tsx | 2 +- src/Features/random/Random.tsx | 2 +- src/Features/reactPlayground/Playground.tsx | 2 +- src/Features/regex/RegexTester.tsx | 2 +- src/Features/repl/Repl.tsx | 2 +- src/Features/rest/SingleTab.tsx | 2 +- src/Features/sql/Sql.tsx | 6 +++--- src/Features/svg/Svg.tsx | 2 +- src/Features/text/TextDiff.tsx | 2 +- .../Navbar/components/UngroupedView.tsx | 10 +++++----- src/Layout/Navbar/index.tsx | 8 ++++---- src/Layout/Settings.tsx | 8 ++++---- src/hooks/index.ts | 1 + src/{utils => hooks}/useDebouceCallback.tsx | 0 src/utils/index.ts | 1 - tsconfig.json | 5 ++++- vite.config.ts | 2 ++ yarn.lock | 19 +++++++++++++++++++ 42 files changed, 87 insertions(+), 66 deletions(-) create mode 100644 src/hooks/index.ts rename src/{utils => hooks}/useDebouceCallback.tsx (100%) diff --git a/package.json b/package.json index 004d472..ea3d9c5 100644 --- a/package.json +++ b/package.json @@ -118,6 +118,7 @@ "prettier": "^3.2.4", "rollup-plugin-visualizer": "^5.12.0", "typescript": "^5.4.3", - "vite": "^5.2.7" + "vite": "^5.2.7", + "vite-tsconfig-paths": "^5.0.1" } } diff --git a/src/Components/MonacoWrapper.tsx b/src/Components/MonacoWrapper.tsx index 60df84c..90e14a2 100644 --- a/src/Components/MonacoWrapper.tsx +++ b/src/Components/MonacoWrapper.tsx @@ -1,14 +1,12 @@ import Editor, { DiffEditor, DiffOnMount, - OnMount, EditorProps, + OnMount, } from "@monaco-editor/react"; -import * as monaco from "monaco-editor"; import { editor } from "monaco-editor"; -import { useAppContext } from "../Contexts/AppContextProvider"; -import { themes } from "../Layout/themes"; -import { useEffect, useState } from "react"; +import { useAppContext } from "@/Contexts/AppContextProvider"; +import { themes } from "@/Layout/themes"; type MonacoProps = { value?: string; diff --git a/src/Components/Welcome.tsx b/src/Components/Welcome.tsx index 81ca206..705bbb0 100644 --- a/src/Components/Welcome.tsx +++ b/src/Components/Welcome.tsx @@ -1,17 +1,17 @@ import { Group, + rem, Stack, Switch, Text, ThemeIcon, Title, - rem, } from "@mantine/core"; -import { useContext, useState } from "react"; +import { useState } from "react"; import { useNavigate } from "react-router-dom"; -import { useAppContext } from "../Contexts/AppContextProvider"; -import { data } from "../Layout/Navbar"; +import { useAppContext } from "@/Contexts/AppContextProvider"; +import { data } from "@/Layout/Navbar"; import classes from "./styles.module.css"; import { MdSettings } from "react-icons/md"; diff --git a/src/Features/base64/Base64Image.tsx b/src/Features/base64/Base64Image.tsx index 453e3dd..4da1473 100644 --- a/src/Features/base64/Base64Image.tsx +++ b/src/Features/base64/Base64Image.tsx @@ -1,7 +1,7 @@ import { Button, Divider, Select, Stack, Textarea } from "@mantine/core"; import { useState } from "react"; -import { Copy } from "../../Components/Copy"; +import { Copy } from "@/Components/Copy"; import { fs, invoke } from "@tauri-apps/api"; import { open, save } from "@tauri-apps/api/dialog"; diff --git a/src/Features/base64/Base64Text.tsx b/src/Features/base64/Base64Text.tsx index 5a5949f..51fe4f9 100644 --- a/src/Features/base64/Base64Text.tsx +++ b/src/Features/base64/Base64Text.tsx @@ -1,7 +1,7 @@ import { Button, Group, Stack, Textarea } from "@mantine/core"; import { useState } from "react"; -import { Copy } from "../../Components/Copy"; +import { Copy } from "@/Components/Copy"; const Base64 = () => { const [input, setInput] = useState(""); diff --git a/src/Features/colors/Colors.tsx b/src/Features/colors/Colors.tsx index 287fabd..6efcad0 100644 --- a/src/Features/colors/Colors.tsx +++ b/src/Features/colors/Colors.tsx @@ -13,7 +13,7 @@ import { useState } from "react"; import CustomPicker from "./CustomPicker"; import { BsMoon, BsSun } from "react-icons/bs"; -import { OutputBox } from "../../Components/OutputBox"; +import { OutputBox } from "@/Components/OutputBox"; import { clipboard } from "@tauri-apps/api"; import { Convert, diff --git a/src/Features/css/CssPlayground.tsx b/src/Features/css/CssPlayground.tsx index b904a43..882da11 100644 --- a/src/Features/css/CssPlayground.tsx +++ b/src/Features/css/CssPlayground.tsx @@ -1,5 +1,5 @@ import { Box, Group, Stack } from "@mantine/core"; -import { Monaco } from "../../Components/MonacoWrapper"; +import { Monaco } from "@/Components/MonacoWrapper"; import { useState } from "react"; const htmlBoilerplate = ` diff --git a/src/Features/epoch/Epoch.tsx b/src/Features/epoch/Epoch.tsx index 77174c2..fcaf276 100644 --- a/src/Features/epoch/Epoch.tsx +++ b/src/Features/epoch/Epoch.tsx @@ -15,8 +15,8 @@ import { useInterval } from "@mantine/hooks"; import { useEffect, useMemo, useState } from "react"; import { FaArrowRight } from "react-icons/fa"; -import { Copy } from "../../Components/Copy"; -import { db } from "../../utils"; +import { Copy } from "@/Components/Copy"; +import { db } from "@/utils"; const formats = [ "toString", diff --git a/src/Features/faker/Faker.tsx b/src/Features/faker/Faker.tsx index 15e808d..55a3758 100644 --- a/src/Features/faker/Faker.tsx +++ b/src/Features/faker/Faker.tsx @@ -15,7 +15,7 @@ import { import { FakerInput } from "./FakerInput"; import { useCallback, useState } from "react"; import { faker } from "@faker-js/faker"; -import { Monaco } from "../../Components/MonacoWrapper"; +import { Monaco } from "@/Components/MonacoWrapper"; import { MdOutlineRemove, MdOutlineClose, diff --git a/src/Features/hash/FileHash.tsx b/src/Features/hash/FileHash.tsx index 0f7eb4c..bc7fd18 100644 --- a/src/Features/hash/FileHash.tsx +++ b/src/Features/hash/FileHash.tsx @@ -1,7 +1,7 @@ import { Button, Group, LoadingOverlay, Stack, Table } from "@mantine/core"; import { dialog, invoke } from "@tauri-apps/api"; import { useState } from "react"; -import { trackOtherEvent } from "../../utils/analytics"; +import { trackOtherEvent } from "@/utils/analytics"; const FileHash = () => { const [fileHashes, setFileHashes] = useState< diff --git a/src/Features/hash/Hash.tsx b/src/Features/hash/Hash.tsx index 4401302..eb7f05d 100644 --- a/src/Features/hash/Hash.tsx +++ b/src/Features/hash/Hash.tsx @@ -2,8 +2,8 @@ import { Box, LoadingOverlay, Stack } from "@mantine/core"; import { MD5, SHA1, SHA224, SHA256, SHA512 } from "crypto-js"; import { useEffect, useState } from "react"; -import { Monaco } from "../../Components/MonacoWrapper"; -import { db } from "../../utils"; +import { Monaco } from "@/Components/MonacoWrapper"; +import { db } from "@/utils"; import { HashBox } from "./HashBox"; const init = { diff --git a/src/Features/hash/HashBox.tsx b/src/Features/hash/HashBox.tsx index f0127d1..a97e473 100644 --- a/src/Features/hash/HashBox.tsx +++ b/src/Features/hash/HashBox.tsx @@ -1,6 +1,6 @@ import { Input } from "@mantine/core"; -import { Copy } from "../../Components/Copy"; +import { Copy } from "@/Components/Copy"; type HashBoxProps = { value: string; diff --git a/src/Features/html-preview/HtmlPreview.tsx b/src/Features/html-preview/HtmlPreview.tsx index c490c13..c86459b 100644 --- a/src/Features/html-preview/HtmlPreview.tsx +++ b/src/Features/html-preview/HtmlPreview.tsx @@ -1,7 +1,7 @@ import { Group, Stack } from "@mantine/core"; import { Interweave } from "interweave"; import { useState } from "react"; -import { Monaco } from "../../Components/MonacoWrapper"; +import { Monaco } from "@/Components/MonacoWrapper"; const input = `

HTML Preview

Enter HTML in the textarea below and see the preview here

diff --git a/src/Features/ids/Ids.tsx b/src/Features/ids/Ids.tsx index 1690d69..731c6d8 100644 --- a/src/Features/ids/Ids.tsx +++ b/src/Features/ids/Ids.tsx @@ -4,14 +4,14 @@ import { NumberInput, Select, Stack, - TextInput, Textarea, + TextInput, } from "@mantine/core"; import { useInputState } from "@mantine/hooks"; import { useCallback, useEffect, useState } from "react"; import { v4 } from "uuid"; -import { nanoid, customAlphabet } from "nanoid"; -import { Copy } from "../../Components/Copy"; +import { customAlphabet, nanoid } from "nanoid"; +import { Copy } from "@/Components/Copy"; type Generator = "v4" | "nanoid" | "custom"; diff --git a/src/Features/json-yaml/Yaml.tsx b/src/Features/json-yaml/Yaml.tsx index 4c3637c..e170d47 100644 --- a/src/Features/json-yaml/Yaml.tsx +++ b/src/Features/json-yaml/Yaml.tsx @@ -2,8 +2,7 @@ import { Box, Group, NativeSelect, Stack } from "@mantine/core"; import YAML from "js-yaml"; import { useState } from "react"; -import { Monaco } from "../../Components/MonacoWrapper"; -import { useAppContext } from "../../Contexts/AppContextProvider"; +import { Monaco } from "@/Components/MonacoWrapper"; const YamlJson = () => { const [mode, setMode] = useState<"json" | "yaml" | string>("json"); diff --git a/src/Features/json/JsonFormatter.tsx b/src/Features/json/JsonFormatter.tsx index ad3d0d4..5bbd639 100644 --- a/src/Features/json/JsonFormatter.tsx +++ b/src/Features/json/JsonFormatter.tsx @@ -1,10 +1,10 @@ import "./styles.module.css"; import { Button, Stack, Tabs } from "@mantine/core"; -import { MouseEvent, MouseEventHandler, useEffect, useState } from "react"; +import { useEffect, useState } from "react"; -import { db } from "../../utils"; -import { useDebouncedCallback } from "../../utils/"; +import { db } from "@/utils"; +import { useDebouncedCallback } from "@/hooks"; import { SingleTab } from "./SingleTab"; // default state diff --git a/src/Features/json/SingleTab.tsx b/src/Features/json/SingleTab.tsx index f0d6a81..399a954 100644 --- a/src/Features/json/SingleTab.tsx +++ b/src/Features/json/SingleTab.tsx @@ -13,7 +13,7 @@ import { BsTextParagraph, } from "react-icons/bs"; -import { Monaco } from "../../Components/MonacoWrapper"; +import { Monaco } from "@/Components/MonacoWrapper"; export const SingleTab = ({ tabid, diff --git a/src/Features/lorem/Lorem.tsx b/src/Features/lorem/Lorem.tsx index baae60f..b811db4 100644 --- a/src/Features/lorem/Lorem.tsx +++ b/src/Features/lorem/Lorem.tsx @@ -1,7 +1,7 @@ import { Group, NumberInput, Select, Stack, Textarea } from "@mantine/core"; import { loremIpsum } from "lorem-ipsum"; import { useEffect, useState } from "react"; -import { Copy } from "../../Components/Copy"; +import { Copy } from "@/Components/Copy"; type mode = "paragraphs" | "sentences" | "words"; diff --git a/src/Features/markdown/Markdown.tsx b/src/Features/markdown/Markdown.tsx index a6cb7d6..3f01cbe 100644 --- a/src/Features/markdown/Markdown.tsx +++ b/src/Features/markdown/Markdown.tsx @@ -5,8 +5,8 @@ import { Box, Button, Group, Stack } from "@mantine/core"; import MarkdownPreview from "@uiw/react-markdown-preview"; import { useState } from "react"; -import { Monaco } from "../../Components/MonacoWrapper"; -import { openFileAndGetData, saveDataToFile } from "../../utils/functions"; +import { Monaco } from "@/Components/MonacoWrapper"; +import { openFileAndGetData, saveDataToFile } from "@/utils/functions"; const Markdown = () => { const [source, setSource] = useState(` diff --git a/src/Features/minifiers/Minify.tsx b/src/Features/minifiers/Minify.tsx index 34af2cd..3e43922 100644 --- a/src/Features/minifiers/Minify.tsx +++ b/src/Features/minifiers/Minify.tsx @@ -25,7 +25,7 @@ import postcss from "prettier/plugins/postcss"; import { minify as cssMinify } from "csso"; import { minify as terserMinify } from "terser"; -import { Monaco } from "../../Components/MonacoWrapper"; +import { Monaco } from "@/Components/MonacoWrapper"; import { invoke } from "@tauri-apps/api"; const map: Record = { diff --git a/src/Features/number-tools/Nums.tsx b/src/Features/number-tools/Nums.tsx index dd8710e..97c1946 100644 --- a/src/Features/number-tools/Nums.tsx +++ b/src/Features/number-tools/Nums.tsx @@ -2,7 +2,7 @@ import { Button, Divider, Group, Stack, Text, TextInput } from "@mantine/core"; import { useEffect, useState } from "react"; import { convertBase } from "simple-base-converter"; -import { OutputBox } from "../../Components/OutputBox"; +import { OutputBox } from "@/Components/OutputBox"; const init = { decimal: "", diff --git a/src/Features/password/index.tsx b/src/Features/password/index.tsx index 93123fc..157b45d 100644 --- a/src/Features/password/index.tsx +++ b/src/Features/password/index.tsx @@ -19,8 +19,8 @@ import { FaCheck } from "react-icons/fa"; import { FiCheck } from "react-icons/fi"; import { MdDelete } from "react-icons/md"; -import { OutputBox } from "../../Components/OutputBox"; -import { db } from "../../utils"; +import { OutputBox } from "@/Components/OutputBox"; +import { db } from "@/utils"; import { QuantityInput } from "./Counter"; type Config = { diff --git a/src/Features/pastebin/Pastebin.tsx b/src/Features/pastebin/Pastebin.tsx index 53971fb..4972e1d 100644 --- a/src/Features/pastebin/Pastebin.tsx +++ b/src/Features/pastebin/Pastebin.tsx @@ -9,7 +9,7 @@ import { } from "@mantine/core"; import { useState } from "react"; -import { Monaco } from "../../Components/MonacoWrapper"; +import { Monaco } from "@/Components/MonacoWrapper"; import { notifications } from "@mantine/notifications"; const langs = [ diff --git a/src/Features/ping/Ping.tsx b/src/Features/ping/Ping.tsx index 552bf90..8aafc64 100644 --- a/src/Features/ping/Ping.tsx +++ b/src/Features/ping/Ping.tsx @@ -12,7 +12,6 @@ import { useEffect, useState } from "react"; import "@mantine/charts/styles.css"; import { LineChart } from "@mantine/charts"; -import { data } from "../../Layout/Navbar/index"; type PingResponse = { size: number; diff --git a/src/Features/quicktype/Quicktype.tsx b/src/Features/quicktype/Quicktype.tsx index 06d5d4c..c6fa51e 100644 --- a/src/Features/quicktype/Quicktype.tsx +++ b/src/Features/quicktype/Quicktype.tsx @@ -15,7 +15,7 @@ import { } from "quicktype-core"; import { useState } from "react"; -import { Monaco } from "../../Components/MonacoWrapper"; +import { Monaco } from "@/Components/MonacoWrapper"; const languages = [ { language: "ruby", label: "Ruby", baseLang: "ruby" }, diff --git a/src/Features/random/Random.tsx b/src/Features/random/Random.tsx index dab2d67..01adba1 100644 --- a/src/Features/random/Random.tsx +++ b/src/Features/random/Random.tsx @@ -13,7 +13,7 @@ import { import { generate } from "generate-password-ts"; import { useEffect, useState } from "react"; -import { saveDataToFile } from "../../utils/functions"; +import { saveDataToFile } from "@/utils/functions"; const checkboxtypes = [ "lowercase", diff --git a/src/Features/reactPlayground/Playground.tsx b/src/Features/reactPlayground/Playground.tsx index 1debf6c..7a8a268 100644 --- a/src/Features/reactPlayground/Playground.tsx +++ b/src/Features/reactPlayground/Playground.tsx @@ -2,7 +2,7 @@ import { Group, Stack } from "@mantine/core"; import { useState } from "react"; import { LivePreview, LiveProvider } from "react-live"; -import { Monaco } from "../../Components/MonacoWrapper"; +import { Monaco } from "@/Components/MonacoWrapper"; const boilerplate = ` // Syntax highlighting, autocompletion etc diff --git a/src/Features/regex/RegexTester.tsx b/src/Features/regex/RegexTester.tsx index d437ca8..91718d0 100644 --- a/src/Features/regex/RegexTester.tsx +++ b/src/Features/regex/RegexTester.tsx @@ -3,7 +3,7 @@ import { OnMount } from "@monaco-editor/react"; import { editor } from "monaco-editor"; import { useEffect, useState } from "react"; -import { Monaco } from "../../Components/MonacoWrapper"; +import { Monaco } from "@/Components/MonacoWrapper"; ///////////////////////////////////// // NOTE BEFORE YOU WORK ON THIS FILE diff --git a/src/Features/repl/Repl.tsx b/src/Features/repl/Repl.tsx index c0f5db2..9a8b5d4 100644 --- a/src/Features/repl/Repl.tsx +++ b/src/Features/repl/Repl.tsx @@ -2,7 +2,7 @@ import { Box, Button, Group, Select, Stack, Text } from "@mantine/core"; import { useEffect, useState } from "react"; -import { Monaco } from "../../Components/MonacoWrapper"; +import { Monaco } from "@/Components/MonacoWrapper"; import classes from "./styles.module.css"; diff --git a/src/Features/rest/SingleTab.tsx b/src/Features/rest/SingleTab.tsx index 17ab5c8..8d5a313 100644 --- a/src/Features/rest/SingleTab.tsx +++ b/src/Features/rest/SingleTab.tsx @@ -13,7 +13,7 @@ import { import axios from "axios"; import { useState } from "react"; -import { Monaco } from "../../Components/MonacoWrapper"; +import { Monaco } from "@/Components/MonacoWrapper"; import { Params } from "./Params"; export type ParamType = { key: string; value: string; enabled: boolean }; diff --git a/src/Features/sql/Sql.tsx b/src/Features/sql/Sql.tsx index 65d7094..4d089e7 100644 --- a/src/Features/sql/Sql.tsx +++ b/src/Features/sql/Sql.tsx @@ -1,9 +1,9 @@ -import { Box, Stack } from "@mantine/core"; +import { Box, Group, Select, Stack, Text } from "@mantine/core"; import sqlFormatter from "@sqltools/formatter"; import { useEffect, useState } from "react"; -import { Copy } from "../../Components/Copy"; -import { Monaco } from "../../Components/MonacoWrapper"; +import { Copy } from "@/Components/Copy"; +import { Monaco } from "@/Components/MonacoWrapper"; const firstQuery = ` WITH SubQuery1 AS ( SELECT EmployeeID, DepartmentID, COUNT(*) OVER(PARTITION BY DepartmentID) AS DepartmentSize, diff --git a/src/Features/svg/Svg.tsx b/src/Features/svg/Svg.tsx index 8e36f30..3f37081 100644 --- a/src/Features/svg/Svg.tsx +++ b/src/Features/svg/Svg.tsx @@ -1,5 +1,5 @@ import { Box, Button, Group, Stack } from "@mantine/core"; -import { Monaco } from "../../Components/MonacoWrapper"; +import { Monaco } from "@/Components/MonacoWrapper"; import { useState } from "react"; import { open } from "@tauri-apps/api/dialog"; import { readTextFile } from "@tauri-apps/api/fs"; diff --git a/src/Features/text/TextDiff.tsx b/src/Features/text/TextDiff.tsx index ec6632d..a748d2d 100644 --- a/src/Features/text/TextDiff.tsx +++ b/src/Features/text/TextDiff.tsx @@ -1,7 +1,7 @@ import { NativeSelect, Stack } from "@mantine/core"; import { useState } from "react"; -import { Monaco } from "../../Components/MonacoWrapper"; +import { Monaco } from "@/Components/MonacoWrapper"; const languages = [ "Text", diff --git a/src/Layout/Navbar/components/UngroupedView.tsx b/src/Layout/Navbar/components/UngroupedView.tsx index b5fae51..ad52683 100644 --- a/src/Layout/Navbar/components/UngroupedView.tsx +++ b/src/Layout/Navbar/components/UngroupedView.tsx @@ -1,15 +1,15 @@ import { DragDropContext, - Droppable, Draggable, + Droppable, OnDragEndResponder, } from "@hello-pangea/dnd"; import cx from "clsx"; -import { Stack, Box, ActionIcon, Text, Tooltip } from "@mantine/core"; -import { VscPinned, VscPin } from "react-icons/vsc"; +import { ActionIcon, Box, Stack, Text, Tooltip } from "@mantine/core"; +import { VscPin, VscPinned } from "react-icons/vsc"; import { Link, useLocation, useNavigate } from "react-router-dom"; -import { trackOtherEvent } from "../../../utils/analytics"; -import { db } from "../../../utils"; +import { trackOtherEvent } from "@/utils/analytics"; +import { db } from "@/utils"; import classes from "./ungrouped.module.css"; import { NavItem } from ".."; diff --git a/src/Layout/Navbar/index.tsx b/src/Layout/Navbar/index.tsx index 1bada11..4a1592a 100644 --- a/src/Layout/Navbar/index.tsx +++ b/src/Layout/Navbar/index.tsx @@ -7,9 +7,9 @@ import { Stack, Tooltip, } from "@mantine/core"; -import React, { useContext, useEffect, useMemo, useState } from "react"; +import React, { useEffect, useMemo, useState } from "react"; -import { MdMenu, MdMenuOpen, MdHome } from "react-icons/md"; +import { MdHome, MdMenu, MdMenuOpen } from "react-icons/md"; import { useLocation, useNavigate } from "react-router-dom"; import cx from "clsx"; @@ -19,11 +19,11 @@ import { defaultConfig, useAppContext, } from "../../Contexts/AppContextProvider"; -import { db } from "../../utils"; +import { db } from "@/utils"; import classes from "./styles.module.css"; import { useLocalStorage, useWindowEvent } from "@mantine/hooks"; -import { trackButtonClick, trackOtherEvent } from "../../utils/analytics"; +import { trackButtonClick, trackOtherEvent } from "@/utils/analytics"; import { GroupedView } from "./components/GroupedView"; import { UngroupedView } from "./components/UngroupedView"; diff --git a/src/Layout/Settings.tsx b/src/Layout/Settings.tsx index 71ebec2..7d8d088 100644 --- a/src/Layout/Settings.tsx +++ b/src/Layout/Settings.tsx @@ -10,15 +10,15 @@ import { useMantineColorScheme, useMantineTheme, } from "@mantine/core"; -import { TbSun, TbMoon, TbCheck, TbX } from "react-icons/tb"; +import { TbCheck, TbMoon, TbSun, TbX } from "react-icons/tb"; import { notifications } from "@mantine/notifications"; import { version } from "../../package.json"; -import { db } from "../utils"; -import { openFileAndGetData, saveDataToFile } from "../utils/functions"; +import { db } from "@/utils"; +import { openFileAndGetData, saveDataToFile } from "@/utils/functions"; import { confirm } from "@tauri-apps/api/dialog"; import { useLocalStorage } from "@mantine/hooks"; -import { useAppContext } from "../Contexts/AppContextProvider"; +import { useAppContext } from "@/Contexts/AppContextProvider"; import { themes } from "./themes"; export const Settings = () => { diff --git a/src/hooks/index.ts b/src/hooks/index.ts new file mode 100644 index 0000000..709f3d5 --- /dev/null +++ b/src/hooks/index.ts @@ -0,0 +1 @@ +export { useDebouncedCallback } from "./useDebouceCallback"; diff --git a/src/utils/useDebouceCallback.tsx b/src/hooks/useDebouceCallback.tsx similarity index 100% rename from src/utils/useDebouceCallback.tsx rename to src/hooks/useDebouceCallback.tsx diff --git a/src/utils/index.ts b/src/utils/index.ts index bf85099..e07652b 100644 --- a/src/utils/index.ts +++ b/src/utils/index.ts @@ -1,2 +1 @@ export * from "./db"; -export { useDebouncedCallback } from "./useDebouceCallback"; diff --git a/tsconfig.json b/tsconfig.json index b5feac3..94fc392 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -14,7 +14,10 @@ "resolveJsonModule": true, "isolatedModules": true, "noEmit": true, - "jsx": "react-jsx" + "jsx": "react-jsx", + "paths": { + "@/*": ["./src/*"] + } }, "include": ["./src"] } diff --git a/vite.config.ts b/vite.config.ts index d51c877..4790b1c 100644 --- a/vite.config.ts +++ b/vite.config.ts @@ -1,6 +1,7 @@ // import react from "@vitejs/plugin-react"; import react from "@vitejs/plugin-react-swc"; import { visualizer } from "rollup-plugin-visualizer"; +import tsconfigPaths from "vite-tsconfig-paths"; import { defineConfig } from "vite"; import copyMonaco from "./vite/copyAssets"; @@ -24,6 +25,7 @@ export default defineConfig({ }, react(), copyMonaco(), + tsconfigPaths(), ], build: { diff --git a/yarn.lock b/yarn.lock index 3c80416..d453a09 100644 --- a/yarn.lock +++ b/yarn.lock @@ -4196,6 +4196,11 @@ globby@^11.1.0: merge2 "^1.4.1" slash "^3.0.0" +globrex@^0.1.2: + version "0.1.2" + resolved "https://registry.yarnpkg.com/globrex/-/globrex-0.1.2.tgz#dd5d9ec826232730cd6793a5e33a9302985e6098" + integrity sha512-uHJgbwAMwNFf5mLst7IWLNg14x1CkeqglJb/K3doi4dw6q2IvAAmM/Y81kevy83wP+Sst+nutFTYOGg3d1lsxg== + gopd@^1.0.1: version "1.0.1" resolved "https://registry.yarnpkg.com/gopd/-/gopd-1.0.1.tgz#29ff76de69dac7489b7c0918a5788e56477c332c" @@ -7543,6 +7548,11 @@ ts-node@^10.9.1: v8-compile-cache-lib "^3.0.1" yn "3.1.1" +tsconfck@^3.0.3: + version "3.1.1" + resolved "https://registry.yarnpkg.com/tsconfck/-/tsconfck-3.1.1.tgz#c7284913262c293b43b905b8b034f524de4a3162" + integrity sha512-00eoI6WY57SvZEVjm13stEVE90VkEdJAFGgpFLTsZbJyW/LwFQ7uQxJHWpZ2hzSWgCPKc9AnBnNP+0X7o3hAmQ== + tsconfig-paths@^3.15.0: version "3.15.0" resolved "https://registry.yarnpkg.com/tsconfig-paths/-/tsconfig-paths-3.15.0.tgz#5299ec605e55b1abb23ec939ef15edaf483070d4" @@ -7934,6 +7944,15 @@ victory-vendor@^36.6.8: d3-time "^3.0.0" d3-timer "^3.0.1" +vite-tsconfig-paths@^5.0.1: + version "5.0.1" + resolved "https://registry.yarnpkg.com/vite-tsconfig-paths/-/vite-tsconfig-paths-5.0.1.tgz#c9387a29c32fd586e4c7f4e2b2da1f0b5c9a7403" + integrity sha512-yqwv+LstU7NwPeNqajZzLEBVpUFU6Dugtb2P84FXuvaoYA+/70l9MHE+GYfYAycVyPSDYZ7mjOFuYBRqlEpTig== + dependencies: + debug "^4.1.1" + globrex "^0.1.2" + tsconfck "^3.0.3" + vite@^5.2.7: version "5.2.7" resolved "https://registry.yarnpkg.com/vite/-/vite-5.2.7.tgz#e1b8a985eb54fcb9467d7f7f009d87485016df6e" From 42bd7aa51725b90ec85d230a705d5447c503f53b Mon Sep 17 00:00:00 2001 From: Thijs Zijdel Date: Fri, 9 Aug 2024 16:54:58 +0200 Subject: [PATCH 2/7] Fix/ Sql save previous query --- src/Features/sql/Sql.tsx | 67 +++++++++++++++++++++++++++++++++++----- 1 file changed, 60 insertions(+), 7 deletions(-) diff --git a/src/Features/sql/Sql.tsx b/src/Features/sql/Sql.tsx index 4d089e7..f9cc750 100644 --- a/src/Features/sql/Sql.tsx +++ b/src/Features/sql/Sql.tsx @@ -17,7 +17,14 @@ ROW_NUMBER() OVER(PARTITION BY DepartmentID ORDER BY Salary DESC) AS SalaryRank e.DepartmentID, e.Salary DESCLIMIT 50; `; +type Query = { + preFormatted: string; + formatted: string; +}; const Sql = () => { + const [indent, setIndent] = useState("\t"); + const [history, setHistory] = useState([]); + const [preFormatted, setPreFormatted] = useState(firstQuery); const [formatted, setFormatted] = useState(""); const [showCopy, setShowCopy] = useState(false); @@ -25,11 +32,11 @@ const Sql = () => { setFormatted( sqlFormatter.format(firstQuery, { language: "sql", - indent: "\t", // TODO: take this from user? + indent, reservedWordCase: "upper", }) ); - }, []); + }, [indent]); return ( { height: "100%", }} > - + + { + const query = history.find((q) => q.preFormatted === e); + if (query) { + setPreFormatted(query.preFormatted); + setFormatted(query.formatted); + } + }} + data={history.map((q) => ({ + value: q.preFormatted, + label: q.preFormatted.slice(0, 20), + }))} + /> + ) : ( + + When you copy a formatted query, it will be saved here. + + )} + + { + setPreFormatted(e as string); setFormatted( sqlFormatter.format(e || "", { language: "sql", - indent: "\t", // TODO: take this from user? + indent: indent, reservedWordCase: "upper", }) ); @@ -69,6 +115,15 @@ const Sql = () => { top: 10, right: 20, }} + onClick={() => { + setHistory([ + ...history, + { + preFormatted, + formatted, + }, + ]); + }} > @@ -79,5 +134,3 @@ const Sql = () => { }; export default Sql; - -// TODO: Save previous query From 1c2ee5b60a496d87755635d0f735eb52b31839ca Mon Sep 17 00:00:00 2001 From: Thijs Zijdel Date: Fri, 9 Aug 2024 16:55:22 +0200 Subject: [PATCH 3/7] Wdym --- src/Features/markdown/Markdown.tsx | 2 +- src/Features/pastebin/Pastebin.tsx | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/src/Features/markdown/Markdown.tsx b/src/Features/markdown/Markdown.tsx index 3f01cbe..dd6cf9b 100644 --- a/src/Features/markdown/Markdown.tsx +++ b/src/Features/markdown/Markdown.tsx @@ -81,4 +81,4 @@ const codeblock = () => { export default Markdown; -// TODO: Save previous text +// TODO: Save previous text,... db? diff --git a/src/Features/pastebin/Pastebin.tsx b/src/Features/pastebin/Pastebin.tsx index 4972e1d..53b8b9c 100644 --- a/src/Features/pastebin/Pastebin.tsx +++ b/src/Features/pastebin/Pastebin.tsx @@ -156,5 +156,5 @@ function Pastebin() { export default Pastebin; // TODO: Add a button to copy the link to clipboard -// TODO: store settings to db +// TODO: store settings to db -> Would be nice for OpenAi/ api keys too // TODO: store prev generated URLS? From 355d42f5db928fe4de57c5f173a6a3307374449b Mon Sep 17 00:00:00 2001 From: Sparkenstein Date: Tue, 13 Aug 2024 09:27:00 +0530 Subject: [PATCH 4/7] fix: monaco offline themes support --- src/Components/MonacoWrapper.tsx | 28 +++++++++------------------- 1 file changed, 9 insertions(+), 19 deletions(-) diff --git a/src/Components/MonacoWrapper.tsx b/src/Components/MonacoWrapper.tsx index 90e14a2..97fa5bd 100644 --- a/src/Components/MonacoWrapper.tsx +++ b/src/Components/MonacoWrapper.tsx @@ -1,8 +1,8 @@ import Editor, { DiffEditor, DiffOnMount, - EditorProps, OnMount, + EditorProps, } from "@monaco-editor/react"; import { editor } from "monaco-editor"; import { useAppContext } from "@/Contexts/AppContextProvider"; @@ -26,8 +26,6 @@ type MonacoProps = { }; } & EditorProps; -let inMemoryThemeCache: any = {}; - export const Monaco = ({ value, setValue, @@ -46,23 +44,15 @@ export const Monaco = ({ const dark = themes.find((t) => t.value === config.editorThemeDark)!; const light = themes.find((t) => t.value === config.editorThemeLight)!; - const applyTheme = (monaco: any, theme: { value: string; label: string }) => { - // Importing it from `monaco-themes/themes/${theme.label}.json` gave all sorts of issues - // so fallback to using the CDN is fine for now, but we should look into this later / improve caching - const themeUrl = `https://cdn.jsdelivr.net/npm/monaco-themes@0.4.4/themes/${encodeURIComponent(theme.label)}.json`; - - if ((inMemoryThemeCache as any)[theme.label]) { - monaco.editor.setTheme(theme.value); - return; - } - - fetch(themeUrl) - .then(async (data: any) => { - console.log(`monaco-themes/themes/${theme.label}.json`); - const value = await data.json(); + const applyTheme = ( + monaco: typeof import("monaco-editor/esm/vs/editor/editor.api"), + theme: { value: string; label: string } + ) => { + // hardcoding the path is fine since it's a static import. + import(`../../node_modules/monaco-themes/themes/${theme.label}.json`) + .then((data) => { const name = theme.value ?? "tomorrow-night"; - inMemoryThemeCache[theme.label] = value; - monaco.editor.defineTheme(name, value); + monaco.editor.defineTheme(name, data); monaco.editor.setTheme(name); }) .catch((e: any) => { From 7f7f35ecfd447704ace8d77b53b39a945d9ec088 Mon Sep 17 00:00:00 2001 From: Sparkenstein Date: Tue, 13 Aug 2024 09:27:30 +0530 Subject: [PATCH 5/7] fix: overflow screen on multiple lines --- src/Features/base64/Base64Text.tsx | 14 +++++++++++++- 1 file changed, 13 insertions(+), 1 deletion(-) diff --git a/src/Features/base64/Base64Text.tsx b/src/Features/base64/Base64Text.tsx index 51fe4f9..16a40a4 100644 --- a/src/Features/base64/Base64Text.tsx +++ b/src/Features/base64/Base64Text.tsx @@ -22,14 +22,26 @@ const Base64 = () => { onChange={(e) => setInput(e.target.value)} value={input} minRows={7} + maxRows={7} autosize + spellCheck={false} /> + + -