lbry-sec/pages/index.js

import React from 'react';
import Head from 'next/head';
import Image from 'next/image';

import { Twitter } from '../component/twitter';
import { Stripe } from '../component/stripe';
import { t, m } from '../i18n';
import { tracker } from '../analytics';

export default function Home() {
  const [email, setEmail] = React.useState('');
  const [emailLoading, setEmailLoading] = React.useState(false);
  const [emailError, setEmailError] = React.useState();
  const [emailSuccess, setEmailSuccess] = React.useState();
  const lang = 'en'; // req.query.lang || 'en'

  React.useEffect(() => {
    tracker.trackPageView();
  }, []);

  function __(message) {
    return t(message, lang);
  }

  function handleEmailSubmit(e) {
    e.preventDefault();

    if (!email) {
      return;
    }

    setEmailError(false);
    setEmailSuccess(false);
    setEmailLoading(true);

    fetch('/api/email', {
      method: 'POST',
      headers: {
        'Content-Type': 'application/json',
      },
      body: JSON.stringify({
        email,
      }),
    })
      .then((res) => res.json())
      .then((data) => {
        setEmailLoading(false);
        setEmailSuccess(true);
      })
      .catch(() => {
        setEmailLoading(false);
        setEmailSuccess(false);
        setEmailError(true);
      });
  }

  return (
    <div>
      <Head>
        <title>{__(m.title)}</title>
        <link rel="icon" href="/favicon.ico" />

        <meta
          property="og:image"
          content="https://i.imgur.com/pnU7PJz.jpg"
          key="image"
        />
        <meta
          property="og:description"
          content="The SEC doesn’t understand blockchain or crypto. They’re saying LBC is a security, it’s not!"
          key="description"
        />
      </Head>

      <header>
        <span className="title">{__(m.title)}</span>

        <div className="header__links">
          <a
            className="link"
            href="https://docs.google.com/document/d/1QYSruKLjStWZOTTmkatfUZaCdp4lHWwk6TmUvytzTx0/edit#"
            rel="noreferrer noopener"
            target="_blannk"
          >
            {__(m.faq)}
          </a>
        </div>
      </header>

      <main>
        <div className="landing__img-container">
          <img className="landing__img" src="https://i.imgur.com/pnU7PJz.jpg" />
        </div>

        <div className="landing__text">
          <h1 className="landing__title">
            {__(m.help_lbry)}
            <br />
            SAVE CRYPTO
          </h1>
          <div className="landing__subtitle">
            <div>
              The SEC doesn’t understand blockchain. The claims made in SEC vs. LBRY, Inc. would destroy the United States cryptocurrency industry.
            </div>
            <div className="landing__standout">
              <span>Help us educate the SEC</span>
            </div>
          </div>
        </div>

        <div className="content">
          <h2>What’s the big deal?</h2>
          <div className="content__subtitle">
            The entire blockchain industry is at risk in the United States. Big tech and Wall St. would have more power and many people could lose their jobs!
          </div>
          <div>
            <small>Warning / Enticement: this video is more entertainment than education, read the
              <a className="link" href="https://odysee.com/helplbrysavecrypto">Case Guide & FAQ</a>
              for facts
            </small>
          </div>
          <div className="video">
            <iframe
              id="lbry-iframe"
              src="https://odysee.com/$/embed/odysee/7a416c44a6888d94fe045241bbac055c726332aa?r=A6zE8KtZ6VVk268xANdFViL8znbDXL4F"
              allowFullScreen
            />
          </div>

          <div className="content__section">
            <p>
              The SEC is advancing an aggressive and disastrous new standard that would make almost all blockchain tokens securities.
<br/><br/>
              Classifying all blockchain tokens as securities will be a bureaucratic nightmare for all United States residents and businesses operating in the United States.
            </p>

            <div className="content__img">
              <Image
                src="/machine.png"
                alt="Image of LBRY cartoon"
                layout="fill"
                //   height={100}
                //   width={100}
              />
            </div>
          </div>
          <div className="content__section">
            <div className="content__img">
              <Image
                className="content__img"
                src="/megaphone.png"
                alt="Image of LBRY cartoon"
                layout="fill"

                //   height={100}
                //   width={100}
              />
            </div>

            <p>
              Under this new standard, almost any token is a security, including the previously safe ETH. The SEC additionally claim that token sales are sales of securities too!  
              <br/><br/>
              This change will make it much harder for startups to form new blockchain companies, cause massive job loss, and stunt the development of a critical new technology. All the while, big tech and Wall St. prosper!
            </p>
          </div>

          <h2>Share this story</h2>
          <div className="content__subtitle">
            Post to social media to spread awareness.
            &nbsp;
            <a
              href="https://twitter.com/intent/tweet?text=LBRY%20and%20cryptocurrencies%20are%20useful%20technologies%20that%20must%20remain%20legal%20and%20free%20%23HelpLBRYSaveCrypto%0A%0Awww.helplbrysavecrypto.com"
              className="link"
              rel="noreferrer noopener"
              target="_blannk"
            >
              #HelpLBRYSaveCrypto
            </a>
          </div>
        </div>

        <div className="content">
          <h2>What are people saying?</h2>
          <Twitter />
        </div>

        <div className="content">
          <h2>Sign the petition</h2>
          <div className="content__subtitle">
            Tell Gary Gensler and the SEC that cryptocurrency must remain legal and free.{' '}
            <a className="link" href="https://www.change.org/p/28064277">Add your signature</a>.
          </div>
        </div>


        <div className="email">
          <h2>Stay up to date</h2>
          <div className="email__subtitle">
            We will keep you up to date with any information we receive about
            this case.
          </div>

          <label htmlFor="email">Email</label>
          <form className="email__group" onSubmit={handleEmailSubmit}>
            <input
                type="email"
                name="email"
                placeholder="ihatecensorship@protonmail.com"
                value={email}
                onChange={(e) => setEmail(e.target.value)}
            />
            <button disabled={!email || emailLoading}>
              {emailLoading ? 'Submitting' : 'Submit'}
            </button>
          </form>

          {emailSuccess && (
              <div className="email__success">
                Thank you! We will keep you in the loop.
              </div>
          )}
          {emailError && (
              <div className="email__success">
                Sorry, there was an error. Please try again.
              </div>
          )}
        </div>

        <div className="content">
          <h2>Try LBRY</h2>
          <div className="content__subtitle">
            If the government and big tech want it gone, it must be good.
          </div>
          <div>
            <a href="https://lbry.com/get" className="link">LBRY Desktop</a> (decentralized and open-source)
            <a href="https://odysee.com" className="link">Odysee</a> (easiest to use)
          </div>
        </div>

      </main>
    </div>
  );
}
-												email working

											
										
										
											2021-03-28 00:33:47 +01:00
