Skip to content
Permalink
Browse files

(feature) start blockstack integration: Hello World

  • Loading branch information
Zach Lysobey
Zach Lysobey committed Jun 21, 2019
1 parent 3d36b39 commit bc053bfcdbf9b4f80ecdcec0f99eb07b0771d22b
Showing with 120 additions and 15 deletions.
  1. +1 −0 cors/.firebaserc
  2. +8 −0 cors/_headers
  3. +1 −0 cors/_redirects
  4. +23 −0 cors/firebase.json
  5. +17 −14 src/App.tsx
  6. +19 −0 src/Landing.tsx
  7. +11 −0 src/SignedIn.tsx
  8. +23 −1 src/index.tsx
  9. +17 −0 src/setupProxy.js
@@ -0,0 +1 @@
{}
@@ -0,0 +1,8 @@
/index.html
Access-Control-Allow-Origin: *
Access-Control-Allow-Headers: "X-Requested-With, Content-Type, Origin, Authorization, Accept, Client-Security-Token, Accept-Encoding"
Access-Control-Allow-Methods: "POST, GET, OPTIONS, DELETE, PUT"
/manifest.json
Access-Control-Allow-Origin: *
Access-Control-Allow-Headers: "X-Requested-With, Content-Type, Origin, Authorization, Accept, Client-Security-Token, Accept-Encoding"
Access-Control-Allow-Methods: "POST, GET, OPTIONS, DELETE, PUT"
@@ -0,0 +1 @@
/* /index.html 200
@@ -0,0 +1,23 @@
{
"hosting": {
"public": "build",
"ignore": [
"firebase.json",
"**/.*",
"**/node_modules/**"
],
"rewrites": [
{
"source": "**",
"destination": "/index.html"
}
],
"headers": [ {
"source" : "manifest.json",
"headers" : [ {
"key" : "Access-Control-Allow-Origin",
"value" : "*"
} ]
} ]
}
}
@@ -1,23 +1,26 @@
import React from 'react';
import logo from './logo.svg';
import { UserSession } from 'blockstack';

import './App.css';

const App: React.FC = () => {
import { SignedIn } from './SignedIn';
import { Landing } from './Landing';

interface Props {
userSession: UserSession
}
const App: React.FC<Props> = ({
userSession
}) => {
return (
<div className="App">
<header className="App-header">
<img src={logo} className="App-logo" alt="logo" />
<p>
Edit <code>src/App.tsx</code> and save to reload.
</p>
<a
className="App-link"
href="https://reactjs.org"
target="_blank"
rel="noopener noreferrer"
>
Learn React
</a>
<p>Learning Blockstack!</p>
{
userSession.isUserSignedIn()
? <SignedIn name={'World'}/>
: <Landing userSession={userSession}/>
}
</header>
</div>
);
@@ -0,0 +1,19 @@
import React from 'react'

import { UserSession } from 'blockstack'

interface Props {
userSession: UserSession
}
export const Landing: React.FC<Props> = ({ userSession }) => {
const signIn = () => userSession.redirectToSignIn()
return <>
<p>Landing...</p>

<button
onClick={signIn}
>
Sign in
</button>
</>
}
@@ -0,0 +1,11 @@
import React from 'react'

interface AppProps {
name: string
}
export const SignedIn: React.FC<AppProps> = ({
name
}) => {
console.log({ name })
return <p>Signed In. Hello {name}!</p>
}
@@ -4,7 +4,29 @@ import './index.css';
import App from './App';
import * as serviceWorker from './serviceWorker';

ReactDOM.render(<App />, document.getElementById('root'));
import { UserSession, AppConfig } from 'blockstack';

const appConfig = new AppConfig(['store_write', 'publish_data'])
const userSession = new UserSession({ appConfig });

const isUserSignedIn = userSession.isUserSignedIn()
const isSignInPending = userSession.isSignInPending()

if (!isUserSignedIn && isSignInPending) {
userSession.handlePendingSignIn()
.then((userData) => {
if (!userData.username) {
throw new Error('This app requires a username.')
}
window.location.href = `/kingdom/${userData.username}`
})
}

const app = <App userSession={userSession} />;

const $root = document.getElementById('root');

ReactDOM.render(app, $root);

// If you want your app to work offline and load faster, you can change
// unregister() to register() below. Note this comes with some pitfalls.
@@ -0,0 +1,17 @@
// 'React-scripts start' sets up a development server that automatically
// registers files with this name. This proxy file sets up a CORS header
// for manifest.json, allowing sign in via Blockstack without using
// the webpack configuration file that create-react-app has configured
// and hidden.

module.exports = function(app) {
app.get('/manifest.json', (req, res, next) => {
res.set({
'Access-Control-Allow-Origin': '*',
'Access-Control-Allow-Headers': '*',
'Access-Control-Allow-Methods': 'GET',
'X-random': 'random'
});
next();
})
};

0 comments on commit bc053bf

Please sign in to comment.
You can’t perform that action at this time.