worldbrain / website

All data related to our website

Website

All data related to our website

Developing

1. Check out this repo
2. Run yarn
3. Run yarn start

Development practices

• All components and code are written in TypeScript
• All components which have styles are in a folder where the component is index.tsx, and the styles are styles.module.css. Example in src/components/layout/header
• Access to external state like the Auth system, or the network (instead of using fetch() directly), are done through the Services interface. All pages have access to the Services interface by inheriting from the Page component in src/components/page.tsx, through the protected method getServices(). Every page is responsible for passing down these services to the subcomponents that need them. (Explicit is better than implicit, so no React Contexts are used.) Temporary example in src/pages/home
• Shared colors in CSS are stored in variables. Colors used throughout the website are found in styles/globals.module.css, which you can explicitly import when you need it. Temporary example in src/components/layout/header/styles.module.css

TODO:

• What about CSS mixins?

website's Issues

Metadata for social media previews / unfurling isn't included

Just pasting a link to memex into our Discord, and no image preview or description.

There's some siteMetadata in gatsby-config.js, but it's not in the published version of the website: https://github.com/WorldBrain/Website/blob/9d47a9869d7562a98a4291aa5ed1083287acb754/gatsby-config.js

Which looks to just pull from html.tsx right now.

Here's an example template (a lightly scrubbed version of what I just added to some Fission apps):

<!-- Favicons & Mobile settings -->
<link rel="apple-touch-icon" sizes="180x180" href="apple-touch-icon.png" />
<link rel="icon" type="image/png" sizes="32x32" href="favicon-32x32.png" />
<link rel="icon" type="image/png" sizes="16x16" href="favicon-16x16.png" />
<link rel="manifest" href="site.webmanifest" />
<link rel="mask-icon" href="safari-pinned-tab.svg" color="#6446fa" />
<meta name="msapplication-TileColor" content="#1e2347" />
<meta name="theme-color" content="#1e2347" />
<!-- Social Metadata -->
<!-- Primary Meta Tags -->
<meta name="title" content="PAGE TITLE">
<meta name="description" content="DESCRIPTION">
<!-- Open Graph / Facebook -->
<meta property="og:type" content="website">
<meta property="og:url" content="https://getmemex.com/">
<meta property="og:title" content="PAGE TITLE">
<meta property="og:description" content="DESCRIPTION">
<meta property="og:image" content="FULL PATH TO IMAGE - Facebook Size">
<!-- Twitter -->
<meta property="twitter:card" content="summary_large_image">
<meta name="twitter:site" content="@WorldBrain">
<meta property="twitter:url" content="https://getmemex.com">
<meta property="twitter:title" content="PAGE TITLE">
<meta property="twitter:description" content="DESCRIPTION">
<meta property="twitter:image" content="FULL PATH TO IMAGE - Twitter Size">
<meta name="twitter:label1" value="Subscribe today for end-to-end encrypted sync with mobile" />
<meta name="twitter:data1" value="Just 2€ per month or 20€ per year" />

Those Twitter data labels are read in by (among others) Slack when you paste in links there.

Chargebee bugs after first signup

Hi @cdharris I'm logging this first issue here incase you haven't seen this yet.

ChargeBee throws an error when the signup and upgrade is first completed. I can show you via screen share sometime but i've tagged you in the figma file where i lay out the process.

getmemex.com
step 1: click upgrade from the website
step 2: create new account
step 3: it puts you back on the main page, so then you have to click upgrade again or click My Account (https://getmemex.com/subscriptions)
step 4: then on the account page nothing loads and this error appears

When i refresh the page the Chargebee modal still doesn't load.

Issue 2: If you close the modal while on My Account it feels weird because then you are on an empty page and it's not clear how to regain access to that subscription modal.
I've looked into some quick wins into making that better like having at least a message and then a link to manage subscription which might be nicer than having chargebee modal try to popup over a blank page. OR idea 2 we could make it so that My Account isn't a new page they go it, it triggers the modal from where they are.

Idea 1 - link to popup from account page, not from menu

Idea 2 - popup, no separate account page

Bug: homepage anchor links break if not on homepage

Go to Getmemex.com, and from the top address bar...

• Click on Login
• Click on Pricing

Nothing will happen. Looks like Pricing and Community are anchors in the home page, but the links are relative.