//options: default, terms, privacy, community State.init({ show: "default", terms: null, privacy: null, community: null }); const termsCid = "bafybeieqhkr6kxqc5v3fmuieuiaeh6qb57pk6nyy575n7yglfdmx6ophla"; const privacyCid = "bafybeifiuurrqgrzizkr5gghj3yymto3g73ix2uowlyd7hcr5rsg4wtgom"; const communityCidPath = "TODO"; // using web3.storage gateway since near.social is failing to resolve // NOTE: this gateway has a 200req/hr/ip rate limit // https://web3.storage/docs/concepts/w3link/#rate-limits asyncFetch(`https://${termsCid}.ipfs.w3s.link/terms.md`).then((res) => { State.update({ terms: res.body }); }); asyncFetch(`https://${privacyCid}.ipfs.w3s.link/privacy.md`).then((res) => { State.update({ privacy: res.body }); }); const Wrapper = styled.div` `; const DocBox = styled.div` display: flex; flex-direction: column; row-gap: 0.5rem; border: solid 1px lightgrey; border-radius: 0.75rem; padding: 1rem; &:hover { color: var(--bs-green); border-color: var(--bs-green); } `; const DocTitle = styled.div` display: flex; flex-direction: row; column-gap: 0.5rem; font-weight: bold; align-items: center; `; const DocSummary = styled.span` color: grey `; const Arrow = styled.i` color: var(--bs-green); font-size: 1.25rem; `; // const DocFullDisplay = styled.div` // display: flex; // flex // `; const DocContent = styled.div` overflow-y: scroll; `; return ( <Wrapper className="d-flex flex-column gap-3 justify-content-center"> {state.show === "default" && ( <> <h3>Terms, Privacy, and Community Guidelines</h3> <p> To continue using alpha.near.org, please read and agree to the following terms and policies: </p> <DocBox onClick={() => { State.update({ show: "terms" }); }} > <DocTitle> Terms of Service <Arrow className="bi bi-arrow-right" /> </DocTitle> <DocSummary>Summary</DocSummary> </DocBox> <DocBox onClick={() => { State.update({ show: "privacy" }); }} > <DocTitle> Privacy Policy <Arrow className="bi bi-arrow-right" /> </DocTitle> <DocSummary>Summary</DocSummary> </DocBox> <DocBox> <DocTitle> Community Guidelines <Arrow className="bi bi-arrow-right" /> </DocTitle> <DocSummary>Summary</DocSummary> </DocBox> </> )} {state.show === "terms" && ( <> <button onClick={() => { State.update({ show: "default" }); props.expand(false); }} className="btn btn-outline-success" style={{ width: "6rem" }} > <i className="bi bi-arrow-left" /> Back </button> <DocContent> <Markdown text={state.terms} /> </DocContent> </> )} {state.show === "privacy" && ( <> <button onClick={() => { State.update({ show: "default" }); props.expand(false); }} className="btn btn-outline-success" style={{ width: "6rem" }} > <i className="bi bi-arrow-left" /> Back </button> <DocContent> <Markdown text={state.privacy} /> </DocContent> </> )} </Wrapper> );