refactor: pass props to dashboard button

This commit is contained in:
Derrick Hammer 2023-10-12 14:02:31 -04:00
parent 9f7677885c
commit 02fd3e558f
Signed by: pcfreak30
GPG Key ID: C997C339BE476FF2
1 changed files with 12 additions and 8 deletions

View File

@ -15,8 +15,10 @@ const SYNCSTATE_TO_TEXT: Record<Network["syncState"], string> = {
export const LumeDashboardTrigger = Dialog.Trigger; export const LumeDashboardTrigger = Dialog.Trigger;
LumeDashboardTrigger.displayName = "LumeDashboardTrigger"; LumeDashboardTrigger.displayName = "LumeDashboardTrigger";
const LumeDashboard = ({children}: React.PropsWithChildren) => { const LumeDashboard = ({ children }: React.PropsWithChildren) => {
const { lume: { networks } } = useLume(); const {
lume: { networks },
} = useLume();
const [uniqueNetworkTypes, setUniqueNetworkTypes] = useState<string[]>([]); const [uniqueNetworkTypes, setUniqueNetworkTypes] = useState<string[]>([]);
@ -26,22 +28,24 @@ const LumeDashboard = ({children}: React.PropsWithChildren) => {
setUniqueNetworkTypes(uniqueTypes); setUniqueNetworkTypes(uniqueTypes);
}, [networks]); }, [networks]);
const DefaultTrigger = () => ( const DefaultTrigger = (props: any) => (
<LumeDashboardTrigger asChild> <LumeDashboardTrigger asChild>
<button className="bg-primary text-primary-foreground p-2 px-4 text-sm font-semibold font-mono rounded-md"> <button
className="bg-primary text-primary-foreground p-2 px-4 text-sm font-semibold font-mono rounded-md"
{...props}>
Open Dashboard Open Dashboard
</button> </button>
</LumeDashboardTrigger> </LumeDashboardTrigger>
); );
const GivenTrigger = React.Children.toArray(children) const GivenTrigger = React.Children.toArray(children)
.filter((c) => { .filter((c) => {
console.log({component: c}) console.log({ component: c });
if(typeof c === 'object'){ if (typeof c === "object") {
//@ts-expect-error -- I dont know what the type of this should be, i just know that this works //@ts-expect-error -- I dont know what the type of this should be, i just know that this works
return c.type?.displayName === "LumeDashboardTrigger" return c.type?.displayName === "LumeDashboardTrigger";
} }
return false return false;
}) })
.at(0); .at(0);
const Trigger = GivenTrigger ? () => GivenTrigger : DefaultTrigger; const Trigger = GivenTrigger ? () => GivenTrigger : DefaultTrigger;