Parameters: grab 'color' URL param to override starting iconColor
This commit is contained in:
@@ -1,6 +1,7 @@
|
|||||||
import React, { Suspense } from "react";
|
import React, { Suspense } from "react";
|
||||||
|
|
||||||
import "./App.css";
|
import "./App.css";
|
||||||
|
import Parameters from "../Parameters/Parameters";
|
||||||
import Header from "../Header/Header";
|
import Header from "../Header/Header";
|
||||||
import Toolbar from "../Toolbar/Toolbar";
|
import Toolbar from "../Toolbar/Toolbar";
|
||||||
import IconGrid from "../IconGrid/IconGrid";
|
import IconGrid from "../IconGrid/IconGrid";
|
||||||
@@ -15,6 +16,7 @@ const waitingFallback = <Notice type="none" message="" />;
|
|||||||
const App: React.FC<any> = () => {
|
const App: React.FC<any> = () => {
|
||||||
return (
|
return (
|
||||||
<React.StrictMode>
|
<React.StrictMode>
|
||||||
|
<Parameters />
|
||||||
<Header />
|
<Header />
|
||||||
<main>
|
<main>
|
||||||
<Toolbar />
|
<Toolbar />
|
||||||
|
|||||||
22
src/components/Parameters/Parameters.tsx
Normal file
22
src/components/Parameters/Parameters.tsx
Normal 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;
|
||||||
Reference in New Issue
Block a user