+								import React from 'react';
-												first commit

											
										
										
											2021-03-27 18:41:37 +01:00
+								import Head from 'next/head';
-												add images

											
										
										
											2021-03-28 18:59:34 +02:00
+								import Image from 'next/image';
-												added tweetst

											
										
										
											2021-03-28 06:57:49 +02:00
+								import { Twitter } from '../component/twitter';
-												i18n wip

											
										
										
											2021-03-28 16:38:52 +02:00
+								import { Stripe } from '../component/stripe';
 								import { t, m } from '../i18n';
-												add matomo

											
										
										
											2021-03-28 18:06:22 +02:00
+								import { tracker } from '../analytics';
-												Initial commit from Create Next App

											
										
										
											2021-03-27 17:25:50 +01:00
 								export default function Home() {
-												email working

											
										
										
											2021-03-28 00:33:47 +01:00
+								  const [email, setEmail] = React.useState('');
 								  const [emailLoading, setEmailLoading] = React.useState(false);
 								  const [emailError, setEmailError] = React.useState();
 								  const [emailSuccess, setEmailSuccess] = React.useState();
-												i18n

											
										
										
											2021-03-28 16:44:13 +02:00
+								  const lang = 'en'; // req.query.lang || 'en'
-												i18n wip

											
										
										
											2021-03-28 16:38:52 +02:00
-												add matomo

											
										
										
											2021-03-28 18:06:22 +02:00
+								  React.useEffect(() => {
 								    tracker.trackPageView();
 								  }, []);
-												i18n wip

											
										
										
											2021-03-28 16:38:52 +02:00
+								  function __(message) {
 								    return t(message, lang);
 								  }
-												email working

											
										
										
											2021-03-28 00:33:47 +01:00
 								  function handleEmailSubmit(e) {
 								    e.preventDefault();
 								    if (!email) {
 								      return;
 								    }
 								    setEmailError(false);
 								    setEmailSuccess(false);
 								    setEmailLoading(true);
 								    fetch('/api/email', {
 								      method: 'POST',
 								      headers: {
 								        'Content-Type': 'application/json',
 								      },
 								      body: JSON.stringify({
 								        email,
 								      }),
 								    })
-												email working

											
										
										
											2021-03-28 04:42:43 +02:00
+								      .then((res) => res.json())
-												email working

											
										
										
											2021-03-28 00:33:47 +01:00
+								      .then((data) => {
 								        setEmailLoading(false);
 								        setEmailSuccess(true);
 								      })
 								      .catch(() => {
 								        setEmailLoading(false);
 								        setEmailSuccess(false);
 								        setEmailError(true);
 								      });
 								  }
-												add matomo

											
										
										
											2021-03-28 18:06:22 +02:00
-												Initial commit from Create Next App

											
										
										
											2021-03-27 17:25:50 +01:00
+								  return (
-												first commit

											
										
										
											2021-03-27 18:41:37 +01:00
+								    <div>
-												Initial commit from Create Next App

											
										
										
											2021-03-27 17:25:50 +01:00
+								      <Head>
-												i18n wip

											
										
										
											2021-03-28 16:38:52 +02:00
+								        <title>{__(m.title)}</title>
-												Initial commit from Create Next App

											
										
										
											2021-03-27 17:25:50 +01:00
+								        <link rel="icon" href="/favicon.ico" />
-												test with dummy image

											
										
										
											2021-03-28 07:26:08 +02:00
 								        <meta
 								          property="og:image"
-												landing image + og:image

											
										
										
											2021-03-28 17:21:03 +02:00
+								          content="https://i.imgur.com/pnU7PJz.jpg"
-												test with dummy image

											
										
										
											2021-03-28 07:26:08 +02:00
+								          key="image"
 								        />
-												add og:description

											
										
										
											2021-03-28 17:29:23 +02:00
+								        <meta
 								          property="og:description"
 								          content="The SEC doesn’t understand blockchain or crypto. They’re saying LBC is a security, it’s not!"
 								          key="description"
 								        />
-												Initial commit from Create Next App

											
										
										
											2021-03-27 17:25:50 +01:00
+								      </Head>
-												first commit

											
										
										
											2021-03-27 18:41:37 +01:00
+								      <header>
-												i18n wip

											
										
										
											2021-03-28 16:38:52 +02:00
+								        <span className="title">{__(m.title)}</span>
-												Initial commit from Create Next App

											
										
										
											2021-03-27 17:25:50 +01:00
-												first commit

											
										
										
											2021-03-27 18:41:37 +01:00
+								        <div className="header__links">
-												basic outline

											
										
										
											2021-03-27 19:31:06 +01:00
+								          <a
-												update link colors

											
										
										
											2021-03-28 18:23:24 +02:00
+								            className="link"
-												basic outline

											
										
										
											2021-03-27 19:31:06 +01:00
+								            href="https://docs.google.com/document/d/1QYSruKLjStWZOTTmkatfUZaCdp4lHWwk6TmUvytzTx0/edit#"
-												added tweetst

											
										
										
											2021-03-28 06:57:49 +02:00
+								            rel="noreferrer noopener"
-												basic outline

											
										
										
											2021-03-27 19:31:06 +01:00
+								            target="_blannk"
 								          >
-												i18n

											
										
										
											2021-03-28 16:44:13 +02:00
+								            {__(m.faq)}
-												basic outline

											
										
										
											2021-03-27 19:31:06 +01:00
+								          </a>
-												first commit

											
										
										
											2021-03-27 18:41:37 +01:00
+								        </div>
 								      </header>
 								      <main>
-												landing image + og:image

											
										
										
											2021-03-28 17:21:03 +02:00
+								        <div className="landing__img-container">
 								          <img className="landing__img" src="https://i.imgur.com/pnU7PJz.jpg" />
 								        </div>
-												first commit

											
										
										
											2021-03-27 18:41:37 +01:00
 								        <div className="landing__text">
 								          <h1 className="landing__title">
-												i18n

											
										
										
											2021-03-28 16:44:13 +02:00
+								            {__(m.help_lbry)}
-												first commit

											
										
										
											2021-03-27 18:41:37 +01:00
+								            <br />
-												email working

											
										
										
											2021-03-28 00:33:47 +01:00
+								            SAVE CRYPTO
-												first commit

											
										
										
											2021-03-27 18:41:37 +01:00
+								          </h1>
-												basic outline

											
										
										
											2021-03-27 19:31:06 +01:00
+								          <div className="landing__subtitle">
-												email working

											
										
										
											2021-03-28 00:33:47 +01:00
+								            <div>
-												copy changes and ugly elements

											
										
										
											2021-03-28 22:48:58 +02:00
+								              The SEC doesn’t understand blockchain. The claims made in SEC vs. LBRY, Inc. would destroy the United States cryptocurrency industry.
-												basic outline

											
										
										
											2021-03-27 19:31:06 +01:00
+								            </div>
-												added tweetst

											
										
										
											2021-03-28 06:57:49 +02:00
+								            <div className="landing__standout">
 								              <span>Help us educate the SEC</span>
 								            </div>
-												basic outline

											
										
										
											2021-03-27 19:31:06 +01:00
+								          </div>
-												first commit

											
										
										
											2021-03-27 18:41:37 +01:00
+								        </div>
-												Initial commit from Create Next App

											
										
										
											2021-03-27 17:25:50 +01:00
-												first commit

											
										
										
											2021-03-27 18:41:37 +01:00
+								        <div className="content">
-												i18n wip

											
										
										
											2021-03-28 16:38:52 +02:00
+								          <h2>What’s the big deal?</h2>
-												updates

											
										
										
											2021-03-27 20:52:23 +01:00
+								          <div className="content__subtitle">
-												julian copy suggestion
											
										
										
											2021-03-29 00:31:20 +02:00
+								            The entire blockchain industry is at risk in the United States. Big tech and Wall St. would have more power and many people could lose their jobs!
-												copy changes and ugly elements

											
										
										
											2021-03-28 22:48:58 +02:00
+								          </div>
 								          <div>
 								            <small>Warning / Enticement: this video is more entertainment than education, read the
 								              <a className="link" href="https://odysee.com/helplbrysavecrypto">Case Guide & FAQ</a>
 								              for facts
 								            </small>
-												updates

											
										
										
											2021-03-27 20:52:23 +01:00
+								          </div>
-												first commit

											
										
										
											2021-03-27 18:41:37 +01:00
+								          <div className="video">
-												add images

											
										
										
											2021-03-28 18:59:34 +02:00
+								            <iframe
-												updates

											
										
										
											2021-03-27 20:52:23 +01:00
+								              id="lbry-iframe"
 								              src="https://odysee.com/$/embed/odysee/7a416c44a6888d94fe045241bbac055c726332aa?r=A6zE8KtZ6VVk268xANdFViL8znbDXL4F"
-												added tweetst

											
										
										
											2021-03-28 06:57:49 +02:00
+								              allowFullScreen
-												add images

											
										
										
											2021-03-28 18:59:34 +02:00
+								            />
 								          </div>
 								          <div className="content__section">
 								            <p>
-												julian copy suggestion
											
										
										
											2021-03-29 00:31:20 +02:00
+								              The SEC is advancing an aggressive and disastrous new standard that would make almost all blockchain tokens securities.
-												copy changes and ugly elements

											
										
										
											2021-03-28 22:48:58 +02:00
+								<br/><br/>
-												julian copy suggestion
											
										
										
											2021-03-29 00:31:20 +02:00
+								              Classifying all blockchain tokens as securities will be a bureaucratic nightmare for all United States residents and businesses operating in the United States.
-												add images

											
										
										
											2021-03-28 18:59:34 +02:00
+								            </p>
 								            <div className="content__img">
 								              <Image
 								                src="/machine.png"
 								                alt="Image of LBRY cartoon"
 								                layout="fill"
 								                //   height={100}
 								                //   width={100}
 								              />
 								            </div>
 								          </div>
 								          <div className="content__section">
 								            <div className="content__img">
 								              <Image
 								                className="content__img"
 								                src="/megaphone.png"
 								                alt="Image of LBRY cartoon"
 								                layout="fill"
 								                //   height={100}
 								                //   width={100}
 								              />
 								            </div>
 								            <p>
-												julian copy suggestion
											
										
										
											2021-03-29 00:31:20 +02:00
+								              Under this new standard, almost any token is a security, including the previously safe ETH. The SEC additionally claim that token sales are sales of securities too!
-												copy changes and ugly elements

											
										
										
											2021-03-28 22:48:58 +02:00
+								              <br/><br/>
-												julian copy suggestion
											
										
										
											2021-03-29 00:31:20 +02:00
+								              This change will make it much harder for startups to form new blockchain companies, cause massive job loss, and stunt the development of a critical new technology. All the while, big tech and Wall St. prosper!
-												add images

											
										
										
											2021-03-28 18:59:34 +02:00
+								            </p>
-												first commit

											
										
										
											2021-03-27 18:41:37 +01:00
+								          </div>
-												updates

											
										
										
											2021-03-27 20:52:23 +01:00
-												copy changes and ugly elements

											
										
										
											2021-03-28 22:48:58 +02:00
+								          <h2>Share this story</h2>
 								          <div className="content__subtitle">
 								            Post to social media to spread awareness.
 								            &nbsp;
 								            <a
 								              href="https://twitter.com/intent/tweet?text=LBRY%20and%20cryptocurrencies%20are%20useful%20technologies%20that%20must%20remain%20legal%20and%20free%20%23HelpLBRYSaveCrypto%0A%0Awww.helplbrysavecrypto.com"
 								              className="link"
 								              rel="noreferrer noopener"
 								              target="_blannk"
 								            >
 								              #HelpLBRYSaveCrypto
 								            </a>
 								          </div>
 								        </div>
 								        <div className="content">
 								          <h2>What are people saying?</h2>
 								          <Twitter />
 								        </div>
 								        <div className="content">
 								          <h2>Sign the petition</h2>
 								          <div className="content__subtitle">
 								            Tell Gary Gensler and the SEC that cryptocurrency must remain legal and free.{' '}
 								            <a className="link" href="https://www.change.org/p/28064277">Add your signature</a>.
 								          </div>
 								        </div>
-												updates

											
										
										
											2021-03-27 20:52:23 +01:00
-												copy changes and ugly elements

											
										
										
											2021-03-28 22:48:58 +02:00
 								        <div className="email">
 								          <h2>Stay up to date</h2>
 								          <div className="email__subtitle">
 								            We will keep you up to date with any information we receive about
 								            this case.
 								          </div>
 								          <label htmlFor="email">Email</label>
 								          <form className="email__group" onSubmit={handleEmailSubmit}>
 								            <input
-												updates

											
										
										
											2021-03-27 20:52:23 +01:00
+								                type="email"
 								                name="email"
 								                placeholder="ihatecensorship@protonmail.com"
-												email working

											
										
										
											2021-03-28 00:33:47 +01:00
+								                value={email}
 								                onChange={(e) => setEmail(e.target.value)}
-												copy changes and ugly elements

											
										
										
											2021-03-28 22:48:58 +02:00
+								            />
 								            <button disabled={!email || emailLoading}>
 								              {emailLoading ? 'Submitting' : 'Submit'}
 								            </button>
 								          </form>
-												email working

											
										
										
											2021-03-28 00:33:47 +01:00
-												copy changes and ugly elements

											
										
										
											2021-03-28 22:48:58 +02:00
+								          {emailSuccess && (
-												email working

											
										
										
											2021-03-28 00:33:47 +01:00
+								              <div className="email__success">
 								                Thank you! We will keep you in the loop.
 								              </div>
-												copy changes and ugly elements

											
										
										
											2021-03-28 22:48:58 +02:00
+								          )}
 								          {emailError && (
-												email working

											
										
										
											2021-03-28 00:33:47 +01:00
+								              <div className="email__success">
 								                Sorry, there was an error. Please try again.
 								              </div>
-												copy changes and ugly elements

											
										
										
											2021-03-28 22:48:58 +02:00
+								          )}
-												added tweetst

											
										
										
											2021-03-28 06:57:49 +02:00
+								        </div>
 								        <div className="content">
-												copy changes and ugly elements

											
										
										
											2021-03-28 22:48:58 +02:00
+								          <h2>Try LBRY</h2>
-												updates

											
										
										
											2021-03-27 20:52:23 +01:00
+								          <div className="content__subtitle">
-												copy changes and ugly elements

											
										
										
											2021-03-28 22:48:58 +02:00
+								            If the government and big tech want it gone, it must be good.
 								          </div>
 								          <div>
 								            <a href="https://lbry.com/get" className="link">LBRY Desktop</a> (decentralized and open-source)
 								            <a href="https://odysee.com" className="link">Odysee</a> (easiest to use)
-												updates

											
										
										
											2021-03-27 20:52:23 +01:00
+								          </div>
-												Initial commit from Create Next App

											
										
										
											2021-03-27 17:25:50 +01:00
+								        </div>
-												copy changes and ugly elements

											
										
										
											2021-03-28 22:48:58 +02:00
-												Initial commit from Create Next App

											
										
										
											2021-03-27 17:25:50 +01:00
+								      </main>
 								    </div>
-												first commit

											
										
										
											2021-03-27 18:41:37 +01:00
+								  );
-												Initial commit from Create Next App

											
										
										
											2021-03-27 17:25:50 +01:00
+								}