refactor: nest LumeProvider under BrowserStateProvider and disable navigation if logged out

This commit is contained in:
Derrick Hammer 2023-10-11 10:27:12 -04:00
parent 3c6a756666
commit 1ca2431e9d
Signed by: pcfreak30
GPG Key ID: C997C339BE476FF2
3 changed files with 20 additions and 22 deletions

View File

@ -4,10 +4,12 @@ import {
Navigator,
} from "@/components/Browser.tsx";
import Lume from "@/components/Lume.tsx";
import { LumeProvider } from "@lumeweb/sdk";
export default function () {
return (
<BrowserStateProvider>
<LumeProvider>
<>
<header className="relative h-14 px-2 pl-2 py-2 w-full bg-neutral-900 flex">
<div className="relative h-full w-full rounded-full bg-neutral-800 border border-neutral-700 flex items-center [>input:focus]:ring-2 [>input:focus]:ring-white">
@ -19,6 +21,7 @@ export default function () {
</header>
<Browser />
</>
</LumeProvider>
</BrowserStateProvider>
);
}

View File

@ -21,6 +21,7 @@ import Arrow from "@/components/Arrow.tsx";
import type React from "react";
import { Input } from "@/components/ui/input.tsx";
import { Button } from "@/components/ui/button.tsx";
import { useLume } from "@lumeweb/sdk";
let BOOT_FUNCTIONS: (() => Promise<any>)[] = [];
@ -115,6 +116,7 @@ async function bootup() {
export function Navigator() {
const { url, setUrl } = useBrowserState();
const { isLoggedIn } = useLume();
const inputRef = createRef<HTMLInputElement>();
const browse = () => {
@ -145,8 +147,8 @@ export function Navigator() {
return (
<>
<NavInput ref={inputRef} />
<Button onClick={browse}>
<NavInput ref={inputRef} disabled={!isLoggedIn} />
<Button onClick={browse} disabled={!isLoggedIn}>
Navigate
<Arrow />
</Button>

View File

@ -6,7 +6,8 @@ import {
useLume,
LumeProvider,
} from "@lumeweb/sdk";
const Lume = () => {
export default function () {
const { isLoggedIn, ready } = useLume();
return (
<>
@ -29,12 +30,4 @@ const Lume = () => {
</LumeIdentity>
</>
);
};
export default function () {
return (
<LumeProvider>
<Lume />
</LumeProvider>
);
}