mirror of
https://github.com/filecoin-project/slate.git
synced 2024-11-23 22:12:19 +03:00
integrating api endpoint
This commit is contained in:
parent
738892d192
commit
7d7ed43c19
@ -2,7 +2,6 @@ import * as React from "react";
|
||||
import * as Constants from "~/common/constants";
|
||||
|
||||
import { css } from "@emotion/react";
|
||||
import { ButtonPrimary } from "~/components/system/components/Buttons";
|
||||
|
||||
import SlatePreviewBlock from "~/components/core/SlatePreviewBlock";
|
||||
|
||||
@ -29,17 +28,6 @@ const STYLES_LINK = css`
|
||||
text-decoration: none;
|
||||
`;
|
||||
|
||||
const BUTTON_STYLE = {
|
||||
backgroundColor: "transparent",
|
||||
color: Constants.system.brand,
|
||||
border: `1px solid ${Constants.system.border}`,
|
||||
boxShadow: "none",
|
||||
fontFamily: Constants.font.text,
|
||||
margin: "8px",
|
||||
padding: "8px 16px",
|
||||
minHeight: "30px",
|
||||
};
|
||||
|
||||
export default class Profile extends React.Component {
|
||||
render() {
|
||||
let data = this.props.creator ? this.props.creator : this.props.data;
|
||||
@ -49,19 +37,7 @@ export default class Profile extends React.Component {
|
||||
<img css={STYLES_PROFILE_IMAGE} src={data.data.photo} />
|
||||
<div css={STYLES_NAME}>{data.username}</div>
|
||||
{/* TODO: replace with real name when added */}
|
||||
{this.props.editing ? null : (
|
||||
<div>
|
||||
<ButtonPrimary style={BUTTON_STYLE} onClick={this._handleFollow}>
|
||||
{this.props.follow ? "Unfollow" : "Follow"}
|
||||
</ButtonPrimary>
|
||||
<ButtonPrimary style={BUTTON_STYLE} onClick={this._handleTrust}>
|
||||
{this.props.trust ? "Remove Peer" : "Add Peer"}
|
||||
</ButtonPrimary>
|
||||
<ButtonPrimary style={BUTTON_STYLE} onClick={this._handleSendMoney}>
|
||||
Send Money
|
||||
</ButtonPrimary>
|
||||
</div>
|
||||
)}
|
||||
{this.props.buttons}
|
||||
<br />
|
||||
{data.slates && data.slates.length ? (
|
||||
<div style={{ width: "100%" }}>
|
||||
|
@ -5,24 +5,106 @@ import * as Constants from "~/common/constants";
|
||||
import * as SVG from "~/components/system/svg";
|
||||
|
||||
import { css } from "@emotion/react";
|
||||
import { ButtonPrimary } from "~/components/system/components/Buttons";
|
||||
|
||||
import ScenePage from "~/components/core/ScenePage";
|
||||
import Profile from "~/components/core/Profile";
|
||||
import CircleButtonLight from "~/components/core/CircleButtonLight";
|
||||
|
||||
const BUTTON_STYLE = {
|
||||
backgroundColor: "transparent",
|
||||
color: Constants.system.brand,
|
||||
border: `1px solid ${Constants.system.border}`,
|
||||
boxShadow: "none",
|
||||
fontFamily: Constants.font.text,
|
||||
margin: "8px",
|
||||
padding: "8px 16px",
|
||||
minHeight: "30px",
|
||||
};
|
||||
|
||||
export default class SceneProfile extends React.Component {
|
||||
state = {
|
||||
loading: false,
|
||||
isTrusted: this.props.viewer.trusted
|
||||
.map((trusted) => trusted.target_user_id)
|
||||
.includes(this.props.data.data.ownerId),
|
||||
isFollowing: this.props.viewer.subscriptions
|
||||
.map((subscription) => subscription.target_user_id)
|
||||
.includes(this.props.data.data.ownerId),
|
||||
};
|
||||
|
||||
_handleUpdate = async (e) => {
|
||||
const response = await Actions.hydrateAuthenticatedUser();
|
||||
|
||||
if (!response || response.error) {
|
||||
alert("TODO: error fetching authenticated viewer");
|
||||
return null;
|
||||
}
|
||||
|
||||
let viewer = response.data;
|
||||
|
||||
this.setState({
|
||||
isTrusted: viewer.trusted
|
||||
.map((trusted) => trusted.target_user_id)
|
||||
.includes(this.props.data.data.ownerId),
|
||||
isFollowing: viewer.subscriptions
|
||||
.map((subscription) => subscription.target_user_id)
|
||||
.includes(this.props.data.data.ownerId),
|
||||
});
|
||||
};
|
||||
|
||||
_handleTrust = async () => {
|
||||
console.log(this.props.data.id);
|
||||
let response;
|
||||
if (this.state.isTrusted) {
|
||||
response = await Actions.deleteTrustRelationship({
|
||||
id: this.props.data.id,
|
||||
});
|
||||
} else {
|
||||
response = await Actions.createTrustRelationship({
|
||||
userId: this.props.data.id, //check if it's this.props.data.id or what
|
||||
});
|
||||
}
|
||||
await this._handleUpdate();
|
||||
};
|
||||
|
||||
_handleFollow = async () => {
|
||||
console.log(this.props.data.id);
|
||||
let response = await Actions.createSubscription({
|
||||
userId: this.props.data.id,
|
||||
});
|
||||
await this._handleUpdate();
|
||||
};
|
||||
|
||||
render() {
|
||||
let buttons = (
|
||||
<div>
|
||||
<ButtonPrimary style={BUTTON_STYLE} onClick={this._handleFollow}>
|
||||
{this.state.isFollowing ? "Unfollow" : "Follow"}
|
||||
</ButtonPrimary>
|
||||
<ButtonPrimary style={BUTTON_STYLE} onClick={this._handleTrust}>
|
||||
{this.state.isTrusted ? "Remove Peer" : "Add Peer"}
|
||||
</ButtonPrimary>
|
||||
{this.state.isTrusted ? (
|
||||
<ButtonPrimary style={BUTTON_STYLE} onClick={this._handleSendMoney}>
|
||||
Send Money
|
||||
</ButtonPrimary>
|
||||
) : null}
|
||||
</div>
|
||||
);
|
||||
//add additional state for pending request and to accept a pending request
|
||||
console.log(this.props);
|
||||
return (
|
||||
<ScenePage style={{ padding: `88px 24px 128px 24px` }}>
|
||||
<Profile
|
||||
onAction={this.props.onAction}
|
||||
creator={this.props.data}
|
||||
editing={this.props.viewer.username === this.props.data.username}
|
||||
sceneId={this.props.sceneId}
|
||||
buttons={
|
||||
this.props.viewer.username === this.props.data.username
|
||||
? null
|
||||
: buttons
|
||||
}
|
||||
/>
|
||||
</ScenePage>
|
||||
);
|
||||
|
Loading…
Reference in New Issue
Block a user