Update dependencies

eslint.config.js

@@ -1,37 +1,40 @@
 import js from "@eslint/js";
-import react from "eslint-plugin-react";
+import pluginRouter from "@tanstack/eslint-plugin-router";
+import eslintReact from "@eslint-react/eslint-plugin";
 import reactHooks from "eslint-plugin-react-hooks";
 import reactRefresh from "eslint-plugin-react-refresh";
 import globals from "globals";
 import tseslint from "typescript-eslint";
+import { defineConfig, globalIgnores } from "eslint/config";
 
 
-export default tseslint.config(
-	{ ignores: ['dist'] },
+export default defineConfig(
+	globalIgnores(["dist", "coverage", ".tanstack", ".scannerwork"]),
 	{
-		extends: [js.configs.recommended, ...tseslint.configs.recommendedTypeChecked],
 		files: ['**/*.{ts,tsx}'],
+		extends: [
+			js.configs.recommended,
+			eslintReact.configs.recommended,
+			tseslint.configs.recommendedTypeChecked,
+			reactHooks.configs.flat["recommended-latest"],
+			reactRefresh.configs.vite,
+			pluginRouter.configs["flat/recommended"]
+		],
 		languageOptions: {
-			ecmaVersion: 2020,
+			ecmaVersion: 2022,
 			globals: globals.browser,
 			parserOptions: {
 				project: ["./tsconfig.node.json", "./tsconfig.app.json"],
 				tsconfigRootDir: import.meta.dirname
 			}
 		},
-		plugins: {
-			'react-hooks': reactHooks,
-			'react-refresh': reactRefresh,
-			react: react
-		},
 		rules: {
-			...react.configs.recommended.rules,
-			...react.configs["jsx-runtime"].rules,
 			...reactHooks.configs.recommended.rules,
 			"react-refresh/only-export-components": [
 				"warn",
 				{ allowConstantExport: true }
-			]
+			],
+			"react/react-in-jsx-scope": "off"
 		},
 		settings: {
 			react: {

package.json

@@ -1,7 +1,7 @@
 {
 	"name": "cipher-stream-web",
 	"private": true,
-	"version": "1.0.2-SNAPSHOT",
+	"version": "1.0.2",
 	"type": "module",
 	"scripts": {
 		"dev": "vite",
@@ -11,35 +11,36 @@
 		"sonar": "bash sonarBuild.sh"
 	},
 	"dependencies": {
-		"@headlessui/react": "^2.2.9",
-		"@tailwindcss/vite": "^4.1.18",
-		"@tanstack/react-query": "^5.90.12",
-		"@tanstack/react-router": "^1.142.6",
-		"@tanstack/react-router-devtools": "^1.142.6",
-		"axios": "^1.13.2",
+		"@eslint-react/eslint-plugin": "^5.18.6",
+		"@headlessui/react": "^2.2.10",
+		"@tailwindcss/vite": "^4.3.3",
+		"@tanstack/eslint-plugin-router": "^1.162.0",
+		"@tanstack/react-query": "^5.101.4",
+		"@tanstack/react-router": "^1.170.29",
+		"@tanstack/react-router-devtools": "^1.167.1",
+		"axios": "^1.19.0",
 		"clsx": "^2.1.1",
-		"eslint-plugin-react": "^7.37.5",
-		"mattrixwv-components": "^0.0.7",
-		"react": "^19.2.3",
-		"react-dom": "^19.2.3",
-		"react-icons": "^5.5.0",
-		"react-tooltip": "^5.30.0",
-		"tailwindcss": "^4.1.18",
-		"use-debounce": "^10.0.6"
+		"mattrixwv-components": "^0.0.9",
+		"react": "^19.2.8",
+		"react-dom": "^19.2.8",
+		"react-icons": "^5.7.0",
+		"react-tooltip": "^6.0.8",
+		"tailwindcss": "^4.3.3",
+		"use-debounce": "^10.1.1"
 	},
 	"devDependencies": {
-		"@eslint/js": "^9.39.2",
-		"@tanstack/router-plugin": "^1.142.6",
-		"@types/node": "^25.0.3",
-		"@types/react": "^19.2.7",
-		"@types/react-dom": "^19.2.3",
-		"@vitejs/plugin-react": "^5.1.2",
-		"eslint": "^9.39.2",
-		"eslint-plugin-react-hooks": "^7.0.1",
-		"eslint-plugin-react-refresh": "^0.4.26",
-		"globals": "^16.5.0",
-		"typescript": "^5.9.3",
-		"typescript-eslint": "^8.50.0",
-		"vite": "^7.3.0"
+		"@eslint/js": "^10.0.1",
+		"@tanstack/router-plugin": "^1.168.32",
+		"@types/node": "^26.2.0",
+		"@types/react": "^19.2.18",
+		"@types/react-dom": "^19.2.4",
+		"@vitejs/plugin-react": "^6.0.5",
+		"eslint": "^10.8.1",
+		"eslint-plugin-react-hooks": "^7.1.1",
+		"eslint-plugin-react-refresh": "^0.5.4",
+		"globals": "^17.11.0",
+		"typescript": "^6.0.3",
+		"typescript-eslint": "^8.67.0",
+		"vite": "^8.2.1"
 	}
 }

src/components/ciphers/CipherWrapper.tsx

@@ -46,6 +46,7 @@ export function CipherWrapper({
 					{
 						cipherInfo.explanation.map((line, index) => (
 							<p
+								// eslint-disable-next-line @eslint-react/no-array-index-key
 								key={index}
 								className="w-full text-justify"
 							>
@@ -65,6 +66,7 @@ export function CipherWrapper({
 					{
 						cipherInfo.facts.map((fact, index) => (
 							<p
+								// eslint-disable-next-line @eslint-react/no-array-index-key
 								key={index}
 								className="w-full text-justify"
 							>

src/components/ciphers/combination/adfgvx/ADFGVXInputs.tsx

@@ -28,6 +28,7 @@ export default function ADFGVXInputs(){
 	//Do coding with a delay
 	const performCoding = useDebouncedCallback(() => {
 		if((input === "") || (keyword.length < 2)){
+			// eslint-disable-next-line @eslint-react/set-state-in-effect
 			setOutput("");
 			return;
 		}
@@ -64,14 +65,16 @@ export default function ADFGVXInputs(){
 	//When the mutation is successful set the new output
 	useEffect(() => {
 		if(decodeADFGVXMutation.isSuccess){
+			// eslint-disable-next-line @eslint-react/set-state-in-effect,react-hooks/set-state-in-effect
 			setOutput(decodeADFGVXMutation.data.outputString ?? "");
 			decodeADFGVXMutation.reset();
 		}
 		if(encodeADFGVXMutation.isSuccess){
+			// eslint-disable-next-line @eslint-react/set-state-in-effect
 			setOutput(encodeADFGVXMutation.data.outputString ?? "");
 			encodeADFGVXMutation.reset();
 		}
-		// eslint-disable-next-line react-hooks/exhaustive-deps
+		// eslint-disable-next-line @eslint-react/exhaustive-deps,react-hooks/exhaustive-deps
 	}, [ decodeADFGVXMutation.isSuccess, encodeADFGVXMutation.isSuccess, decodeADFGVXMutation.data, encodeADFGVXMutation.data ]);
 
 	//When the mutation has an error, display the message
@@ -84,7 +87,7 @@ export default function ADFGVXInputs(){
 			addDanger(encodeADFGVXMutation.error.message);
 			encodeADFGVXMutation.reset();
 		}
-		// eslint-disable-next-line react-hooks/exhaustive-deps
+		// eslint-disable-next-line @eslint-react/exhaustive-deps,react-hooks/exhaustive-deps
 	}, [ decodeADFGVXMutation.isError, encodeADFGVXMutation.isError ]);
 
 
@@ -122,7 +125,7 @@ export default function ADFGVXInputs(){
 				<TextInput
 					placeholder="Square Keyword"
 					value={squareKeyword}
-					onChange={(e) => setSquareKeyword(e.target.value)}
+					onChange={setSquareKeyword}
 					labelClassName="bg-(--bg-color) text-(--text-color)"
 				/>
 				<InputMessage

src/components/ciphers/combination/adfgx/ADFGXInputs.tsx

@@ -28,6 +28,7 @@ export default function ADFGXInputs(){
 	//Do coding with a delay
 	const performCoding = useDebouncedCallback(() => {
 		if((input === "") || (keyword.length < 2)){
+			// eslint-disable-next-line @eslint-react/set-state-in-effect
 			setOutput("");
 			return;
 		}
@@ -64,14 +65,16 @@ export default function ADFGXInputs(){
 	//When the mutation is successful set the new output
 	useEffect(() => {
 		if(decodeADFGXMutation.isSuccess){
+			// eslint-disable-next-line @eslint-react/set-state-in-effect,react-hooks/set-state-in-effect
 			setOutput(decodeADFGXMutation.data.outputString ?? "");
 			decodeADFGXMutation.reset();
 		}
 		if(encodeADFGXMutation.isSuccess){
+			// eslint-disable-next-line @eslint-react/set-state-in-effect
 			setOutput(encodeADFGXMutation.data.outputString ?? "");
 			encodeADFGXMutation.reset();
 		}
-		// eslint-disable-next-line react-hooks/exhaustive-deps
+		// eslint-disable-next-line @eslint-react/exhaustive-deps,react-hooks/exhaustive-deps
 	}, [ decodeADFGXMutation.isSuccess, encodeADFGXMutation.isSuccess, decodeADFGXMutation.data, encodeADFGXMutation.data ]);
 
 	//When the mutation has an error, display the message
@@ -84,7 +87,7 @@ export default function ADFGXInputs(){
 			addDanger(encodeADFGXMutation.error.message);
 			encodeADFGXMutation.reset();
 		}
-		// eslint-disable-next-line react-hooks/exhaustive-deps
+		// eslint-disable-next-line @eslint-react/exhaustive-deps,react-hooks/exhaustive-deps
 	}, [ decodeADFGXMutation.isError, encodeADFGXMutation.isError ]);
 
 
@@ -121,7 +124,7 @@ export default function ADFGXInputs(){
 				/>
 				<TextInput
 					value={squareKeyword}
-					onChange={(e) => setSquareKeyword(e.target.value)}
+					onChange={setSquareKeyword}
 					placeholder="Square Keyword"
 					labelClassName="bg-(--bg-color) text-(--text-color)"
 				/>

src/components/ciphers/monosubstitution/affine/AffineInputs.tsx

@@ -29,6 +29,7 @@ export default function AffineInputs(){
 	//Do coding with a delay
 	const performCoding = useDebouncedCallback(() => {
 		if(input === ""){
+			// eslint-disable-next-line @eslint-react/set-state-in-effect
 			setOutput("");
 			return;
 		}
@@ -65,14 +66,16 @@ export default function AffineInputs(){
 	//When the mutation is successful set the new output
 	useEffect(() => {
 		if(decodeAffineMutation.isSuccess){
+			// eslint-disable-next-line @eslint-react/set-state-in-effect,react-hooks/set-state-in-effect
 			setOutput(decodeAffineMutation.data.outputString ?? "");
 			decodeAffineMutation.reset();
 		}
 		if(encodeAffineMutation.isSuccess){
+			// eslint-disable-next-line @eslint-react/set-state-in-effect
 			setOutput(encodeAffineMutation.data.outputString ?? "");
 			encodeAffineMutation.reset();
 		}
-		// eslint-disable-next-line react-hooks/exhaustive-deps
+		// eslint-disable-next-line @eslint-react/exhaustive-deps,react-hooks/exhaustive-deps
 	}, [ decodeAffineMutation.isSuccess, encodeAffineMutation.isSuccess, decodeAffineMutation.data, encodeAffineMutation.data ]);
 
 	//When the mutation has an error, display the message
@@ -85,7 +88,7 @@ export default function AffineInputs(){
 			addDanger(encodeAffineMutation.error.message);
 			encodeAffineMutation.reset();
 		}
-		// eslint-disable-next-line react-hooks/exhaustive-deps
+		// eslint-disable-next-line @eslint-react/exhaustive-deps,react-hooks/exhaustive-deps
 	}, [ decodeAffineMutation.isError, encodeAffineMutation.isError ]);
 
 

src/components/ciphers/monosubstitution/atbash/AtbashInputs.tsx

@@ -25,6 +25,7 @@ export default function AtbashInputs(){
 	//Do coding with a delay
 	const performCoding = useDebouncedCallback(() => {
 		if(input === ""){
+			// eslint-disable-next-line @eslint-react/set-state-in-effect
 			setOutput("");
 			return;
 		}
@@ -57,14 +58,16 @@ export default function AtbashInputs(){
 	//When the mutation is successful set the new output
 	useEffect(() => {
 		if(decodeAtbashMutation.isSuccess){
+			// eslint-disable-next-line @eslint-react/set-state-in-effect,react-hooks/set-state-in-effect
 			setOutput(decodeAtbashMutation.data.outputString ?? "");
 			decodeAtbashMutation.reset();
 		}
 		if(encodeAtbashMutation.isSuccess){
+			// eslint-disable-next-line @eslint-react/set-state-in-effect
 			setOutput(encodeAtbashMutation.data.outputString ?? "");
 			encodeAtbashMutation.reset();
 		}
-		// eslint-disable-next-line react-hooks/exhaustive-deps
+		// eslint-disable-next-line @eslint-react/exhaustive-deps,react-hooks/exhaustive-deps
 	}, [ decodeAtbashMutation.isSuccess, encodeAtbashMutation.isSuccess, decodeAtbashMutation.data, encodeAtbashMutation.data ]);
 
 	//When the mutation has an error, display the message
@@ -77,7 +80,7 @@ export default function AtbashInputs(){
 			addDanger(encodeAtbashMutation.error.message);
 			encodeAtbashMutation.reset();
 		}
-		// eslint-disable-next-line react-hooks/exhaustive-deps
+		// eslint-disable-next-line @eslint-react/exhaustive-deps,react-hooks/exhaustive-deps
 	}, [ decodeAtbashMutation, encodeAtbashMutation ]);
 
 

src/components/ciphers/monosubstitution/autokey/AutokeyInputs.tsx

@@ -27,6 +27,7 @@ export default function AutokeyInputs(){
 	//Do coding with a delay
 	const performCoding = useDebouncedCallback(() => {
 		if((input === "") || (keyword.length < 2)){
+			// eslint-disable-next-line @eslint-react/set-state-in-effect
 			setOutput("");
 			return;
 		}
@@ -61,14 +62,16 @@ export default function AutokeyInputs(){
 	//When the mutation is successful set the new output
 	useEffect(() => {
 		if(decodeAutokeyMutation.isSuccess){
+			// eslint-disable-next-line @eslint-react/set-state-in-effect,react-hooks/set-state-in-effect
 			setOutput(decodeAutokeyMutation.data.outputString ?? "");
 			decodeAutokeyMutation.reset();
 		}
 		if(encodeAutokeyMutation.isSuccess){
+			// eslint-disable-next-line @eslint-react/set-state-in-effect
 			setOutput(encodeAutokeyMutation.data.outputString ?? "");
 			encodeAutokeyMutation.reset();
 		}
-		// eslint-disable-next-line react-hooks/exhaustive-deps
+		// eslint-disable-next-line @eslint-react/exhaustive-deps,react-hooks/exhaustive-deps
 	}, [ decodeAutokeyMutation.isSuccess, encodeAutokeyMutation.isSuccess, decodeAutokeyMutation.data, encodeAutokeyMutation.data ]);
 
 	//When the mutation has an error, display the message
@@ -81,7 +84,7 @@ export default function AutokeyInputs(){
 			addDanger(encodeAutokeyMutation.error.message);
 			encodeAutokeyMutation.reset();
 		}
-		// eslint-disable-next-line react-hooks/exhaustive-deps
+		// eslint-disable-next-line @eslint-react/exhaustive-deps,react-hooks/exhaustive-deps
 	}, [ decodeAutokeyMutation.isError, encodeAutokeyMutation.isError ]);
 
 

src/components/ciphers/monosubstitution/baconian/BaconianInputs.tsx

@@ -23,6 +23,7 @@ export default function BaconianInputs(){
 	//Do coding with a delay
 	const performCoding = useDebouncedCallback(() => {
 		if(input === ""){
+			// eslint-disable-next-line @eslint-react/set-state-in-effect
 			setOutput("");
 			return;
 		}
@@ -51,14 +52,16 @@ export default function BaconianInputs(){
 	//When the mutation is successful set the new output
 	useEffect(() => {
 		if(decodeBaconianMutation.isSuccess){
+			// eslint-disable-next-line @eslint-react/set-state-in-effect,react-hooks/set-state-in-effect
 			setOutput(decodeBaconianMutation.data.outputString ?? "");
 			decodeBaconianMutation.reset();
 		}
 		if(encodeBaconianMutation.isSuccess){
+			// eslint-disable-next-line @eslint-react/set-state-in-effect
 			setOutput(encodeBaconianMutation.data.outputString ?? "");
 			encodeBaconianMutation.reset();
 		}
-		// eslint-disable-next-line react-hooks/exhaustive-deps
+		// eslint-disable-next-line @eslint-react/exhaustive-deps,react-hooks/exhaustive-deps
 	}, [ decodeBaconianMutation.isSuccess, encodeBaconianMutation.isSuccess, decodeBaconianMutation.data, encodeBaconianMutation.data ]);
 
 	//When the mutation has an error, display the message
@@ -71,7 +74,7 @@ export default function BaconianInputs(){
 			addDanger(encodeBaconianMutation.error.message);
 			encodeBaconianMutation.reset();
 		}
-		// eslint-disable-next-line react-hooks/exhaustive-deps
+		// eslint-disable-next-line @eslint-react/exhaustive-deps,react-hooks/exhaustive-deps
 	}, [ decodeBaconianMutation.isError, encodeBaconianMutation.isError ]);
 
 

src/components/ciphers/monosubstitution/basex/BaseXInputs.tsx

@@ -23,6 +23,7 @@ export default function BaseXInputs(){
 	//Do coding with a delay
 	const performCoding = useDebouncedCallback(() => {
 		if(input === ""){
+			// eslint-disable-next-line @eslint-react/set-state-in-effect
 			setOutput("");
 			return;
 		}
@@ -51,14 +52,16 @@ export default function BaseXInputs(){
 	//When the mutations is successful set the new output
 	useEffect(() => {
 		if(decodeBaseXMutation.isSuccess){
+			// eslint-disable-next-line @eslint-react/set-state-in-effect,react-hooks/set-state-in-effect
 			setOutput(decodeBaseXMutation.data.outputString ?? "");
 			decodeBaseXMutation.reset();
 		}
 		if(encodeBaseXMutation.isSuccess){
+			// eslint-disable-next-line @eslint-react/set-state-in-effect
 			setOutput(encodeBaseXMutation.data.outputString ?? "");
 			encodeBaseXMutation.reset();
 		}
-		// eslint-disable-next-line react-hooks/exhaustive-deps
+		// eslint-disable-next-line @eslint-react/exhaustive-deps,react-hooks/exhaustive-deps
 	}, [ decodeBaseXMutation.isSuccess, encodeBaseXMutation.isSuccess, decodeBaseXMutation.data, encodeBaseXMutation.data ]);
 
 	//When the mutation has an error, display the message
@@ -71,7 +74,7 @@ export default function BaseXInputs(){
 			addDanger(encodeBaseXMutation.error.message);
 			encodeBaseXMutation.reset();
 		}
-		// eslint-disable-next-line react-hooks/exhaustive-deps
+		// eslint-disable-next-line @eslint-react/exhaustive-deps,react-hooks/exhaustive-deps
 	}, [ decodeBaseXMutation.isError, encodeBaseXMutation.isError ]);
 
 

src/components/ciphers/monosubstitution/beaufort/BeaufortInputs.tsx

@@ -27,6 +27,7 @@ export default function BeaufortInputs(){
 	//Do coding with a delay
 	const performCoding = useDebouncedCallback(() => {
 		if((input === "") || (keyword.length < 2)){
+			// eslint-disable-next-line @eslint-react/set-state-in-effect
 			setOutput("");
 			return;
 		}
@@ -61,14 +62,16 @@ export default function BeaufortInputs(){
 	//When the mutation is successful set the new output
 	useEffect(() => {
 		if(decodeBeaufortMutation.isSuccess){
+			// eslint-disable-next-line @eslint-react/set-state-in-effect,react-hooks/set-state-in-effect
 			setOutput(decodeBeaufortMutation.data.outputString ?? "");
 			decodeBeaufortMutation.reset();
 		}
 		if(encodeBeaufortMutation.isSuccess){
+			// eslint-disable-next-line @eslint-react/set-state-in-effect
 			setOutput(encodeBeaufortMutation.data.outputString ?? "");
 			encodeBeaufortMutation.reset();
 		}
-		// eslint-disable-next-line react-hooks/exhaustive-deps
+		// eslint-disable-next-line @eslint-react/exhaustive-deps,react-hooks/exhaustive-deps
 	}, [ decodeBeaufortMutation.isSuccess, encodeBeaufortMutation.isSuccess, decodeBeaufortMutation.data, encodeBeaufortMutation.data ]);
 
 	//When the mutation has an error, display the message
@@ -81,7 +84,7 @@ export default function BeaufortInputs(){
 			addDanger(encodeBeaufortMutation.error.message);
 			encodeBeaufortMutation.reset();
 		}
-		// eslint-disable-next-line react-hooks/exhaustive-deps
+		// eslint-disable-next-line @eslint-react/exhaustive-deps,react-hooks/exhaustive-deps
 	}, [ decodeBeaufortMutation.isError, encodeBeaufortMutation.isError ]);
 
 

src/components/ciphers/monosubstitution/caesar/CaesarInputs.tsx

@@ -27,6 +27,7 @@ export default function CaesarInputs(){
 	//Do coding with a delay
 	const performCoding = useDebouncedCallback(() => {
 		if(input === ""){
+			// eslint-disable-next-line @eslint-react/set-state-in-effect
 			setOutput("");
 			return;
 		}
@@ -61,14 +62,16 @@ export default function CaesarInputs(){
 	//When the mutation is successful set the new output
 	useEffect(() => {
 		if(decodeCaesarMutation.isSuccess){
+			// eslint-disable-next-line @eslint-react/set-state-in-effect,react-hooks/set-state-in-effect
 			setOutput(decodeCaesarMutation.data.outputString ?? "");
 			decodeCaesarMutation.reset();
 		}
 		if(encodeCaesarMutation.isSuccess){
+			// eslint-disable-next-line @eslint-react/set-state-in-effect
 			setOutput(encodeCaesarMutation.data.outputString ?? "");
 			encodeCaesarMutation.reset();
 		}
-		// eslint-disable-next-line react-hooks/exhaustive-deps
+		// eslint-disable-next-line @eslint-react/exhaustive-deps,react-hooks/exhaustive-deps
 	}, [ decodeCaesarMutation.isSuccess, encodeCaesarMutation.isSuccess, decodeCaesarMutation.data, encodeCaesarMutation.data ]);
 
 	//When the mutation has an error, display the message
@@ -81,7 +84,7 @@ export default function CaesarInputs(){
 			addDanger(encodeCaesarMutation.error.message);
 			encodeCaesarMutation.reset();
 		}
-		// eslint-disable-next-line react-hooks/exhaustive-deps
+		// eslint-disable-next-line @eslint-react/exhaustive-deps,react-hooks/exhaustive-deps
 	}, [ decodeCaesarMutation.isError, encodeCaesarMutation.isError ]);
 
 

src/components/ciphers/monosubstitution/onetimepad/OneTimePadInputs.tsx

@@ -27,6 +27,7 @@ export default function OneTimePadInputs(){
 	//Do coding with a delay
 	const performCoding = useDebouncedCallback(() => {
 		if((input === "") || (keyword.length < input.length)){
+			// eslint-disable-next-line @eslint-react/set-state-in-effect
 			setOutput("");
 			return;
 		}
@@ -61,14 +62,16 @@ export default function OneTimePadInputs(){
 	//When the mutation is successful set the new output
 	useEffect(() => {
 		if(decodeOneTimePadMutation.isSuccess){
+			// eslint-disable-next-line @eslint-react/set-state-in-effect,react-hooks/set-state-in-effect
 			setOutput(decodeOneTimePadMutation.data.outputString ?? "");
 			decodeOneTimePadMutation.reset();
 		}
 		if(encodeOneTimePadMutation.isSuccess){
+			// eslint-disable-next-line @eslint-react/set-state-in-effect
 			setOutput(encodeOneTimePadMutation.data.outputString ?? "");
 			encodeOneTimePadMutation.reset();
 		}
-		// eslint-disable-next-line react-hooks/exhaustive-deps
+		// eslint-disable-next-line @eslint-react/exhaustive-deps,react-hooks/exhaustive-deps
 	}, [ decodeOneTimePadMutation.isSuccess, encodeOneTimePadMutation.isSuccess, decodeOneTimePadMutation.data, encodeOneTimePadMutation.data ]);
 
 	//When the mutation has an error, display the message
@@ -81,7 +84,7 @@ export default function OneTimePadInputs(){
 			addDanger(encodeOneTimePadMutation.error.message);
 			encodeOneTimePadMutation.reset();
 		}
-		// eslint-disable-next-line react-hooks/exhaustive-deps
+		// eslint-disable-next-line @eslint-react/exhaustive-deps,react-hooks/exhaustive-deps
 	}, [ decodeOneTimePadMutation.isError, encodeOneTimePadMutation.isError ]);
 
 

src/components/ciphers/monosubstitution/porta/PortaInputs.tsx

@@ -27,6 +27,7 @@ export default function PortaInputs(){
 	//Do coding with a delay
 	const performCoding = useDebouncedCallback(() => {
 		if((input === "") || (keyword.length < 2)){
+			// eslint-disable-next-line @eslint-react/set-state-in-effect
 			setOutput("");
 			return;
 		}
@@ -61,14 +62,16 @@ export default function PortaInputs(){
 	//When the mutation is successful set the new output
 	useEffect(() => {
 		if(decodePortaMutation.isSuccess){
+			// eslint-disable-next-line @eslint-react/set-state-in-effect,react-hooks/set-state-in-effect
 			setOutput(decodePortaMutation.data.outputString ?? "");
 			decodePortaMutation.reset();
 		}
 		if(encodePortaMutation.isSuccess){
+			// eslint-disable-next-line @eslint-react/set-state-in-effect
 			setOutput(encodePortaMutation.data.outputString ?? "");
 			encodePortaMutation.reset();
 		}
-		// eslint-disable-next-line react-hooks/exhaustive-deps
+		// eslint-disable-next-line @eslint-react/exhaustive-deps,react-hooks/exhaustive-deps
 	}, [ decodePortaMutation.isSuccess, encodePortaMutation.isSuccess, decodePortaMutation.data, encodePortaMutation.data ]);
 
 	//When the mutation has an error, display the message
@@ -81,7 +84,7 @@ export default function PortaInputs(){
 			addDanger(encodePortaMutation.error.message);
 			encodePortaMutation.reset();
 		}
-		// eslint-disable-next-line react-hooks/exhaustive-deps
+		// eslint-disable-next-line @eslint-react/exhaustive-deps,react-hooks/exhaustive-deps
 	}, [ decodePortaMutation.isError, encodePortaMutation.isError ]);
 
 

src/components/ciphers/monosubstitution/substitution/SubstitutionInputs.tsx

@@ -27,6 +27,7 @@ export default function SubstitutionInputs(){
 	//Do coding with a delay
 	const performCoding = useDebouncedCallback(() => {
 		if((input === "") || ((keyword.length !== 26) && (keyword.length !== 36))){
+			// eslint-disable-next-line @eslint-react/set-state-in-effect
 			setOutput("");
 			return;
 		}
@@ -61,14 +62,16 @@ export default function SubstitutionInputs(){
 	//When the mutation is successful set the new output
 	useEffect(() => {
 		if(decodeSubstitutionMutation.isSuccess){
+			// eslint-disable-next-line @eslint-react/set-state-in-effect,react-hooks/set-state-in-effect
 			setOutput(decodeSubstitutionMutation.data.outputString ?? "");
 			decodeSubstitutionMutation.reset();
 		}
 		if(encodeSubstitutionMutation.isSuccess){
+			// eslint-disable-next-line @eslint-react/set-state-in-effect
 			setOutput(encodeSubstitutionMutation.data.outputString ?? "");
 			encodeSubstitutionMutation.reset();
 		}
-		// eslint-disable-next-line react-hooks/exhaustive-deps
+		// eslint-disable-next-line @eslint-react/exhaustive-deps,react-hooks/exhaustive-deps
 	}, [ decodeSubstitutionMutation.isSuccess, encodeSubstitutionMutation.isSuccess, decodeSubstitutionMutation.data, encodeSubstitutionMutation.data ]);
 
 	//When the mutation has an error, display the message
@@ -81,7 +84,7 @@ export default function SubstitutionInputs(){
 			addDanger(encodeSubstitutionMutation.error.message);
 			encodeSubstitutionMutation.reset();
 		}
-		// eslint-disable-next-line react-hooks/exhaustive-deps
+		// eslint-disable-next-line @eslint-react/exhaustive-deps,react-hooks/exhaustive-deps
 	}, [ decodeSubstitutionMutation.isError, encodeSubstitutionMutation.isError ]);
 
 

src/components/ciphers/monosubstitution/vigenere/VigenereInputs.tsx

@@ -27,6 +27,7 @@ export default function VigenereInputs(){
 	//Do coding with a delay
 	const performCoding = useDebouncedCallback(() => {
 		if((input === "") || (keyword.length < 2)){
+			// eslint-disable-next-line @eslint-react/set-state-in-effect
 			setOutput("");
 			return;
 		}
@@ -61,14 +62,16 @@ export default function VigenereInputs(){
 	//When the mutation is successful set the new output
 	useEffect(() => {
 		if(decodeVigenereMutation.isSuccess){
+			// eslint-disable-next-line @eslint-react/set-state-in-effect,react-hooks/set-state-in-effect
 			setOutput(decodeVigenereMutation.data.outputString ?? "");
 			decodeVigenereMutation.reset();
 		}
 		if(encodeVigenereMutation.isSuccess){
+			// eslint-disable-next-line @eslint-react/set-state-in-effect
 			setOutput(encodeVigenereMutation.data.outputString ?? "");
 			encodeVigenereMutation.reset();
 		}
-		// eslint-disable-next-line react-hooks/exhaustive-deps
+		// eslint-disable-next-line @eslint-react/exhaustive-deps,react-hooks/exhaustive-deps
 	}, [ decodeVigenereMutation.isSuccess, encodeVigenereMutation.isSuccess, decodeVigenereMutation.data, encodeVigenereMutation.data ]);
 
 	//When the mutation has an error, display the message
@@ -81,7 +84,7 @@ export default function VigenereInputs(){
 			addDanger(encodeVigenereMutation.error.message);
 			encodeVigenereMutation.reset();
 		}
-		// eslint-disable-next-line react-hooks/exhaustive-deps
+		// eslint-disable-next-line @eslint-react/exhaustive-deps,react-hooks/exhaustive-deps
 	}, [ decodeVigenereMutation.isError, encodeVigenereMutation.isError ]);
 
 

src/components/ciphers/polysubstitution/bifid/BifidInputs.tsx

@@ -27,6 +27,7 @@ export default function BifidInputs(){
 	//Do coding with a delay
 	const performCoding = useDebouncedCallback(() => {
 		if(input === ""){
+			// eslint-disable-next-line @eslint-react/set-state-in-effect
 			setOutput("");
 			return;
 		}
@@ -61,14 +62,16 @@ export default function BifidInputs(){
 	//When the mutation is successful set the new output
 	useEffect(() => {
 		if(decodeBifidMutation.isSuccess){
+			// eslint-disable-next-line @eslint-react/set-state-in-effect,react-hooks/set-state-in-effect
 			setOutput(decodeBifidMutation.data.outputString ?? "");
 			decodeBifidMutation.reset();
 		}
 		if(encodeBifidMutation.isSuccess){
+			// eslint-disable-next-line @eslint-react/set-state-in-effect
 			setOutput(encodeBifidMutation.data.outputString ?? "");
 			encodeBifidMutation.reset();
 		}
-		// eslint-disable-next-line react-hooks/exhaustive-deps
+		// eslint-disable-next-line @eslint-react/exhaustive-deps,react-hooks/exhaustive-deps
 	}, [ decodeBifidMutation.isSuccess, encodeBifidMutation.isSuccess, decodeBifidMutation.data, encodeBifidMutation.data ]);
 
 	//When the mutation has an error, display the message
@@ -81,7 +84,7 @@ export default function BifidInputs(){
 			addDanger(encodeBifidMutation.error.message);
 			encodeBifidMutation.reset();
 		}
-		// eslint-disable-next-line react-hooks/exhaustive-deps
+		// eslint-disable-next-line @eslint-react/exhaustive-deps,react-hooks/exhaustive-deps
 	}, [ decodeBifidMutation.isError, encodeBifidMutation.isError ]);
 
 

src/components/ciphers/polysubstitution/columnar/ColumnarInputs.tsx

@@ -27,6 +27,7 @@ export default function ColumnarInputs(){
 	//Do coding with a delay
 	const performCoding = useDebouncedCallback(() => {
 		if((input === "") || (keyword.length < 2)){
+			// eslint-disable-next-line @eslint-react/set-state-in-effect
 			setOutput("");
 			return;
 		}
@@ -61,14 +62,16 @@ export default function ColumnarInputs(){
 	//When the mutation is successful set the new output
 	useEffect(() => {
 		if(decodeColumnarMutation.isSuccess){
+			// eslint-disable-next-line @eslint-react/set-state-in-effect,react-hooks/set-state-in-effect
 			setOutput(decodeColumnarMutation.data.outputString ?? "");
 			decodeColumnarMutation.reset();
 		}
 		if(encodeColumnarMutation.isSuccess){
+			// eslint-disable-next-line @eslint-react/set-state-in-effect
 			setOutput(encodeColumnarMutation.data.outputString ?? "");
 			encodeColumnarMutation.reset();
 		}
-		// eslint-disable-next-line react-hooks/exhaustive-deps
+		// eslint-disable-next-line @eslint-react/exhaustive-deps,react-hooks/exhaustive-deps
 	}, [ decodeColumnarMutation.isSuccess, encodeColumnarMutation.isSuccess, decodeColumnarMutation.data, encodeColumnarMutation.data ]);
 
 	//When the mutation has an error, display the message
@@ -81,7 +84,7 @@ export default function ColumnarInputs(){
 			addDanger(encodeColumnarMutation.error.message);
 			encodeColumnarMutation.reset();
 		}
-		// eslint-disable-next-line react-hooks/exhaustive-deps
+		// eslint-disable-next-line @eslint-react/exhaustive-deps,react-hooks/exhaustive-deps
 	}, [ decodeColumnarMutation.isError, encodeColumnarMutation.isError ]);
 
 

src/components/ciphers/polysubstitution/hill/HillInputs.tsx

@@ -27,6 +27,7 @@ export default function HillInputs(){
 	//Do coding with a delay
 	const performCoding = useDebouncedCallback(() => {
 		if(input === ""){
+			// eslint-disable-next-line @eslint-react/set-state-in-effect
 			setOutput("");
 			return;
 		}
@@ -61,14 +62,16 @@ export default function HillInputs(){
 	//When the mutation is successful set the new output
 	useEffect(() => {
 		if(decodeHillMutation.isSuccess){
+			// eslint-disable-next-line @eslint-react/set-state-in-effect,react-hooks/set-state-in-effect
 			setOutput(decodeHillMutation.data.outputString ?? "");
 			decodeHillMutation.reset();
 		}
 		if(encodeHillMutation.isSuccess){
+			// eslint-disable-next-line @eslint-react/set-state-in-effect
 			setOutput(encodeHillMutation.data.outputString ?? "");
 			encodeHillMutation.reset();
 		}
-		// eslint-disable-next-line react-hooks/exhaustive-deps
+		// eslint-disable-next-line @eslint-react/exhaustive-deps,react-hooks/exhaustive-deps
 	}, [ decodeHillMutation.isSuccess, encodeHillMutation.isSuccess, decodeHillMutation.data, encodeHillMutation.data ]);
 
 	//When the mutation has an error, display the message
@@ -81,7 +84,7 @@ export default function HillInputs(){
 			addDanger(encodeHillMutation.error.message);
 			encodeHillMutation.reset();
 		}
-		// eslint-disable-next-line react-hooks/exhaustive-deps
+		// eslint-disable-next-line @eslint-react/exhaustive-deps,react-hooks/exhaustive-deps
 	}, [ decodeHillMutation.isError, encodeHillMutation.isError ]);
 
 

src/components/ciphers/polysubstitution/morse/MorseInputs.tsx

@@ -21,6 +21,7 @@ export default function MorseInputs(){
 	//Do coding with a delay
 	const performCoding = useDebouncedCallback(() => {
 		if(input === ""){
+			// eslint-disable-next-line @eslint-react/set-state-in-effect
 			setOutput("");
 			return;
 		}
@@ -47,14 +48,16 @@ export default function MorseInputs(){
 	//When the mutation is successful set the new output
 	useEffect(() => {
 		if(decodeMorseMutation.isSuccess){
+			// eslint-disable-next-line @eslint-react/set-state-in-effect,react-hooks/set-state-in-effect
 			setOutput(decodeMorseMutation.data.outputString ?? "");
 			decodeMorseMutation.reset();
 		}
 		if(encodeMorseMutation.isSuccess){
+			// eslint-disable-next-line @eslint-react/set-state-in-effect
 			setOutput(encodeMorseMutation.data.outputString ?? "");
 			encodeMorseMutation.reset();
 		}
-		// eslint-disable-next-line react-hooks/exhaustive-deps
+		// eslint-disable-next-line @eslint-react/exhaustive-deps,react-hooks/exhaustive-deps
 	}, [ decodeMorseMutation.isSuccess, encodeMorseMutation.isSuccess, decodeMorseMutation.data, encodeMorseMutation.data ]);
 
 	//When the mutation has an error, display the message
@@ -67,7 +70,7 @@ export default function MorseInputs(){
 			addDanger(encodeMorseMutation.error.message);
 			encodeMorseMutation.reset();
 		}
-		// eslint-disable-next-line react-hooks/exhaustive-deps
+		// eslint-disable-next-line @eslint-react/exhaustive-deps,react-hooks/exhaustive-deps
 	}, [ decodeMorseMutation.isError, encodeMorseMutation.isError ]);
 
 

src/components/ciphers/polysubstitution/playfair/PlayfairInputs.tsx

@@ -27,6 +27,7 @@ export default function PlayfairInputs(){
 	//Do coding with a delay
 	const performCoding = useDebouncedCallback(() => {
 		if(input === ""){
+			// eslint-disable-next-line @eslint-react/set-state-in-effect
 			setOutput("");
 			return;
 		}
@@ -61,14 +62,16 @@ export default function PlayfairInputs(){
 	//When the mutation is successful set the new output
 	useEffect(() => {
 		if(decodePlayfairMutation.isSuccess){
+			// eslint-disable-next-line @eslint-react/set-state-in-effect,react-hooks/set-state-in-effect
 			setOutput(decodePlayfairMutation.data.outputString ?? "");
 			decodePlayfairMutation.reset();
 		}
 		if(encodePlayfairMutation.isSuccess){
+			// eslint-disable-next-line @eslint-react/set-state-in-effect
 			setOutput(encodePlayfairMutation.data.outputString ?? "");
 			encodePlayfairMutation.reset();
 		}
-		// eslint-disable-next-line react-hooks/exhaustive-deps
+		// eslint-disable-next-line @eslint-react/exhaustive-deps,react-hooks/exhaustive-deps
 	}, [ decodePlayfairMutation.isSuccess, encodePlayfairMutation.isSuccess, decodePlayfairMutation.data, encodePlayfairMutation.data ]);
 
 	//When the mutation has an error, display the message
@@ -81,7 +84,7 @@ export default function PlayfairInputs(){
 			addDanger(encodePlayfairMutation.error.message);
 			encodePlayfairMutation.reset();
 		}
-		// eslint-disable-next-line react-hooks/exhaustive-deps
+		// eslint-disable-next-line @eslint-react/exhaustive-deps,react-hooks/exhaustive-deps
 	}, [ decodePlayfairMutation.isError, encodePlayfairMutation.isError ]);
 
 

src/components/ciphers/polysubstitution/polybius/PolybiusInputs.tsx

@@ -26,6 +26,7 @@ export default function PolybiusInputs(){
 	//Do coding with a delay
 	const performCoding = useDebouncedCallback(() => {
 		if (input === "") {
+			// eslint-disable-next-line @eslint-react/set-state-in-effect
 			setOutput("");
 			return;
 		}
@@ -58,14 +59,16 @@ export default function PolybiusInputs(){
 	//When the mutation is successful set the new output
 	useEffect(() => {
 		if(decodePolybiusMutation.isSuccess){
+			// eslint-disable-next-line @eslint-react/set-state-in-effect,react-hooks/set-state-in-effect
 			setOutput(decodePolybiusMutation.data.outputString ?? "");
 			decodePolybiusMutation.reset();
 		}
 		if(encodePolybiusMutation.isSuccess){
+			// eslint-disable-next-line @eslint-react/set-state-in-effect
 			setOutput(encodePolybiusMutation.data.outputString ?? "");
 			encodePolybiusMutation.reset();
 		}
-		// eslint-disable-next-line react-hooks/exhaustive-deps
+		// eslint-disable-next-line @eslint-react/exhaustive-deps,react-hooks/exhaustive-deps
 	}, [ decodePolybiusMutation.isSuccess, encodePolybiusMutation.isSuccess, decodePolybiusMutation.data, encodePolybiusMutation.data ]);
 
 	//When the mutation has an error, display the message
@@ -78,7 +81,7 @@ export default function PolybiusInputs(){
 			addDanger(encodePolybiusMutation.error.message);
 			encodePolybiusMutation.reset();
 		}
-		// eslint-disable-next-line react-hooks/exhaustive-deps
+		// eslint-disable-next-line @eslint-react/exhaustive-deps,react-hooks/exhaustive-deps
 	}, [ decodePolybiusMutation.isError, encodePolybiusMutation.isError ]);
 
 

src/components/ciphers/polysubstitution/railfence/RailFenceInputs.tsx

@@ -27,6 +27,7 @@ export default function RaidFenceInputs(){
 	//Do coding with a delay
 	const performCoding = useDebouncedCallback(() => {
 		if(input === ""){
+			// eslint-disable-next-line @eslint-react/set-state-in-effect
 			setOutput("");
 			return;
 		}
@@ -61,14 +62,16 @@ export default function RaidFenceInputs(){
 	//When the mutation is successful set the new output
 	useEffect(() => {
 		if(decodeRailFenceMutation.isSuccess){
+			// eslint-disable-next-line @eslint-react/set-state-in-effect,react-hooks/set-state-in-effect
 			setOutput(decodeRailFenceMutation.data.outputString ?? "");
 			decodeRailFenceMutation.reset();
 		}
 		if(encodeRailFenceMutation.isSuccess){
+			// eslint-disable-next-line @eslint-react/set-state-in-effect
 			setOutput(encodeRailFenceMutation.data.outputString ?? "");
 			encodeRailFenceMutation.reset();
 		}
-		// eslint-disable-next-line react-hooks/exhaustive-deps
+		// eslint-disable-next-line @eslint-react/exhaustive-deps,react-hooks/exhaustive-deps
 	}, [ decodeRailFenceMutation.isSuccess, encodeRailFenceMutation.isSuccess, decodeRailFenceMutation.data, encodeRailFenceMutation.data ]);
 
 	//When the mutation has an error, display the message
@@ -81,7 +84,7 @@ export default function RaidFenceInputs(){
 			addDanger(encodeRailFenceMutation.error.message);
 			encodeRailFenceMutation.reset();
 		}
-		// eslint-disable-next-line react-hooks/exhaustive-deps
+		// eslint-disable-next-line @eslint-react/exhaustive-deps,react-hooks/exhaustive-deps
 	}, [ decodeRailFenceMutation.isError, encodeRailFenceMutation.isError ]);
 
 

src/components/ciphers/polysubstitution/trifid/TrifidInputs.tsx

@@ -30,6 +30,7 @@ export default function TrifidInputs(){
 	//Do coding with a delay
 	const performCoding = useDebouncedCallback(() => {
 		if (input === "") {
+			// eslint-disable-next-line @eslint-react/set-state-in-effect
 			setOutput("");
 			return;
 		}
@@ -68,14 +69,16 @@ export default function TrifidInputs(){
 	//When the mutation is successful set the new output
 	useEffect(() => {
 		if (decodeTrifidMutation.isSuccess) {
+			// eslint-disable-next-line @eslint-react/set-state-in-effect,react-hooks/set-state-in-effect
 			setOutput(decodeTrifidMutation.data.outputString ?? "");
 			decodeTrifidMutation.reset();
 		}
 		if (encodeTrifidMutation.isSuccess) {
+			// eslint-disable-next-line @eslint-react/set-state-in-effect
 			setOutput(encodeTrifidMutation.data.outputString ?? "");
 			encodeTrifidMutation.reset();
 		}
-		// eslint-disable-next-line react-hooks/exhaustive-deps
+		// eslint-disable-next-line @eslint-react/exhaustive-deps,react-hooks/exhaustive-deps
 	}, [ decodeTrifidMutation.isSuccess, encodeTrifidMutation.isSuccess, decodeTrifidMutation.data, encodeTrifidMutation.data ]);
 
 	//When the mutation has an error, display the message
@@ -88,7 +91,7 @@ export default function TrifidInputs(){
 			addDanger(encodeTrifidMutation.error.message);
 			encodeTrifidMutation.reset();
 		}
-		// eslint-disable-next-line react-hooks/exhaustive-deps
+		// eslint-disable-next-line @eslint-react/exhaustive-deps,react-hooks/exhaustive-deps
 	}, [ decodeTrifidMutation.isError, encodeTrifidMutation.isError ]);
 
 
@@ -133,7 +136,7 @@ export default function TrifidInputs(){
 				<TextInput
 					placeholder="Fill"
 					value={fill}
-					onChange={(e) => { if(e.target.value.length <= 1){ setFill(e.target.value); } }}
+					onChange={(newValue) => { if(newValue.length <= 1){ setFill(newValue); } }}
 					labelClassName="bg-(--bg-color) text-(--text-color)"
 				/>
 				<KeywordInput

src/components/input/InputMessage.tsx

@@ -15,7 +15,7 @@ export default function InputMessage({
 			<TextArea
 				placeholder="Input Message"
 				value={value}
-				onChange={(e) => onChange(e.target.value)}
+				onChange={onChange}
 				inputClassName="h-40 w-160 [resize:none]"
 				labelClassName="bg-(--bg-color) text-(--text-color) peer-focus:bg-(--bg-color) peer-focus:text-(--text-color)"
 			/>

src/components/input/KeywordArea.tsx

@@ -14,7 +14,7 @@ export default function KeywordArea({
 			<TextArea
 				placeholder="Keyword"
 				value={value}
-				onChange={(e) => onChange(e.target.value)}
+				onChange={onChange}
 				inputClassName="h-40 w-160 [resize:none]"
 				labelClassName="bg-(--bg-color) text-(--text-color) peer-focus:bg-(--bg-color) peer-focus:text-(--text-color)"
 			/>

src/components/input/KeywordInput.tsx

@@ -15,7 +15,7 @@ export default function KeywordInput({
 			<TextInput
 				placeholder="Keyword"
 				value={value}
-				onChange={(e) => onChange(e.target.value)}
+				onChange={onChange}
 				labelClassName="bg-(--bg-color) text-(--text-color) peer-focus:bg-(--bg-color) peer-focus:text-(--text-color)"
 			/>
 		</div>

src/components/input/OutputMessage.tsx

@@ -15,7 +15,7 @@ export default function OutputMessage({
 			<TextArea
 				placeholder="Output Message"
 				value={value}
-				onChange={(e) => onChange(e.target.value)}
+				onChange={onChange}
 				inputClassName="h-40 w-160 [resize:none]"
 				labelClassName="bg-(--bg-color) text-(--text-color) peer-focus:bg-(--bg-color) peer-focus:text-(--text-color)"
 				disabled={true}

src/components/input/SquareNumberArray.tsx

@@ -61,12 +61,14 @@ export default function SquareNumberArray({
 					{
 						value.map((row, rowIndex) => (
 							<tr
+								// eslint-disable-next-line @eslint-react/no-array-index-key
 								key={`squareNumberArrayRow${rowIndex}`}
 								className=""
 							>
 								{
 									row.map((cell, cellIndex) => (
 										<td
+											// eslint-disable-next-line @eslint-react/no-array-index-key
 											key={`squareNumberArrayCell${rowIndex}${cellIndex}`}
 											className="w-8 h-8 border"
 										>

src/providers/ThemeProvider.ts

@@ -1,5 +1,5 @@
 import type React from "react";
-import { createContext, useContext } from "react";
+import { createContext, use } from "react";
 
 
 export type Theme = "dark" | "light" | "system";
@@ -24,7 +24,7 @@ export const ThemeProviderContext = createContext<ThemeProviderState>(initialSta
 
 
 export const useTheme = () => {
-	const context = useContext(ThemeProviderContext);
+	const context = use(ThemeProviderContext);
 
 	if(context === undefined){
 		throw new Error("useTHeme must be used within a ThemeProvider");

src/providers/components/ThemeProviderComponent.tsx

@@ -7,7 +7,7 @@ export function ThemeProvider({
 	defaultTheme = "system",
 	storageKey = "vite-ui-theme"
 }: ThemeProviderProps){
-	const [ theme, setTheme ] = useState<Theme>(localStorage.getItem(storageKey) as Theme || defaultTheme);
+	const [ theme, setTheme ] = useState<Theme>(() => (localStorage.getItem(storageKey) as Theme) || defaultTheme);
 
 
 	useEffect(() => {
@@ -34,8 +34,8 @@ export function ThemeProvider({
 
 
 	return (
-		<ThemeProviderContext.Provider value={currentTheme}>
+		<ThemeProviderContext value={currentTheme}>
 			{children}
-		</ThemeProviderContext.Provider>
+		</ThemeProviderContext>
 	);
 }

src/routeTree.gen.ts

@@ -10,163 +10,65 @@
 
 import { Route as rootRouteImport } from './routes/__root'
 import { Route as IndexRouteImport } from './routes/index'
-import { Route as TutorialIndexRouteImport } from './routes/tutorial/index'
-import { Route as PolysubstitutionIndexRouteImport } from './routes/polysubstitution/index'
-import { Route as MonosubstitutionIndexRouteImport } from './routes/monosubstitution/index'
 import { Route as CombinationIndexRouteImport } from './routes/combination/index'
-import { Route as PolysubstitutionTrifidIndexRouteImport } from './routes/polysubstitution/trifid/index'
-import { Route as PolysubstitutionRailfenceIndexRouteImport } from './routes/polysubstitution/railfence/index'
-import { Route as PolysubstitutionPolybiusIndexRouteImport } from './routes/polysubstitution/polybius/index'
-import { Route as PolysubstitutionPlayfairIndexRouteImport } from './routes/polysubstitution/playfair/index'
-import { Route as PolysubstitutionMorseIndexRouteImport } from './routes/polysubstitution/morse/index'
-import { Route as PolysubstitutionHillIndexRouteImport } from './routes/polysubstitution/hill/index'
-import { Route as PolysubstitutionColumnarIndexRouteImport } from './routes/polysubstitution/columnar/index'
-import { Route as PolysubstitutionBifidIndexRouteImport } from './routes/polysubstitution/bifid/index'
-import { Route as MonosubstitutionVigenereIndexRouteImport } from './routes/monosubstitution/vigenere/index'
-import { Route as MonosubstitutionSubstitutionIndexRouteImport } from './routes/monosubstitution/substitution/index'
-import { Route as MonosubstitutionPortaIndexRouteImport } from './routes/monosubstitution/porta/index'
-import { Route as MonosubstitutionOnetimepadIndexRouteImport } from './routes/monosubstitution/onetimepad/index'
-import { Route as MonosubstitutionCaesarIndexRouteImport } from './routes/monosubstitution/caesar/index'
-import { Route as MonosubstitutionBeaufortIndexRouteImport } from './routes/monosubstitution/beaufort/index'
-import { Route as MonosubstitutionBasexIndexRouteImport } from './routes/monosubstitution/basex/index'
-import { Route as MonosubstitutionBaconianIndexRouteImport } from './routes/monosubstitution/baconian/index'
-import { Route as MonosubstitutionAutokeyIndexRouteImport } from './routes/monosubstitution/autokey/index'
-import { Route as MonosubstitutionAtbashIndexRouteImport } from './routes/monosubstitution/atbash/index'
-import { Route as MonosubstitutionAffineIndexRouteImport } from './routes/monosubstitution/affine/index'
-import { Route as CombinationAdfgxIndexRouteImport } from './routes/combination/adfgx/index'
+import { Route as MonosubstitutionIndexRouteImport } from './routes/monosubstitution/index'
+import { Route as PolysubstitutionIndexRouteImport } from './routes/polysubstitution/index'
+import { Route as TutorialIndexRouteImport } from './routes/tutorial/index'
 import { Route as CombinationAdfgvxIndexRouteImport } from './routes/combination/adfgvx/index'
+import { Route as CombinationAdfgxIndexRouteImport } from './routes/combination/adfgx/index'
+import { Route as MonosubstitutionAffineIndexRouteImport } from './routes/monosubstitution/affine/index'
+import { Route as MonosubstitutionAtbashIndexRouteImport } from './routes/monosubstitution/atbash/index'
+import { Route as MonosubstitutionAutokeyIndexRouteImport } from './routes/monosubstitution/autokey/index'
+import { Route as MonosubstitutionBaconianIndexRouteImport } from './routes/monosubstitution/baconian/index'
+import { Route as MonosubstitutionBasexIndexRouteImport } from './routes/monosubstitution/basex/index'
+import { Route as MonosubstitutionBeaufortIndexRouteImport } from './routes/monosubstitution/beaufort/index'
+import { Route as MonosubstitutionCaesarIndexRouteImport } from './routes/monosubstitution/caesar/index'
+import { Route as MonosubstitutionOnetimepadIndexRouteImport } from './routes/monosubstitution/onetimepad/index'
+import { Route as MonosubstitutionPortaIndexRouteImport } from './routes/monosubstitution/porta/index'
+import { Route as MonosubstitutionSubstitutionIndexRouteImport } from './routes/monosubstitution/substitution/index'
+import { Route as MonosubstitutionVigenereIndexRouteImport } from './routes/monosubstitution/vigenere/index'
+import { Route as PolysubstitutionBifidIndexRouteImport } from './routes/polysubstitution/bifid/index'
+import { Route as PolysubstitutionColumnarIndexRouteImport } from './routes/polysubstitution/columnar/index'
+import { Route as PolysubstitutionHillIndexRouteImport } from './routes/polysubstitution/hill/index'
+import { Route as PolysubstitutionMorseIndexRouteImport } from './routes/polysubstitution/morse/index'
+import { Route as PolysubstitutionPlayfairIndexRouteImport } from './routes/polysubstitution/playfair/index'
+import { Route as PolysubstitutionPolybiusIndexRouteImport } from './routes/polysubstitution/polybius/index'
+import { Route as PolysubstitutionRailfenceIndexRouteImport } from './routes/polysubstitution/railfence/index'
+import { Route as PolysubstitutionTrifidIndexRouteImport } from './routes/polysubstitution/trifid/index'
 
 const IndexRoute = IndexRouteImport.update({
   id: '/',
   path: '/',
   getParentRoute: () => rootRouteImport,
 } as any)
-const TutorialIndexRoute = TutorialIndexRouteImport.update({
-  id: '/tutorial/',
-  path: '/tutorial/',
-  getParentRoute: () => rootRouteImport,
-} as any)
-const PolysubstitutionIndexRoute = PolysubstitutionIndexRouteImport.update({
-  id: '/polysubstitution/',
-  path: '/polysubstitution/',
-  getParentRoute: () => rootRouteImport,
-} as any)
-const MonosubstitutionIndexRoute = MonosubstitutionIndexRouteImport.update({
-  id: '/monosubstitution/',
-  path: '/monosubstitution/',
-  getParentRoute: () => rootRouteImport,
-} as any)
 const CombinationIndexRoute = CombinationIndexRouteImport.update({
   id: '/combination/',
   path: '/combination/',
   getParentRoute: () => rootRouteImport,
 } as any)
-const PolysubstitutionTrifidIndexRoute =
-  PolysubstitutionTrifidIndexRouteImport.update({
-    id: '/polysubstitution/trifid/',
-    path: '/polysubstitution/trifid/',
+const MonosubstitutionIndexRoute = MonosubstitutionIndexRouteImport.update({
+  id: '/monosubstitution/',
+  path: '/monosubstitution/',
   getParentRoute: () => rootRouteImport,
 } as any)
-const PolysubstitutionRailfenceIndexRoute =
-  PolysubstitutionRailfenceIndexRouteImport.update({
-    id: '/polysubstitution/railfence/',
-    path: '/polysubstitution/railfence/',
+const PolysubstitutionIndexRoute = PolysubstitutionIndexRouteImport.update({
+  id: '/polysubstitution/',
+  path: '/polysubstitution/',
   getParentRoute: () => rootRouteImport,
 } as any)
-const PolysubstitutionPolybiusIndexRoute =
-  PolysubstitutionPolybiusIndexRouteImport.update({
-    id: '/polysubstitution/polybius/',
-    path: '/polysubstitution/polybius/',
+const TutorialIndexRoute = TutorialIndexRouteImport.update({
+  id: '/tutorial/',
+  path: '/tutorial/',
   getParentRoute: () => rootRouteImport,
 } as any)
-const PolysubstitutionPlayfairIndexRoute =
-  PolysubstitutionPlayfairIndexRouteImport.update({
-    id: '/polysubstitution/playfair/',
-    path: '/polysubstitution/playfair/',
+const CombinationAdfgvxIndexRoute = CombinationAdfgvxIndexRouteImport.update({
+  id: '/combination/adfgvx/',
+  path: '/combination/adfgvx/',
   getParentRoute: () => rootRouteImport,
 } as any)
-const PolysubstitutionMorseIndexRoute =
-  PolysubstitutionMorseIndexRouteImport.update({
-    id: '/polysubstitution/morse/',
-    path: '/polysubstitution/morse/',
-    getParentRoute: () => rootRouteImport,
-  } as any)
-const PolysubstitutionHillIndexRoute =
-  PolysubstitutionHillIndexRouteImport.update({
-    id: '/polysubstitution/hill/',
-    path: '/polysubstitution/hill/',
-    getParentRoute: () => rootRouteImport,
-  } as any)
-const PolysubstitutionColumnarIndexRoute =
-  PolysubstitutionColumnarIndexRouteImport.update({
-    id: '/polysubstitution/columnar/',
-    path: '/polysubstitution/columnar/',
-    getParentRoute: () => rootRouteImport,
-  } as any)
-const PolysubstitutionBifidIndexRoute =
-  PolysubstitutionBifidIndexRouteImport.update({
-    id: '/polysubstitution/bifid/',
-    path: '/polysubstitution/bifid/',
-    getParentRoute: () => rootRouteImport,
-  } as any)
-const MonosubstitutionVigenereIndexRoute =
-  MonosubstitutionVigenereIndexRouteImport.update({
-    id: '/monosubstitution/vigenere/',
-    path: '/monosubstitution/vigenere/',
-    getParentRoute: () => rootRouteImport,
-  } as any)
-const MonosubstitutionSubstitutionIndexRoute =
-  MonosubstitutionSubstitutionIndexRouteImport.update({
-    id: '/monosubstitution/substitution/',
-    path: '/monosubstitution/substitution/',
-    getParentRoute: () => rootRouteImport,
-  } as any)
-const MonosubstitutionPortaIndexRoute =
-  MonosubstitutionPortaIndexRouteImport.update({
-    id: '/monosubstitution/porta/',
-    path: '/monosubstitution/porta/',
-    getParentRoute: () => rootRouteImport,
-  } as any)
-const MonosubstitutionOnetimepadIndexRoute =
-  MonosubstitutionOnetimepadIndexRouteImport.update({
-    id: '/monosubstitution/onetimepad/',
-    path: '/monosubstitution/onetimepad/',
-    getParentRoute: () => rootRouteImport,
-  } as any)
-const MonosubstitutionCaesarIndexRoute =
-  MonosubstitutionCaesarIndexRouteImport.update({
-    id: '/monosubstitution/caesar/',
-    path: '/monosubstitution/caesar/',
-    getParentRoute: () => rootRouteImport,
-  } as any)
-const MonosubstitutionBeaufortIndexRoute =
-  MonosubstitutionBeaufortIndexRouteImport.update({
-    id: '/monosubstitution/beaufort/',
-    path: '/monosubstitution/beaufort/',
-    getParentRoute: () => rootRouteImport,
-  } as any)
-const MonosubstitutionBasexIndexRoute =
-  MonosubstitutionBasexIndexRouteImport.update({
-    id: '/monosubstitution/basex/',
-    path: '/monosubstitution/basex/',
-    getParentRoute: () => rootRouteImport,
-  } as any)
-const MonosubstitutionBaconianIndexRoute =
-  MonosubstitutionBaconianIndexRouteImport.update({
-    id: '/monosubstitution/baconian/',
-    path: '/monosubstitution/baconian/',
-    getParentRoute: () => rootRouteImport,
-  } as any)
-const MonosubstitutionAutokeyIndexRoute =
-  MonosubstitutionAutokeyIndexRouteImport.update({
-    id: '/monosubstitution/autokey/',
-    path: '/monosubstitution/autokey/',
-    getParentRoute: () => rootRouteImport,
-  } as any)
-const MonosubstitutionAtbashIndexRoute =
-  MonosubstitutionAtbashIndexRouteImport.update({
-    id: '/monosubstitution/atbash/',
-    path: '/monosubstitution/atbash/',
+const CombinationAdfgxIndexRoute = CombinationAdfgxIndexRouteImport.update({
+  id: '/combination/adfgx/',
+  path: '/combination/adfgx/',
   getParentRoute: () => rootRouteImport,
 } as any)
 const MonosubstitutionAffineIndexRoute =
@@ -175,44 +77,142 @@ const MonosubstitutionAffineIndexRoute =
     path: '/monosubstitution/affine/',
     getParentRoute: () => rootRouteImport,
   } as any)
-const CombinationAdfgxIndexRoute = CombinationAdfgxIndexRouteImport.update({
-  id: '/combination/adfgx/',
-  path: '/combination/adfgx/',
+const MonosubstitutionAtbashIndexRoute =
+  MonosubstitutionAtbashIndexRouteImport.update({
+    id: '/monosubstitution/atbash/',
+    path: '/monosubstitution/atbash/',
     getParentRoute: () => rootRouteImport,
   } as any)
-const CombinationAdfgvxIndexRoute = CombinationAdfgvxIndexRouteImport.update({
-  id: '/combination/adfgvx/',
-  path: '/combination/adfgvx/',
+const MonosubstitutionAutokeyIndexRoute =
+  MonosubstitutionAutokeyIndexRouteImport.update({
+    id: '/monosubstitution/autokey/',
+    path: '/monosubstitution/autokey/',
+    getParentRoute: () => rootRouteImport,
+  } as any)
+const MonosubstitutionBaconianIndexRoute =
+  MonosubstitutionBaconianIndexRouteImport.update({
+    id: '/monosubstitution/baconian/',
+    path: '/monosubstitution/baconian/',
+    getParentRoute: () => rootRouteImport,
+  } as any)
+const MonosubstitutionBasexIndexRoute =
+  MonosubstitutionBasexIndexRouteImport.update({
+    id: '/monosubstitution/basex/',
+    path: '/monosubstitution/basex/',
+    getParentRoute: () => rootRouteImport,
+  } as any)
+const MonosubstitutionBeaufortIndexRoute =
+  MonosubstitutionBeaufortIndexRouteImport.update({
+    id: '/monosubstitution/beaufort/',
+    path: '/monosubstitution/beaufort/',
+    getParentRoute: () => rootRouteImport,
+  } as any)
+const MonosubstitutionCaesarIndexRoute =
+  MonosubstitutionCaesarIndexRouteImport.update({
+    id: '/monosubstitution/caesar/',
+    path: '/monosubstitution/caesar/',
+    getParentRoute: () => rootRouteImport,
+  } as any)
+const MonosubstitutionOnetimepadIndexRoute =
+  MonosubstitutionOnetimepadIndexRouteImport.update({
+    id: '/monosubstitution/onetimepad/',
+    path: '/monosubstitution/onetimepad/',
+    getParentRoute: () => rootRouteImport,
+  } as any)
+const MonosubstitutionPortaIndexRoute =
+  MonosubstitutionPortaIndexRouteImport.update({
+    id: '/monosubstitution/porta/',
+    path: '/monosubstitution/porta/',
+    getParentRoute: () => rootRouteImport,
+  } as any)
+const MonosubstitutionSubstitutionIndexRoute =
+  MonosubstitutionSubstitutionIndexRouteImport.update({
+    id: '/monosubstitution/substitution/',
+    path: '/monosubstitution/substitution/',
+    getParentRoute: () => rootRouteImport,
+  } as any)
+const MonosubstitutionVigenereIndexRoute =
+  MonosubstitutionVigenereIndexRouteImport.update({
+    id: '/monosubstitution/vigenere/',
+    path: '/monosubstitution/vigenere/',
+    getParentRoute: () => rootRouteImport,
+  } as any)
+const PolysubstitutionBifidIndexRoute =
+  PolysubstitutionBifidIndexRouteImport.update({
+    id: '/polysubstitution/bifid/',
+    path: '/polysubstitution/bifid/',
+    getParentRoute: () => rootRouteImport,
+  } as any)
+const PolysubstitutionColumnarIndexRoute =
+  PolysubstitutionColumnarIndexRouteImport.update({
+    id: '/polysubstitution/columnar/',
+    path: '/polysubstitution/columnar/',
+    getParentRoute: () => rootRouteImport,
+  } as any)
+const PolysubstitutionHillIndexRoute =
+  PolysubstitutionHillIndexRouteImport.update({
+    id: '/polysubstitution/hill/',
+    path: '/polysubstitution/hill/',
+    getParentRoute: () => rootRouteImport,
+  } as any)
+const PolysubstitutionMorseIndexRoute =
+  PolysubstitutionMorseIndexRouteImport.update({
+    id: '/polysubstitution/morse/',
+    path: '/polysubstitution/morse/',
+    getParentRoute: () => rootRouteImport,
+  } as any)
+const PolysubstitutionPlayfairIndexRoute =
+  PolysubstitutionPlayfairIndexRouteImport.update({
+    id: '/polysubstitution/playfair/',
+    path: '/polysubstitution/playfair/',
+    getParentRoute: () => rootRouteImport,
+  } as any)
+const PolysubstitutionPolybiusIndexRoute =
+  PolysubstitutionPolybiusIndexRouteImport.update({
+    id: '/polysubstitution/polybius/',
+    path: '/polysubstitution/polybius/',
+    getParentRoute: () => rootRouteImport,
+  } as any)
+const PolysubstitutionRailfenceIndexRoute =
+  PolysubstitutionRailfenceIndexRouteImport.update({
+    id: '/polysubstitution/railfence/',
+    path: '/polysubstitution/railfence/',
+    getParentRoute: () => rootRouteImport,
+  } as any)
+const PolysubstitutionTrifidIndexRoute =
+  PolysubstitutionTrifidIndexRouteImport.update({
+    id: '/polysubstitution/trifid/',
+    path: '/polysubstitution/trifid/',
     getParentRoute: () => rootRouteImport,
   } as any)
 
 export interface FileRoutesByFullPath {
   '/': typeof IndexRoute
-  '/combination': typeof CombinationIndexRoute
-  '/monosubstitution': typeof MonosubstitutionIndexRoute
-  '/polysubstitution': typeof PolysubstitutionIndexRoute
-  '/tutorial': typeof TutorialIndexRoute
-  '/combination/adfgvx': typeof CombinationAdfgvxIndexRoute
-  '/combination/adfgx': typeof CombinationAdfgxIndexRoute
-  '/monosubstitution/affine': typeof MonosubstitutionAffineIndexRoute
-  '/monosubstitution/atbash': typeof MonosubstitutionAtbashIndexRoute
-  '/monosubstitution/autokey': typeof MonosubstitutionAutokeyIndexRoute
-  '/monosubstitution/baconian': typeof MonosubstitutionBaconianIndexRoute
-  '/monosubstitution/basex': typeof MonosubstitutionBasexIndexRoute
-  '/monosubstitution/beaufort': typeof MonosubstitutionBeaufortIndexRoute
-  '/monosubstitution/caesar': typeof MonosubstitutionCaesarIndexRoute
-  '/monosubstitution/onetimepad': typeof MonosubstitutionOnetimepadIndexRoute
-  '/monosubstitution/porta': typeof MonosubstitutionPortaIndexRoute
-  '/monosubstitution/substitution': typeof MonosubstitutionSubstitutionIndexRoute
-  '/monosubstitution/vigenere': typeof MonosubstitutionVigenereIndexRoute
-  '/polysubstitution/bifid': typeof PolysubstitutionBifidIndexRoute
-  '/polysubstitution/columnar': typeof PolysubstitutionColumnarIndexRoute
-  '/polysubstitution/hill': typeof PolysubstitutionHillIndexRoute
-  '/polysubstitution/morse': typeof PolysubstitutionMorseIndexRoute
-  '/polysubstitution/playfair': typeof PolysubstitutionPlayfairIndexRoute
-  '/polysubstitution/polybius': typeof PolysubstitutionPolybiusIndexRoute
-  '/polysubstitution/railfence': typeof PolysubstitutionRailfenceIndexRoute
-  '/polysubstitution/trifid': typeof PolysubstitutionTrifidIndexRoute
+  '/combination/': typeof CombinationIndexRoute
+  '/monosubstitution/': typeof MonosubstitutionIndexRoute
+  '/polysubstitution/': typeof PolysubstitutionIndexRoute
+  '/tutorial/': typeof TutorialIndexRoute
+  '/combination/adfgvx/': typeof CombinationAdfgvxIndexRoute
+  '/combination/adfgx/': typeof CombinationAdfgxIndexRoute
+  '/monosubstitution/affine/': typeof MonosubstitutionAffineIndexRoute
+  '/monosubstitution/atbash/': typeof MonosubstitutionAtbashIndexRoute
+  '/monosubstitution/autokey/': typeof MonosubstitutionAutokeyIndexRoute
+  '/monosubstitution/baconian/': typeof MonosubstitutionBaconianIndexRoute
+  '/monosubstitution/basex/': typeof MonosubstitutionBasexIndexRoute
+  '/monosubstitution/beaufort/': typeof MonosubstitutionBeaufortIndexRoute
+  '/monosubstitution/caesar/': typeof MonosubstitutionCaesarIndexRoute
+  '/monosubstitution/onetimepad/': typeof MonosubstitutionOnetimepadIndexRoute
+  '/monosubstitution/porta/': typeof MonosubstitutionPortaIndexRoute
+  '/monosubstitution/substitution/': typeof MonosubstitutionSubstitutionIndexRoute
+  '/monosubstitution/vigenere/': typeof MonosubstitutionVigenereIndexRoute
+  '/polysubstitution/bifid/': typeof PolysubstitutionBifidIndexRoute
+  '/polysubstitution/columnar/': typeof PolysubstitutionColumnarIndexRoute
+  '/polysubstitution/hill/': typeof PolysubstitutionHillIndexRoute
+  '/polysubstitution/morse/': typeof PolysubstitutionMorseIndexRoute
+  '/polysubstitution/playfair/': typeof PolysubstitutionPlayfairIndexRoute
+  '/polysubstitution/polybius/': typeof PolysubstitutionPolybiusIndexRoute
+  '/polysubstitution/railfence/': typeof PolysubstitutionRailfenceIndexRoute
+  '/polysubstitution/trifid/': typeof PolysubstitutionTrifidIndexRoute
 }
 export interface FileRoutesByTo {
   '/': typeof IndexRoute
@@ -275,31 +275,31 @@ export interface FileRouteTypes {
   fileRoutesByFullPath: FileRoutesByFullPath
   fullPaths:
     | '/'
-    | '/combination'
-    | '/monosubstitution'
-    | '/polysubstitution'
-    | '/tutorial'
-    | '/combination/adfgvx'
-    | '/combination/adfgx'
-    | '/monosubstitution/affine'
-    | '/monosubstitution/atbash'
-    | '/monosubstitution/autokey'
-    | '/monosubstitution/baconian'
-    | '/monosubstitution/basex'
-    | '/monosubstitution/beaufort'
-    | '/monosubstitution/caesar'
-    | '/monosubstitution/onetimepad'
-    | '/monosubstitution/porta'
-    | '/monosubstitution/substitution'
-    | '/monosubstitution/vigenere'
-    | '/polysubstitution/bifid'
-    | '/polysubstitution/columnar'
-    | '/polysubstitution/hill'
-    | '/polysubstitution/morse'
-    | '/polysubstitution/playfair'
-    | '/polysubstitution/polybius'
-    | '/polysubstitution/railfence'
-    | '/polysubstitution/trifid'
+    | '/combination/'
+    | '/monosubstitution/'
+    | '/polysubstitution/'
+    | '/tutorial/'
+    | '/combination/adfgvx/'
+    | '/combination/adfgx/'
+    | '/monosubstitution/affine/'
+    | '/monosubstitution/atbash/'
+    | '/monosubstitution/autokey/'
+    | '/monosubstitution/baconian/'
+    | '/monosubstitution/basex/'
+    | '/monosubstitution/beaufort/'
+    | '/monosubstitution/caesar/'
+    | '/monosubstitution/onetimepad/'
+    | '/monosubstitution/porta/'
+    | '/monosubstitution/substitution/'
+    | '/monosubstitution/vigenere/'
+    | '/polysubstitution/bifid/'
+    | '/polysubstitution/columnar/'
+    | '/polysubstitution/hill/'
+    | '/polysubstitution/morse/'
+    | '/polysubstitution/playfair/'
+    | '/polysubstitution/polybius/'
+    | '/polysubstitution/railfence/'
+    | '/polysubstitution/trifid/'
   fileRoutesByTo: FileRoutesByTo
   to:
     | '/'
@@ -396,181 +396,181 @@ declare module '@tanstack/react-router' {
       preLoaderRoute: typeof IndexRouteImport
       parentRoute: typeof rootRouteImport
     }
-    '/tutorial/': {
-      id: '/tutorial/'
-      path: '/tutorial'
-      fullPath: '/tutorial'
-      preLoaderRoute: typeof TutorialIndexRouteImport
-      parentRoute: typeof rootRouteImport
-    }
-    '/polysubstitution/': {
-      id: '/polysubstitution/'
-      path: '/polysubstitution'
-      fullPath: '/polysubstitution'
-      preLoaderRoute: typeof PolysubstitutionIndexRouteImport
+    '/combination/': {
+      id: '/combination/'
+      path: '/combination'
+      fullPath: '/combination/'
+      preLoaderRoute: typeof CombinationIndexRouteImport
       parentRoute: typeof rootRouteImport
     }
     '/monosubstitution/': {
       id: '/monosubstitution/'
       path: '/monosubstitution'
-      fullPath: '/monosubstitution'
+      fullPath: '/monosubstitution/'
       preLoaderRoute: typeof MonosubstitutionIndexRouteImport
       parentRoute: typeof rootRouteImport
     }
-    '/combination/': {
-      id: '/combination/'
-      path: '/combination'
-      fullPath: '/combination'
-      preLoaderRoute: typeof CombinationIndexRouteImport
+    '/polysubstitution/': {
+      id: '/polysubstitution/'
+      path: '/polysubstitution'
+      fullPath: '/polysubstitution/'
+      preLoaderRoute: typeof PolysubstitutionIndexRouteImport
       parentRoute: typeof rootRouteImport
     }
-    '/polysubstitution/trifid/': {
-      id: '/polysubstitution/trifid/'
-      path: '/polysubstitution/trifid'
-      fullPath: '/polysubstitution/trifid'
-      preLoaderRoute: typeof PolysubstitutionTrifidIndexRouteImport
-      parentRoute: typeof rootRouteImport
-    }
-    '/polysubstitution/railfence/': {
-      id: '/polysubstitution/railfence/'
-      path: '/polysubstitution/railfence'
-      fullPath: '/polysubstitution/railfence'
-      preLoaderRoute: typeof PolysubstitutionRailfenceIndexRouteImport
-      parentRoute: typeof rootRouteImport
-    }
-    '/polysubstitution/polybius/': {
-      id: '/polysubstitution/polybius/'
-      path: '/polysubstitution/polybius'
-      fullPath: '/polysubstitution/polybius'
-      preLoaderRoute: typeof PolysubstitutionPolybiusIndexRouteImport
-      parentRoute: typeof rootRouteImport
-    }
-    '/polysubstitution/playfair/': {
-      id: '/polysubstitution/playfair/'
-      path: '/polysubstitution/playfair'
-      fullPath: '/polysubstitution/playfair'
-      preLoaderRoute: typeof PolysubstitutionPlayfairIndexRouteImport
-      parentRoute: typeof rootRouteImport
-    }
-    '/polysubstitution/morse/': {
-      id: '/polysubstitution/morse/'
-      path: '/polysubstitution/morse'
-      fullPath: '/polysubstitution/morse'
-      preLoaderRoute: typeof PolysubstitutionMorseIndexRouteImport
-      parentRoute: typeof rootRouteImport
-    }
-    '/polysubstitution/hill/': {
-      id: '/polysubstitution/hill/'
-      path: '/polysubstitution/hill'
-      fullPath: '/polysubstitution/hill'
-      preLoaderRoute: typeof PolysubstitutionHillIndexRouteImport
-      parentRoute: typeof rootRouteImport
-    }
-    '/polysubstitution/columnar/': {
-      id: '/polysubstitution/columnar/'
-      path: '/polysubstitution/columnar'
-      fullPath: '/polysubstitution/columnar'
-      preLoaderRoute: typeof PolysubstitutionColumnarIndexRouteImport
-      parentRoute: typeof rootRouteImport
-    }
-    '/polysubstitution/bifid/': {
-      id: '/polysubstitution/bifid/'
-      path: '/polysubstitution/bifid'
-      fullPath: '/polysubstitution/bifid'
-      preLoaderRoute: typeof PolysubstitutionBifidIndexRouteImport
-      parentRoute: typeof rootRouteImport
-    }
-    '/monosubstitution/vigenere/': {
-      id: '/monosubstitution/vigenere/'
-      path: '/monosubstitution/vigenere'
-      fullPath: '/monosubstitution/vigenere'
-      preLoaderRoute: typeof MonosubstitutionVigenereIndexRouteImport
-      parentRoute: typeof rootRouteImport
-    }
-    '/monosubstitution/substitution/': {
-      id: '/monosubstitution/substitution/'
-      path: '/monosubstitution/substitution'
-      fullPath: '/monosubstitution/substitution'
-      preLoaderRoute: typeof MonosubstitutionSubstitutionIndexRouteImport
-      parentRoute: typeof rootRouteImport
-    }
-    '/monosubstitution/porta/': {
-      id: '/monosubstitution/porta/'
-      path: '/monosubstitution/porta'
-      fullPath: '/monosubstitution/porta'
-      preLoaderRoute: typeof MonosubstitutionPortaIndexRouteImport
-      parentRoute: typeof rootRouteImport
-    }
-    '/monosubstitution/onetimepad/': {
-      id: '/monosubstitution/onetimepad/'
-      path: '/monosubstitution/onetimepad'
-      fullPath: '/monosubstitution/onetimepad'
-      preLoaderRoute: typeof MonosubstitutionOnetimepadIndexRouteImport
-      parentRoute: typeof rootRouteImport
-    }
-    '/monosubstitution/caesar/': {
-      id: '/monosubstitution/caesar/'
-      path: '/monosubstitution/caesar'
-      fullPath: '/monosubstitution/caesar'
-      preLoaderRoute: typeof MonosubstitutionCaesarIndexRouteImport
-      parentRoute: typeof rootRouteImport
-    }
-    '/monosubstitution/beaufort/': {
-      id: '/monosubstitution/beaufort/'
-      path: '/monosubstitution/beaufort'
-      fullPath: '/monosubstitution/beaufort'
-      preLoaderRoute: typeof MonosubstitutionBeaufortIndexRouteImport
-      parentRoute: typeof rootRouteImport
-    }
-    '/monosubstitution/basex/': {
-      id: '/monosubstitution/basex/'
-      path: '/monosubstitution/basex'
-      fullPath: '/monosubstitution/basex'
-      preLoaderRoute: typeof MonosubstitutionBasexIndexRouteImport
-      parentRoute: typeof rootRouteImport
-    }
-    '/monosubstitution/baconian/': {
-      id: '/monosubstitution/baconian/'
-      path: '/monosubstitution/baconian'
-      fullPath: '/monosubstitution/baconian'
-      preLoaderRoute: typeof MonosubstitutionBaconianIndexRouteImport
-      parentRoute: typeof rootRouteImport
-    }
-    '/monosubstitution/autokey/': {
-      id: '/monosubstitution/autokey/'
-      path: '/monosubstitution/autokey'
-      fullPath: '/monosubstitution/autokey'
-      preLoaderRoute: typeof MonosubstitutionAutokeyIndexRouteImport
-      parentRoute: typeof rootRouteImport
-    }
-    '/monosubstitution/atbash/': {
-      id: '/monosubstitution/atbash/'
-      path: '/monosubstitution/atbash'
-      fullPath: '/monosubstitution/atbash'
-      preLoaderRoute: typeof MonosubstitutionAtbashIndexRouteImport
-      parentRoute: typeof rootRouteImport
-    }
-    '/monosubstitution/affine/': {
-      id: '/monosubstitution/affine/'
-      path: '/monosubstitution/affine'
-      fullPath: '/monosubstitution/affine'
-      preLoaderRoute: typeof MonosubstitutionAffineIndexRouteImport
-      parentRoute: typeof rootRouteImport
-    }
-    '/combination/adfgx/': {
-      id: '/combination/adfgx/'
-      path: '/combination/adfgx'
-      fullPath: '/combination/adfgx'
-      preLoaderRoute: typeof CombinationAdfgxIndexRouteImport
+    '/tutorial/': {
+      id: '/tutorial/'
+      path: '/tutorial'
+      fullPath: '/tutorial/'
+      preLoaderRoute: typeof TutorialIndexRouteImport
       parentRoute: typeof rootRouteImport
     }
     '/combination/adfgvx/': {
       id: '/combination/adfgvx/'
       path: '/combination/adfgvx'
-      fullPath: '/combination/adfgvx'
+      fullPath: '/combination/adfgvx/'
       preLoaderRoute: typeof CombinationAdfgvxIndexRouteImport
       parentRoute: typeof rootRouteImport
     }
+    '/combination/adfgx/': {
+      id: '/combination/adfgx/'
+      path: '/combination/adfgx'
+      fullPath: '/combination/adfgx/'
+      preLoaderRoute: typeof CombinationAdfgxIndexRouteImport
+      parentRoute: typeof rootRouteImport
+    }
+    '/monosubstitution/affine/': {
+      id: '/monosubstitution/affine/'
+      path: '/monosubstitution/affine'
+      fullPath: '/monosubstitution/affine/'
+      preLoaderRoute: typeof MonosubstitutionAffineIndexRouteImport
+      parentRoute: typeof rootRouteImport
+    }
+    '/monosubstitution/atbash/': {
+      id: '/monosubstitution/atbash/'
+      path: '/monosubstitution/atbash'
+      fullPath: '/monosubstitution/atbash/'
+      preLoaderRoute: typeof MonosubstitutionAtbashIndexRouteImport
+      parentRoute: typeof rootRouteImport
+    }
+    '/monosubstitution/autokey/': {
+      id: '/monosubstitution/autokey/'
+      path: '/monosubstitution/autokey'
+      fullPath: '/monosubstitution/autokey/'
+      preLoaderRoute: typeof MonosubstitutionAutokeyIndexRouteImport
+      parentRoute: typeof rootRouteImport
+    }
+    '/monosubstitution/baconian/': {
+      id: '/monosubstitution/baconian/'
+      path: '/monosubstitution/baconian'
+      fullPath: '/monosubstitution/baconian/'
+      preLoaderRoute: typeof MonosubstitutionBaconianIndexRouteImport
+      parentRoute: typeof rootRouteImport
+    }
+    '/monosubstitution/basex/': {
+      id: '/monosubstitution/basex/'
+      path: '/monosubstitution/basex'
+      fullPath: '/monosubstitution/basex/'
+      preLoaderRoute: typeof MonosubstitutionBasexIndexRouteImport
+      parentRoute: typeof rootRouteImport
+    }
+    '/monosubstitution/beaufort/': {
+      id: '/monosubstitution/beaufort/'
+      path: '/monosubstitution/beaufort'
+      fullPath: '/monosubstitution/beaufort/'
+      preLoaderRoute: typeof MonosubstitutionBeaufortIndexRouteImport
+      parentRoute: typeof rootRouteImport
+    }
+    '/monosubstitution/caesar/': {
+      id: '/monosubstitution/caesar/'
+      path: '/monosubstitution/caesar'
+      fullPath: '/monosubstitution/caesar/'
+      preLoaderRoute: typeof MonosubstitutionCaesarIndexRouteImport
+      parentRoute: typeof rootRouteImport
+    }
+    '/monosubstitution/onetimepad/': {
+      id: '/monosubstitution/onetimepad/'
+      path: '/monosubstitution/onetimepad'
+      fullPath: '/monosubstitution/onetimepad/'
+      preLoaderRoute: typeof MonosubstitutionOnetimepadIndexRouteImport
+      parentRoute: typeof rootRouteImport
+    }
+    '/monosubstitution/porta/': {
+      id: '/monosubstitution/porta/'
+      path: '/monosubstitution/porta'
+      fullPath: '/monosubstitution/porta/'
+      preLoaderRoute: typeof MonosubstitutionPortaIndexRouteImport
+      parentRoute: typeof rootRouteImport
+    }
+    '/monosubstitution/substitution/': {
+      id: '/monosubstitution/substitution/'
+      path: '/monosubstitution/substitution'
+      fullPath: '/monosubstitution/substitution/'
+      preLoaderRoute: typeof MonosubstitutionSubstitutionIndexRouteImport
+      parentRoute: typeof rootRouteImport
+    }
+    '/monosubstitution/vigenere/': {
+      id: '/monosubstitution/vigenere/'
+      path: '/monosubstitution/vigenere'
+      fullPath: '/monosubstitution/vigenere/'
+      preLoaderRoute: typeof MonosubstitutionVigenereIndexRouteImport
+      parentRoute: typeof rootRouteImport
+    }
+    '/polysubstitution/bifid/': {
+      id: '/polysubstitution/bifid/'
+      path: '/polysubstitution/bifid'
+      fullPath: '/polysubstitution/bifid/'
+      preLoaderRoute: typeof PolysubstitutionBifidIndexRouteImport
+      parentRoute: typeof rootRouteImport
+    }
+    '/polysubstitution/columnar/': {
+      id: '/polysubstitution/columnar/'
+      path: '/polysubstitution/columnar'
+      fullPath: '/polysubstitution/columnar/'
+      preLoaderRoute: typeof PolysubstitutionColumnarIndexRouteImport
+      parentRoute: typeof rootRouteImport
+    }
+    '/polysubstitution/hill/': {
+      id: '/polysubstitution/hill/'
+      path: '/polysubstitution/hill'
+      fullPath: '/polysubstitution/hill/'
+      preLoaderRoute: typeof PolysubstitutionHillIndexRouteImport
+      parentRoute: typeof rootRouteImport
+    }
+    '/polysubstitution/morse/': {
+      id: '/polysubstitution/morse/'
+      path: '/polysubstitution/morse'
+      fullPath: '/polysubstitution/morse/'
+      preLoaderRoute: typeof PolysubstitutionMorseIndexRouteImport
+      parentRoute: typeof rootRouteImport
+    }
+    '/polysubstitution/playfair/': {
+      id: '/polysubstitution/playfair/'
+      path: '/polysubstitution/playfair'
+      fullPath: '/polysubstitution/playfair/'
+      preLoaderRoute: typeof PolysubstitutionPlayfairIndexRouteImport
+      parentRoute: typeof rootRouteImport
+    }
+    '/polysubstitution/polybius/': {
+      id: '/polysubstitution/polybius/'
+      path: '/polysubstitution/polybius'
+      fullPath: '/polysubstitution/polybius/'
+      preLoaderRoute: typeof PolysubstitutionPolybiusIndexRouteImport
+      parentRoute: typeof rootRouteImport
+    }
+    '/polysubstitution/railfence/': {
+      id: '/polysubstitution/railfence/'
+      path: '/polysubstitution/railfence'
+      fullPath: '/polysubstitution/railfence/'
+      preLoaderRoute: typeof PolysubstitutionRailfenceIndexRouteImport
+      parentRoute: typeof rootRouteImport
+    }
+    '/polysubstitution/trifid/': {
+      id: '/polysubstitution/trifid/'
+      path: '/polysubstitution/trifid'
+      fullPath: '/polysubstitution/trifid/'
+      preLoaderRoute: typeof PolysubstitutionTrifidIndexRouteImport
+      parentRoute: typeof rootRouteImport
+    }
   }
 }
 

src/routes/combination/adfgvx/index.tsx

@@ -1,14 +1,15 @@
-import CipherLoader from '@/components/ciphers/CipherLoader';
-import ADFGVXInputs from '@/components/ciphers/combination/adfgvx/ADFGVXInputs';
-import { useGetADFGVXInfo } from '@/hooks/combination/ADFGVXHooks';
-import { createFileRoute } from '@tanstack/react-router';
+import CipherLoader from "@/components/ciphers/CipherLoader";
+import ADFGVXInputs from "@/components/ciphers/combination/adfgvx/ADFGVXInputs";
+import { useGetADFGVXInfo } from "@/hooks/combination/ADFGVXHooks";
+import { createFileRoute } from "@tanstack/react-router";
 
 
-export const Route = createFileRoute('/combination/adfgvx/')({
+export const Route = createFileRoute("/combination/adfgvx/")({
 	component: ADFGVXPage
 });
 
 
+// eslint-disable-next-line react-refresh/only-export-components
 function ADFGVXPage(){
 	const adfgvxInfoQuery = useGetADFGVXInfo();
 

src/routes/combination/adfgx/index.tsx

@@ -1,14 +1,15 @@
-import CipherLoader from '@/components/ciphers/CipherLoader';
-import ADFGXInputs from '@/components/ciphers/combination/adfgx/ADFGXInputs';
-import { useGetADFGXInfo } from '@/hooks/combination/ADFGXHooks';
-import { createFileRoute } from '@tanstack/react-router';
+import CipherLoader from "@/components/ciphers/CipherLoader";
+import ADFGXInputs from "@/components/ciphers/combination/adfgx/ADFGXInputs";
+import { useGetADFGXInfo } from "@/hooks/combination/ADFGXHooks";
+import { createFileRoute } from "@tanstack/react-router";
 
 
-export const Route = createFileRoute('/combination/adfgx/')({
+export const Route = createFileRoute("/combination/adfgx/")({
 	component: ADFGXPage
 });
 
 
+// eslint-disable-next-line react-refresh/only-export-components
 function ADFGXPage(){
 	const adfgxInfoQuery = useGetADFGXInfo();
 

src/routes/combination/index.tsx

@@ -1,12 +1,13 @@
-import { combinationLinks } from '@/util/LinksUtil';
-import { createFileRoute, Link } from '@tanstack/react-router';
+import { combinationLinks } from "@/util/LinksUtil";
+import { createFileRoute, Link } from "@tanstack/react-router";
 
 
-export const Route = createFileRoute('/combination/')({
+export const Route = createFileRoute("/combination/")({
 	component: CombinationPage
 });
 
 
+// eslint-disable-next-line react-refresh/only-export-components
 function CombinationPage(){
 	return (
 		<main

src/routes/index.tsx

@@ -30,6 +30,7 @@ export const Route = createFileRoute("/")({
 });
 
 
+// eslint-disable-next-line react-refresh/only-export-components
 function HomePage(){
 	return (
 		<main>

src/routes/monosubstitution/affine/index.tsx

@@ -1,7 +1,7 @@
-import CipherLoader from '@/components/ciphers/CipherLoader';
-import AffineInputs from '@/components/ciphers/monosubstitution/affine/AffineInputs';
-import { useGetAffineInfo } from '@/hooks/monosubstitution/AffineHooks';
-import { createFileRoute } from '@tanstack/react-router';
+import CipherLoader from "@/components/ciphers/CipherLoader";
+import AffineInputs from "@/components/ciphers/monosubstitution/affine/AffineInputs";
+import { useGetAffineInfo } from "@/hooks/monosubstitution/AffineHooks";
+import { createFileRoute } from "@tanstack/react-router";
 
 
 /*
@@ -12,11 +12,12 @@ keywords: [
 ]
 */
 
-export const Route = createFileRoute('/monosubstitution/affine/')({
+export const Route = createFileRoute("/monosubstitution/affine/")({
 	component: AffinePage
 });
 
 
+// eslint-disable-next-line react-refresh/only-export-components
 function AffinePage(){
 	const affineInfoQuery = useGetAffineInfo();
 

src/routes/monosubstitution/atbash/index.tsx

@@ -1,7 +1,7 @@
-import CipherLoader from '@/components/ciphers/CipherLoader';
-import AtbashInputs from '@/components/ciphers/monosubstitution/atbash/AtbashInputs';
-import { useGetAtbashInfo } from '@/hooks/monosubstitution/AtbashHooks';
-import { createFileRoute } from '@tanstack/react-router';
+import CipherLoader from "@/components/ciphers/CipherLoader";
+import AtbashInputs from "@/components/ciphers/monosubstitution/atbash/AtbashInputs";
+import { useGetAtbashInfo } from "@/hooks/monosubstitution/AtbashHooks";
+import { createFileRoute } from "@tanstack/react-router";
 
 
 /*
@@ -12,11 +12,12 @@ keywords: [
 ]
 */
 
-export const Route = createFileRoute('/monosubstitution/atbash/')({
+export const Route = createFileRoute("/monosubstitution/atbash/")({
 	component: AtbashPage
 });
 
 
+// eslint-disable-next-line react-refresh/only-export-components
 function AtbashPage(){
 	const atbashInfoQuery = useGetAtbashInfo();
 

src/routes/monosubstitution/autokey/index.tsx

@@ -1,7 +1,7 @@
-import CipherLoader from '@/components/ciphers/CipherLoader';
-import AutokeyInputs from '@/components/ciphers/monosubstitution/autokey/AutokeyInputs';
-import { useGetAutokeyInfo } from '@/hooks/monosubstitution/AutokeyHooks';
-import { createFileRoute } from '@tanstack/react-router';
+import CipherLoader from "@/components/ciphers/CipherLoader";
+import AutokeyInputs from "@/components/ciphers/monosubstitution/autokey/AutokeyInputs";
+import { useGetAutokeyInfo } from "@/hooks/monosubstitution/AutokeyHooks";
+import { createFileRoute } from "@tanstack/react-router";
 
 
 /*
@@ -14,11 +14,12 @@ import { createFileRoute } from '@tanstack/react-router';
 }
 */
 
-export const Route = createFileRoute('/monosubstitution/autokey/')({
+export const Route = createFileRoute("/monosubstitution/autokey/")({
 	component: AutokeyPage
 });
 
 
+// eslint-disable-next-line react-refresh/only-export-components
 function AutokeyPage(){
 	const autokeyInfoQuery = useGetAutokeyInfo();
 

src/routes/monosubstitution/baconian/index.tsx

@@ -1,7 +1,7 @@
-import CipherLoader from '@/components/ciphers/CipherLoader';
-import BaconianInputs from '@/components/ciphers/monosubstitution/baconian/BaconianInputs';
-import { useGetBaconianInfo } from '@/hooks/monosubstitution/BaconianHooks';
-import { createFileRoute } from '@tanstack/react-router';
+import CipherLoader from "@/components/ciphers/CipherLoader";
+import BaconianInputs from "@/components/ciphers/monosubstitution/baconian/BaconianInputs";
+import { useGetBaconianInfo } from "@/hooks/monosubstitution/BaconianHooks";
+import { createFileRoute } from "@tanstack/react-router";
 
 
 /*
@@ -15,11 +15,12 @@ import { createFileRoute } from '@tanstack/react-router';
 */
 
 
-export const Route = createFileRoute('/monosubstitution/baconian/')({
+export const Route = createFileRoute("/monosubstitution/baconian/")({
 	component: BaconianPage
 });
 
 
+// eslint-disable-next-line react-refresh/only-export-components
 function BaconianPage(){
 	const baconianInfoQuery = useGetBaconianInfo();
 	return (

src/routes/monosubstitution/basex/index.tsx

@@ -1,7 +1,7 @@
-import CipherLoader from '@/components/ciphers/CipherLoader';
-import BaseXInputs from '@/components/ciphers/monosubstitution/basex/BaseXInputs';
-import { useGetBaseXInfo } from '@/hooks/monosubstitution/BaseXHooks';
-import { createFileRoute } from '@tanstack/react-router';
+import CipherLoader from "@/components/ciphers/CipherLoader";
+import BaseXInputs from "@/components/ciphers/monosubstitution/basex/BaseXInputs";
+import { useGetBaseXInfo } from "@/hooks/monosubstitution/BaseXHooks";
+import { createFileRoute } from "@tanstack/react-router";
 
 
 /*
@@ -19,11 +19,12 @@ import { createFileRoute } from '@tanstack/react-router';
 */
 
 
-export const Route = createFileRoute('/monosubstitution/basex/')({
+export const Route = createFileRoute("/monosubstitution/basex/")({
 	component: BaseXPage
 });
 
 
+// eslint-disable-next-line react-refresh/only-export-components
 function BaseXPage(){
 	const baseXInfoQuery = useGetBaseXInfo();
 

src/routes/monosubstitution/beaufort/index.tsx

@@ -1,7 +1,7 @@
-import CipherLoader from '@/components/ciphers/CipherLoader';
-import BeaufortInputs from '@/components/ciphers/monosubstitution/beaufort/BeaufortInputs';
-import { useGetBeaufortInfo } from '@/hooks/monosubstitution/BeaufortHooks';
-import { createFileRoute } from '@tanstack/react-router';
+import CipherLoader from "@/components/ciphers/CipherLoader";
+import BeaufortInputs from "@/components/ciphers/monosubstitution/beaufort/BeaufortInputs";
+import { useGetBeaufortInfo } from "@/hooks/monosubstitution/BeaufortHooks";
+import { createFileRoute } from "@tanstack/react-router";
 
 
 /*
@@ -15,11 +15,12 @@ import { createFileRoute } from '@tanstack/react-router';
 */
 
 
-export const Route = createFileRoute('/monosubstitution/beaufort/')({
+export const Route = createFileRoute("/monosubstitution/beaufort/")({
 	component: BeaufortPage
 });
 
 
+// eslint-disable-next-line react-refresh/only-export-components
 function BeaufortPage(){
 	const beaufortInfoQuery = useGetBeaufortInfo();
 

src/routes/monosubstitution/caesar/index.tsx

@@ -1,7 +1,7 @@
-import CipherLoader from '@/components/ciphers/CipherLoader';
-import CaesarInputs from '@/components/ciphers/monosubstitution/caesar/CaesarInputs';
-import { useGetCaesarInfo } from '@/hooks/monosubstitution/CaesarHooks';
-import { createFileRoute } from '@tanstack/react-router';
+import CipherLoader from "@/components/ciphers/CipherLoader";
+import CaesarInputs from "@/components/ciphers/monosubstitution/caesar/CaesarInputs";
+import { useGetCaesarInfo } from "@/hooks/monosubstitution/CaesarHooks";
+import { createFileRoute } from "@tanstack/react-router";
 
 
 /*
@@ -15,11 +15,12 @@ import { createFileRoute } from '@tanstack/react-router';
 */
 
 
-export const Route = createFileRoute('/monosubstitution/caesar/')({
+export const Route = createFileRoute("/monosubstitution/caesar/")({
 	component: CaesarPage
 });
 
 
+// eslint-disable-next-line react-refresh/only-export-components
 function CaesarPage(){
 	const caesarInfoQuery = useGetCaesarInfo();
 

src/routes/monosubstitution/index.tsx

@@ -30,6 +30,7 @@ export const Route = createFileRoute("/monosubstitution/")({
 });
 
 
+// eslint-disable-next-line react-refresh/only-export-components
 function MonoPage(){
 	return (
 		<main

src/routes/monosubstitution/onetimepad/index.tsx

@@ -1,7 +1,7 @@
-import CipherLoader from '@/components/ciphers/CipherLoader';
-import OneTimePadInputs from '@/components/ciphers/monosubstitution/onetimepad/OneTimePadInputs';
-import { useGetOneTimePadInfo } from '@/hooks/monosubstitution/OneTimePadHooks';
-import { createFileRoute } from '@tanstack/react-router';
+import CipherLoader from "@/components/ciphers/CipherLoader";
+import OneTimePadInputs from "@/components/ciphers/monosubstitution/onetimepad/OneTimePadInputs";
+import { useGetOneTimePadInfo } from "@/hooks/monosubstitution/OneTimePadHooks";
+import { createFileRoute } from "@tanstack/react-router";
 
 
 /*
@@ -18,11 +18,12 @@ import { createFileRoute } from '@tanstack/react-router';
 */
 
 
-export const Route = createFileRoute('/monosubstitution/onetimepad/')({
+export const Route = createFileRoute("/monosubstitution/onetimepad/")({
 	component: OneTimePadPage
 });
 
 
+// eslint-disable-next-line react-refresh/only-export-components
 function OneTimePadPage(){
 	const oneTimePadInfoQuery = useGetOneTimePadInfo();
 

src/routes/monosubstitution/porta/index.tsx

@@ -1,7 +1,7 @@
-import CipherLoader from '@/components/ciphers/CipherLoader';
-import PortaInputs from '@/components/ciphers/monosubstitution/porta/PortaInputs';
-import { useGetPortaInfo } from '@/hooks/monosubstitution/PortaHooks';
-import { createFileRoute } from '@tanstack/react-router';
+import CipherLoader from "@/components/ciphers/CipherLoader";
+import PortaInputs from "@/components/ciphers/monosubstitution/porta/PortaInputs";
+import { useGetPortaInfo } from "@/hooks/monosubstitution/PortaHooks";
+import { createFileRoute } from "@tanstack/react-router";
 
 
 /*
@@ -15,11 +15,12 @@ import { createFileRoute } from '@tanstack/react-router';
 */
 
 
-export const Route = createFileRoute('/monosubstitution/porta/')({
+export const Route = createFileRoute("/monosubstitution/porta/")({
 	component: PortaPage
 });
 
 
+// eslint-disable-next-line react-refresh/only-export-components
 function PortaPage(){
 	const portaInfoQuery = useGetPortaInfo();
 

src/routes/monosubstitution/substitution/index.tsx

@@ -1,7 +1,7 @@
-import CipherLoader from '@/components/ciphers/CipherLoader';
-import SubstitutionInputs from '@/components/ciphers/monosubstitution/substitution/SubstitutionInputs';
-import { useGetSubstitutionInfo } from '@/hooks/monosubstitution/SubstitutionHooks';
-import { createFileRoute } from '@tanstack/react-router';
+import CipherLoader from "@/components/ciphers/CipherLoader";
+import SubstitutionInputs from "@/components/ciphers/monosubstitution/substitution/SubstitutionInputs";
+import { useGetSubstitutionInfo } from "@/hooks/monosubstitution/SubstitutionHooks";
+import { createFileRoute } from "@tanstack/react-router";
 
 
 /*
@@ -15,11 +15,12 @@ import { createFileRoute } from '@tanstack/react-router';
 */
 
 
-export const Route = createFileRoute('/monosubstitution/substitution/')({
+export const Route = createFileRoute("/monosubstitution/substitution/")({
 	component: SubstitutionPage
 });
 
 
+// eslint-disable-next-line react-refresh/only-export-components
 function SubstitutionPage(){
 	const substitutionInfoQuery = useGetSubstitutionInfo();
 

src/routes/monosubstitution/vigenere/index.tsx

@@ -1,7 +1,7 @@
-import CipherLoader from '@/components/ciphers/CipherLoader';
-import VigenereInputs from '@/components/ciphers/monosubstitution/vigenere/VigenereInputs';
-import { useGetVigenereInfo } from '@/hooks/monosubstitution/VigenereHooks';
-import { createFileRoute } from '@tanstack/react-router';
+import CipherLoader from "@/components/ciphers/CipherLoader";
+import VigenereInputs from "@/components/ciphers/monosubstitution/vigenere/VigenereInputs";
+import { useGetVigenereInfo } from "@/hooks/monosubstitution/VigenereHooks";
+import { createFileRoute } from "@tanstack/react-router";
 
 
 /*
@@ -15,11 +15,12 @@ import { createFileRoute } from '@tanstack/react-router';
 */
 
 
-export const Route = createFileRoute('/monosubstitution/vigenere/')({
+export const Route = createFileRoute("/monosubstitution/vigenere/")({
 	component: VigenerePage
 });
 
 
+// eslint-disable-next-line react-refresh/only-export-components
 function VigenerePage(){
 	const vigenereInfoQuery = useGetVigenereInfo();
 

src/routes/polysubstitution/bifid/index.tsx

@@ -1,7 +1,7 @@
-import CipherLoader from '@/components/ciphers/CipherLoader';
-import BifidInputs from '@/components/ciphers/polysubstitution/bifid/BifidInputs';
-import { useGetBifidInfo } from '@/hooks/polysubstitution/BifidHooks';
-import { createFileRoute } from '@tanstack/react-router';
+import CipherLoader from "@/components/ciphers/CipherLoader";
+import BifidInputs from "@/components/ciphers/polysubstitution/bifid/BifidInputs";
+import { useGetBifidInfo } from "@/hooks/polysubstitution/BifidHooks";
+import { createFileRoute } from "@tanstack/react-router";
 
 
 /*
@@ -15,11 +15,12 @@ import { createFileRoute } from '@tanstack/react-router';
 */
 
 
-export const Route = createFileRoute('/polysubstitution/bifid/')({
+export const Route = createFileRoute("/polysubstitution/bifid/")({
 	component: BifidPage
 });
 
 
+// eslint-disable-next-line react-refresh/only-export-components
 function BifidPage(){
 	const bifidInfoQuery = useGetBifidInfo();
 

src/routes/polysubstitution/columnar/index.tsx

@@ -1,7 +1,7 @@
-import CipherLoader from '@/components/ciphers/CipherLoader';
-import ColumnarInputs from '@/components/ciphers/polysubstitution/columnar/ColumnarInputs';
-import { useGetColumnarInfo } from '@/hooks/polysubstitution/ColumnarHooks';
-import { createFileRoute } from '@tanstack/react-router';
+import CipherLoader from "@/components/ciphers/CipherLoader";
+import ColumnarInputs from "@/components/ciphers/polysubstitution/columnar/ColumnarInputs";
+import { useGetColumnarInfo } from "@/hooks/polysubstitution/ColumnarHooks";
+import { createFileRoute } from "@tanstack/react-router";
 
 
 /*
@@ -15,11 +15,12 @@ import { createFileRoute } from '@tanstack/react-router';
 */
 
 
-export const Route = createFileRoute('/polysubstitution/columnar/')({
+export const Route = createFileRoute("/polysubstitution/columnar/")({
 	component: ColumnarPage
 });
 
 
+// eslint-disable-next-line react-refresh/only-export-components
 function ColumnarPage(){
 	const columnarInfoQuery = useGetColumnarInfo();
 

src/routes/polysubstitution/hill/index.tsx

@@ -1,7 +1,7 @@
-import CipherLoader from '@/components/ciphers/CipherLoader';
-import HillInputs from '@/components/ciphers/polysubstitution/hill/HillInputs';
-import { useGetHillInfo } from '@/hooks/polysubstitution/HillHooks';
-import { createFileRoute } from '@tanstack/react-router';
+import CipherLoader from "@/components/ciphers/CipherLoader";
+import HillInputs from "@/components/ciphers/polysubstitution/hill/HillInputs";
+import { useGetHillInfo } from "@/hooks/polysubstitution/HillHooks";
+import { createFileRoute } from "@tanstack/react-router";
 
 
 /*
@@ -15,11 +15,12 @@ import { createFileRoute } from '@tanstack/react-router';
 */
 
 
-export const Route = createFileRoute('/polysubstitution/hill/')({
+export const Route = createFileRoute("/polysubstitution/hill/")({
 	component: HillPage
 });
 
 
+// eslint-disable-next-line react-refresh/only-export-components
 function HillPage(){
 	const hillInfoQuery = useGetHillInfo();
 

src/routes/polysubstitution/index.tsx

@@ -1,12 +1,13 @@
-import { polysubstitutionLinks } from '@/util/LinksUtil';
-import { createFileRoute, Link } from '@tanstack/react-router';
+import { polysubstitutionLinks } from "@/util/LinksUtil";
+import { createFileRoute, Link } from "@tanstack/react-router";
 
 
-export const Route = createFileRoute('/polysubstitution/')({
+export const Route = createFileRoute("/polysubstitution/")({
 	component: PolyPage
 });
 
 
+// eslint-disable-next-line react-refresh/only-export-components
 function PolyPage(){
 	return (
 		<main

src/routes/polysubstitution/morse/index.tsx

@@ -1,7 +1,7 @@
-import CipherLoader from '@/components/ciphers/CipherLoader';
-import MorseInputs from '@/components/ciphers/polysubstitution/morse/MorseInputs';
-import { useGetMorseInfo } from '@/hooks/polysubstitution/MorseHooks';
-import { createFileRoute } from '@tanstack/react-router';
+import CipherLoader from "@/components/ciphers/CipherLoader";
+import MorseInputs from "@/components/ciphers/polysubstitution/morse/MorseInputs";
+import { useGetMorseInfo } from "@/hooks/polysubstitution/MorseHooks";
+import { createFileRoute } from "@tanstack/react-router";
 
 
 /*
@@ -16,11 +16,12 @@ import { createFileRoute } from '@tanstack/react-router';
 */
 
 
-export const Route = createFileRoute('/polysubstitution/morse/')({
+export const Route = createFileRoute("/polysubstitution/morse/")({
 	component: MorsePage
 });
 
 
+// eslint-disable-next-line react-refresh/only-export-components
 function MorsePage(){
 	const morseInfoQuery = useGetMorseInfo();
 

src/routes/polysubstitution/playfair/index.tsx

@@ -1,7 +1,7 @@
-import CipherLoader from '@/components/ciphers/CipherLoader';
-import PlayfairInputs from '@/components/ciphers/polysubstitution/playfair/PlayfairInputs';
-import { useGetPlayfairInfo } from '@/hooks/polysubstitution/PlayfairHooks';
-import { createFileRoute } from '@tanstack/react-router';
+import CipherLoader from "@/components/ciphers/CipherLoader";
+import PlayfairInputs from "@/components/ciphers/polysubstitution/playfair/PlayfairInputs";
+import { useGetPlayfairInfo } from "@/hooks/polysubstitution/PlayfairHooks";
+import { createFileRoute } from "@tanstack/react-router";
 
 
 /*
@@ -15,11 +15,12 @@ import { createFileRoute } from '@tanstack/react-router';
 */
 
 
-export const Route = createFileRoute('/polysubstitution/playfair/')({
+export const Route = createFileRoute("/polysubstitution/playfair/")({
 	component: PlayfairPage
 });
 
 
+// eslint-disable-next-line react-refresh/only-export-components
 function PlayfairPage(){
 	const playfairInfoQuery = useGetPlayfairInfo();
 

src/routes/polysubstitution/polybius/index.tsx

@@ -1,7 +1,7 @@
-import CipherLoader from '@/components/ciphers/CipherLoader';
-import PolybiusInputs from '@/components/ciphers/polysubstitution/polybius/PolybiusInputs';
-import { useGetPolybiusInfo } from '@/hooks/polysubstitution/PolybiusHooks';
-import { createFileRoute } from '@tanstack/react-router';
+import CipherLoader from "@/components/ciphers/CipherLoader";
+import PolybiusInputs from "@/components/ciphers/polysubstitution/polybius/PolybiusInputs";
+import { useGetPolybiusInfo } from "@/hooks/polysubstitution/PolybiusHooks";
+import { createFileRoute } from "@tanstack/react-router";
 
 
 /*
@@ -16,11 +16,12 @@ import { createFileRoute } from '@tanstack/react-router';
 */
 
 
-export const Route = createFileRoute('/polysubstitution/polybius/')({
+export const Route = createFileRoute("/polysubstitution/polybius/")({
 	component: PolybiusPage
 });
 
 
+// eslint-disable-next-line react-refresh/only-export-components
 function PolybiusPage(){
 	const polybiusInfoQuery = useGetPolybiusInfo();
 

src/routes/polysubstitution/railfence/index.tsx

@@ -1,7 +1,7 @@
-import CipherLoader from '@/components/ciphers/CipherLoader';
-import RaidFenceInputs from '@/components/ciphers/polysubstitution/railfence/RailFenceInputs';
-import { useGetRailFenceInfo } from '@/hooks/polysubstitution/RailFenceHooks';
-import { createFileRoute } from '@tanstack/react-router';
+import CipherLoader from "@/components/ciphers/CipherLoader";
+import RaidFenceInputs from "@/components/ciphers/polysubstitution/railfence/RailFenceInputs";
+import { useGetRailFenceInfo } from "@/hooks/polysubstitution/RailFenceHooks";
+import { createFileRoute } from "@tanstack/react-router";
 
 
 /*
@@ -17,11 +17,12 @@ import { createFileRoute } from '@tanstack/react-router';
 */
 
 
-export const Route = createFileRoute('/polysubstitution/railfence/')({
+export const Route = createFileRoute("/polysubstitution/railfence/")({
 	component: RailFencePage
 });
 
 
+// eslint-disable-next-line react-refresh/only-export-components
 function RailFencePage(){
 	const railFenceInfoQuery = useGetRailFenceInfo();
 

src/routes/polysubstitution/trifid/index.tsx

@@ -1,7 +1,7 @@
-import CipherLoader from '@/components/ciphers/CipherLoader';
-import TrifidInputs from '@/components/ciphers/polysubstitution/trifid/TrifidInputs';
-import { useGetTrifidInfo } from '@/hooks/polysubstitution/TrifidHooks';
-import { createFileRoute } from '@tanstack/react-router';
+import CipherLoader from "@/components/ciphers/CipherLoader";
+import TrifidInputs from "@/components/ciphers/polysubstitution/trifid/TrifidInputs";
+import { useGetTrifidInfo } from "@/hooks/polysubstitution/TrifidHooks";
+import { createFileRoute } from "@tanstack/react-router";
 
 
 /*
@@ -15,11 +15,12 @@ import { createFileRoute } from '@tanstack/react-router';
 */
 
 
-export const Route = createFileRoute('/polysubstitution/trifid/')({
+export const Route = createFileRoute("/polysubstitution/trifid/")({
 	component: TrifidPage
 });
 
 
+// eslint-disable-next-line react-refresh/only-export-components
 function TrifidPage(){
 	const trifidInfoQuery = useGetTrifidInfo();
 

src/routes/tutorial/index.tsx

@@ -12,6 +12,7 @@ export const Route = createFileRoute('/tutorial/')({
 });
 
 
+// eslint-disable-next-line react-refresh/only-export-components
 function TutorialPage(){
 	return (
 		<main

tsconfig.app.json

@@ -22,7 +22,6 @@
 		"erasableSyntaxOnly": true,
 		"noFallthroughCasesInSwitch": true,
 		"noUncheckedSideEffectImports": true,
-		"baseUrl": ".",
 		"paths": {
 			"@/*": ["./src/*"],
 			"#root": ["."]

vite.config.ts

@@ -17,8 +17,8 @@ export default defineConfig({
 	],
 	resolve: {
 		alias: {
-			"@": resolve(__dirname, "./src"),
-			"#root": resolve(__dirname)
+			"@": resolve(import.meta.dirname, "./src"),
+			"#root": resolve(import.meta.dirname)
 		}
 	},
 	build: {