slate/pages/experiences/generate-powergate-token.js

91 lines
2.3 KiB
JavaScript

import * as React from "react";
import * as System from "~/components/system";
import SystemPage from "~/components/system/SystemPage";
import ViewSourceLink from "~/components/system/ViewSourceLink";
// import { createPow } from "@textile/powergate-client";
const EXAMPLE_CODE = `import * as React from 'react';
import { CreateToken } from 'slate-react-system';
import { createPow } from "@textile/powergate-client";
class Example extends React.Component {
state = {
token: null
}
_handleCreateToken = () => {
// NOTE
// Requires PowerGate to be running locally.
const PowerGate = createPow({ host: 'http://0.0.0.0:6002' });
const FFS = await PowerGate.ffs.create();
const token = FFS.token ? FFS.token : null;
PowerGate.setToken(token);
}
render() {
return (
<CreateToken
token={this.state.token}
onClick={this._handleCreateToken} />
);
}
}
`;
export default class GeneratePowergateToken extends React.Component {
state = {
token: null,
};
_handleCreateToken = () => {
let token;
/* TODO(jim): Stub hosted Powergate.
const PowerGate = createPow({ host: 'http://0.0.0.0:6002' });
const FFS = await PowerGate.ffs.create();
token = FFS.token ? FFS.token : null;
*/
// NOTE(jim): Demo purposes.
token = "82324ce3-3fb4-4eea-ac75-f7797d96a403";
this.setState({ token });
};
render() {
return (
<SystemPage
title="SDS: Generate Powergate Token"
description="..."
url="https://fps.onrender.com/experiences/generate-powergate-token"
>
<System.H1>
Generate Powergate token{" "}
<ViewSourceLink file="experiences/generate-powergate-token.js" />
</System.H1>
<br />
<br />
<System.P>
Here is an example of an experience for generating a{" "}
<a target="_blank" href="https://github.com/textileio/powergate/">
powergate token
</a>{" "}
in the client.
</System.P>
<br />
<br />
<System.CreateToken
onClick={this._handleCreateToken}
token={this.state.token}
/>
<br />
<br />
<System.H2>Code</System.H2>
<br /> <br />
<System.CodeBlock>{EXAMPLE_CODE}</System.CodeBlock>
</SystemPage>
);
}
}