Skip to content

Commit

Permalink
chore(docs): remove playground (#4321)
Browse files Browse the repository at this point in the history
# Description

## Problem\*

Resolves #4092

## Summary\*

This PR deletes the Noir playground off of the homepage of the docs so
it doesn't interfere.

## Additional Context



## Documentation\*

Check one:
- [ ] No documentation needed.
- [x] Documentation included in this PR.
- [ ] **[Exceptional Case]** Documentation to be submitted in a separate
PR.

# PR Checklist\*

- [x] I have tested the changes locally.
- [x] I have formatted the changes with [Prettier](https://prettier.io/)
and/or `cargo fmt` on default settings.
  • Loading branch information
TomAFrench authored Feb 9, 2024
1 parent f3358f0 commit 69b8912
Show file tree
Hide file tree
Showing 3 changed files with 36 additions and 249 deletions.
1 change: 0 additions & 1 deletion docs/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -18,7 +18,6 @@
"@noir-lang/noir_js": "workspace:*",
"@noir-lang/noirc_abi": "workspace:*",
"@noir-lang/types": "workspace:*",
"@signorecello/noir_playground": "^0.7.0",
"axios": "^1.4.0",
"clsx": "^1.2.1",
"hast-util-is-element": "^1.1.0",
Expand Down
101 changes: 35 additions & 66 deletions docs/src/pages/index.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -5,19 +5,7 @@ import Link from '@docusaurus/Link';
import headerPic from '@site/static/img/homepage_header_pic.png';
import { BeatLoader } from 'react-spinners';

const NoirEditor = lazy(() => import('@signorecello/noir_playground'));

const Spinner = () => {
return (
<div style={{ textAlign: 'center', marginTop: '4rem' }}>
<BeatLoader color="#4F3C63" />
</div>
);
};

export default function Landing() {
const [tryIt, setTryIt] = React.useState(false);

return (
<Layout>
<div style={{ minHeight: '100vh' }}>
Expand All @@ -41,65 +29,46 @@ export default function Landing() {
compatible proving system. Its design choices are influenced heavily by Rust and focuses on a simple,
familiar syntax.
</p>
{!tryIt && (
<div className="homepage_cta_header_container">
<div className="homepage_cta_container">
<Link to="/docs" target="_blank" rel="noopener noreferrer">
<button className="cta-button button button--primary button--lg homepage_cta">Read the Docs</button>
</Link>
<Link to="/">
<button
onClick={(e) => setTryIt(!tryIt)}
className="cta-button button button--secondary button--lg homepage_cta"
>
Go to Playground
</button>
</Link>
</div>
</div>
)}
{tryIt && (
<Suspense fallback={<Spinner />}>

<div className="homepage_cta_header_container">
<div className="homepage_cta_container">
<Link to="/docs" target="_blank" rel="noopener noreferrer">
<button className="cta-button button button--primary button--lg homepage_cta">Read the Docs</button>
</Link>
<NoirEditor style={{ width: '100%', height: '300px' }} baseUrl="https://play.noir-lang.org" />
</Suspense>
)}
</div>
</div>

{!tryIt && (
<div className="homepage_cta_lj_container">
<div className="homepage_cta_container">
<h2 className="homepage_h2">Learn</h2>
<Link to="/docs/getting_started/installation" target="_blank" rel="noopener noreferrer">
<button className="cta-button button button--primary button--lg homepage_cta">Try Noir</button>
</Link>
<Link to="/docs" target="_blank" rel="noopener noreferrer">
<button className="cta-button button button--secondary button--lg homepage_cta">
Noir Cryptography
</button>
</Link>
</div>
<div className="homepage_cta_container">
<h2 className="homepage_h2">Coming from...</h2>
<Link to="/docs/how_to/solidity_verifier" target="_blank" rel="noopener noreferrer">
<button className="cta-button button button--primary button--lg homepage_cta">Solidity</button>
</Link>
<Link to="/docs" target="_blank" rel="noopener noreferrer">
<button className="cta-button button button--secondary button--lg homepage_cta">Aztec</button>
</Link>
</div>
<div className="homepage_cta_container">
<h2 className="homepage_h2">New to Everything</h2>
<Link to="/docs" target="_blank" rel="noopener noreferrer">
<button className="cta-button button button--primary button--lg homepage_cta">Noir Basics</button>
</Link>
<Link to="/docs/tutorials/noirjs_app" target="_blank" rel="noopener noreferrer">
<button className="cta-button button button--secondary button--lg homepage_cta">NoirJS</button>
</Link>
</div>
<div className="homepage_cta_lj_container">
<div className="homepage_cta_container">
<h2 className="homepage_h2">Learn</h2>
<Link to="/docs/getting_started/installation" target="_blank" rel="noopener noreferrer">
<button className="cta-button button button--primary button--lg homepage_cta">Try Noir</button>
</Link>
<Link to="/docs" target="_blank" rel="noopener noreferrer">
<button className="cta-button button button--secondary button--lg homepage_cta">
Noir Cryptography
</button>
</Link>
</div>
<div className="homepage_cta_container">
<h2 className="homepage_h2">Coming from...</h2>
<Link to="/docs/how_to/solidity_verifier" target="_blank" rel="noopener noreferrer">
<button className="cta-button button button--primary button--lg homepage_cta">Solidity</button>
</Link>
<Link to="/docs" target="_blank" rel="noopener noreferrer">
<button className="cta-button button button--secondary button--lg homepage_cta">Aztec</button>
</Link>
</div>
<div className="homepage_cta_container">
<h2 className="homepage_h2">New to Everything</h2>
<Link to="/docs" target="_blank" rel="noopener noreferrer">
<button className="cta-button button button--primary button--lg homepage_cta">Noir Basics</button>
</Link>
<Link to="/docs/tutorials/noirjs_app" target="_blank" rel="noopener noreferrer">
<button className="cta-button button button--secondary button--lg homepage_cta">NoirJS</button>
</Link>
</div>
)}
</div>
</div>
</div>
</Layout>
Expand Down
Loading

0 comments on commit 69b8912

Please sign in to comment.