ryanpedersen42

//src/App.jsx

import React, { Component, Fragment } from 'react';
import { Switch, Route, withRouter } from 'react-router-dom';
 
import AuthPage from './pages/auth/auth-page';
import MainPage from './pages/main-page/main-page';
import './App.styles.scss';
 
// Box dependency

ryanpedersen42

// src/App.jsx
 
// ...imports removed for brevity
 
class App extends Component {
 constructor(props) {
   super(props);
   this.state = {
     box: null,
     ethAddress: '',

ryanpedersen42

// src/App.jsx
 
// ...imports removed for brevity
 
class App extends Component {
 constructor(props) {
    super(props);
    this.state = {
      box: null,
      ethAddress: '',

ryanpedersen42

//src/pages/auth/auth-page.jsx

import React from 'react';
 
import './auth-page.scss';
 
const AuthPage = ({ handleAuth }) => (
 <div className='auth-page'>
   <button className='custom-button' onClick={handleAuth}>
       Auth with 3box

ryanpedersen42

// src/pages/main-page/main-page.jsx
 
import React, { Fragment } from 'react';
 
import './main-page.styles.scss';
 
const MainPage = () => (
 <Fragment>
     <div className='main-page'>
     	<p>Made it!</p>

ryanpedersen42

// src/components/header/header.jsx
 
import React from 'react';
 
import './header.styles.scss';
 
const Header = () => (
 <div className='header'>
   <div className='logo'>
     S3cret Keep3r

ryanpedersen42

// src/App.jsx
 
// ...imports removed for brevity
 
class App extends Component {
 constructor(props) {
   super(props);
   this.state = {
     box: null,
     ethAddress: '',

ryanpedersen42

// src/pages/main-page/main-page.jsx
 
// ... other imports removed for brevity
 
import DropdownSelector from '../../components/dropdown-selector/dropdown-selector';
 
const MainPage = ({ ethAddress, spaceOptions, changeSelectedSpace, selectedSpace }) => (
 <Fragment>
     <Header />
     <div className='main-page'>

ryanpedersen42

// src/App.jsx
 
// ...imports removed for brevity
 
class App extends Component {
 constructor(props) {
    super(props);
    this.state = {
      box: null,
      ethAddress: '',

ryanpedersen42

// src/components/dropdown-selector/dropdown-selector.jsx

import React from 'react';

import './dropdown-selector.styles.scss';

const DropdownSelector = ({ spaceOptions, selectedSpace, changeSelectedSpace }) => (
  <div>
    <p className='instructions'>Pick your 3box Space</p>
    <select className='drop-down' defaultValue={selectedSpace} onChange={event => changeSelectedSpace(event)}>