Parameters: grab 'color' URL param to override starting iconColor

This commit is contained in:
rektdeckard
2021-01-07 18:47:04 -05:00
parent 4d602cfce2
commit 5166b0345c
2 changed files with 24 additions and 0 deletions

View File

@@ -1,6 +1,7 @@
import React, { Suspense } from "react";
import "./App.css";
import Parameters from "../Parameters/Parameters";
import Header from "../Header/Header";
import Toolbar from "../Toolbar/Toolbar";
import IconGrid from "../IconGrid/IconGrid";
@@ -15,6 +16,7 @@ const waitingFallback = <Notice type="none" message="" />;
const App: React.FC<any> = () => {
return (
<React.StrictMode>
<Parameters />
<Header />
<main>
<Toolbar />

View File

@@ -0,0 +1,22 @@
import React, { useEffect } from "react";
import { useSearchParam } from "react-use";
import { useSetRecoilState } from "recoil";
import TinyColor from "tinycolor2";
import { iconColorAtom } from "../../state/atoms";
const Parameters: React.FC<{}> = () => {
const color = useSearchParam("color")?.replace(/["']/g, "");
const setColor = useSetRecoilState(iconColorAtom);
useEffect(() => {
if (color) {
const normalizedColor = TinyColor(color);
if (normalizedColor.isValid()) setColor(normalizedColor.toHexString());
}
}, [color, setColor]);
return null;
};
export default Parameters;