mirror of
https://github.com/filecoin-project/slate.git
synced 2024-12-28 11:32:46 +03:00
0a4ce7cca9
Signed-off-by: Andrew Hill <andrew@textile.io>
196 lines
5.4 KiB
JavaScript
196 lines
5.4 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 CodeBlock from "~/components/system/CodeBlock";
|
|
|
|
const EXAMPLE_CODE = `import * as React from "react";
|
|
import { FriendsList } from "slate-react-system";
|
|
|
|
const friendsList = {
|
|
requests: [
|
|
{
|
|
id: 72572959238,
|
|
user: "@martina",
|
|
img:
|
|
"https://slate.textile.io/ipfs/bafybeiguo2uhd63reslbqkkgsqedgeikhtuwn5lzqpnqzluoaa3rnkfcvi",
|
|
},
|
|
{
|
|
id: 2572952030,
|
|
user: "@jim",
|
|
img:
|
|
"https://slate.textile.io/ipfs/bafybeicuz5wrxonu7ud6eskrnshxb66ksg3ncu3ie776xuiydlxrkfuvmu",
|
|
},
|
|
],
|
|
friends: [
|
|
{
|
|
id: 64783925020,
|
|
user: "@haris",
|
|
img: null,
|
|
info: {
|
|
chainHead:
|
|
"t3solnyrrblqlmvi6gmzewzvu62vs7uqvkl22yemzr63bcylbaaqsg44mnipepuafg7efzzx4zwcsi66jgze3q",
|
|
height: 8273,
|
|
location: "United States",
|
|
upload: 40092,
|
|
download: 83900,
|
|
},
|
|
},
|
|
{
|
|
id: 637838385993,
|
|
user: "@aaron",
|
|
img:
|
|
"https://slate.textile.io/ipfs/bafkreicb2lookm56omsfjwuwuziwftizmdsj4oneveuqiqlu6k5hc7j5nq",
|
|
info: {
|
|
chainHead:
|
|
"bafyl5q5qo5wolfxsui4ciujfucqwf6gqso4lettcjwl2tyismgol7c4tngvoono5rmytuqotye7oosfjv6g7a",
|
|
height: 4728,
|
|
location: "United Kingdom",
|
|
upload: 28725802,
|
|
download: 2088774,
|
|
},
|
|
},
|
|
{
|
|
id: 982799203032,
|
|
user: "@colin",
|
|
img:
|
|
"https://slate.textile.io/ipfs/bafybeigxb4arecl6iwsvjnwzi2lqpmmif6l2kgwptac7q3tzqmsimci2yq",
|
|
info: {
|
|
chainHead:
|
|
"t3ual5q5qo5wolfxsui4ciujfucqwf6gqso4lettcjwl2tyismgol7c4tngvoono5rmytuqotye7oosfjv6g7a",
|
|
height: 9223,
|
|
location: "Netherlands",
|
|
upload: 7692,
|
|
download: 110,
|
|
},
|
|
},
|
|
{
|
|
id: 673883729083,
|
|
user: "@jason",
|
|
img:
|
|
"https://slate.textile.io/ipfs/bafybeicp3x3poprnrsxhnqscsiuobxejxsbcsu2t4yhte6qmcofjvjqbn4",
|
|
info: {
|
|
chainHead:
|
|
"t3solnyrrblqlmvi6gmzewzvu62vs7uqvkl22yemzr63bcylbaaqsg44mnipepuafg7efzzx4zwcsi66jgze3q",
|
|
height: 1938,
|
|
location: "Albania",
|
|
upload: 82802020,
|
|
download: 37792,
|
|
},
|
|
},
|
|
],
|
|
};
|
|
|
|
class Example extends React.Component {
|
|
render() {
|
|
return <FriendsList data={friendsList} />;
|
|
}
|
|
}
|
|
`;
|
|
|
|
export default class SystemPagePeersList extends React.Component {
|
|
render() {
|
|
const friendsList = {
|
|
requests: [
|
|
{
|
|
id: 72572959238,
|
|
user: "@martina",
|
|
img:
|
|
"https://slate.textile.io/ipfs/bafybeiguo2uhd63reslbqkkgsqedgeikhtuwn5lzqpnqzluoaa3rnkfcvi",
|
|
},
|
|
{
|
|
id: 2572952030,
|
|
user: "@jim",
|
|
img:
|
|
"https://slate.textile.io/ipfs/bafybeicuz5wrxonu7ud6eskrnshxb66ksg3ncu3ie776xuiydlxrkfuvmu",
|
|
},
|
|
],
|
|
friends: [
|
|
{
|
|
id: 64783925020,
|
|
user: "@haris",
|
|
img: null,
|
|
info: {
|
|
chainHead:
|
|
"t3solnyrrblqlmvi6gmzewzvu62vs7uqvkl22yemzr63bcylbaaqsg44mnipepuafg7efzzx4zwcsi66jgze3q",
|
|
height: 8273,
|
|
location: "United States",
|
|
upload: 40092,
|
|
download: 83900,
|
|
},
|
|
},
|
|
{
|
|
id: 637838385993,
|
|
user: "@aaron",
|
|
img:
|
|
"https://slate.textile.io/ipfs/bafkreicb2lookm56omsfjwuwuziwftizmdsj4oneveuqiqlu6k5hc7j5nq",
|
|
info: {
|
|
chainHead:
|
|
"bafyl5q5qo5wolfxsui4ciujfucqwf6gqso4lettcjwl2tyismgol7c4tngvoono5rmytuqotye7oosfjv6g7a",
|
|
height: 4728,
|
|
location: "United Kingdom",
|
|
upload: 28725802,
|
|
download: 2088774,
|
|
},
|
|
},
|
|
{
|
|
id: 982799203032,
|
|
user: "@colin",
|
|
img:
|
|
"https://slate.textile.io/ipfs/bafybeigxb4arecl6iwsvjnwzi2lqpmmif6l2kgwptac7q3tzqmsimci2yq",
|
|
info: {
|
|
chainHead:
|
|
"t3ual5q5qo5wolfxsui4ciujfucqwf6gqso4lettcjwl2tyismgol7c4tngvoono5rmytuqotye7oosfjv6g7a",
|
|
height: 9223,
|
|
location: "Netherlands",
|
|
upload: 7692,
|
|
download: 110,
|
|
},
|
|
},
|
|
{
|
|
id: 673883729083,
|
|
user: "@jason",
|
|
img:
|
|
"https://slate.textile.io/ipfs/bafybeicp3x3poprnrsxhnqscsiuobxejxsbcsu2t4yhte6qmcofjvjqbn4",
|
|
info: {
|
|
chainHead:
|
|
"t3solnyrrblqlmvi6gmzewzvu62vs7uqvkl22yemzr63bcylbaaqsg44mnipepuafg7efzzx4zwcsi66jgze3q",
|
|
height: 1938,
|
|
location: "Albania",
|
|
upload: 82802020,
|
|
download: 37792,
|
|
},
|
|
},
|
|
],
|
|
};
|
|
|
|
return (
|
|
<SystemPage
|
|
title="SDS: Friends List"
|
|
description="..."
|
|
url="https://slate.host/_/experiences/friends-list"
|
|
>
|
|
<System.H1>
|
|
Friends List <ViewSourceLink file="experiences/friends-list.js" />
|
|
</System.H1>
|
|
<br />
|
|
<br />
|
|
<System.P>
|
|
Here is an example of an experience for getting friends.
|
|
</System.P>
|
|
<br />
|
|
<br />
|
|
<System.FriendsList data={friendsList} />
|
|
<br />
|
|
<br />
|
|
<br />
|
|
<System.H2>Code</System.H2>
|
|
<hr />
|
|
<br />
|
|
<CodeBlock>{EXAMPLE_CODE}</CodeBlock>
|
|
</SystemPage>
|
|
);
|
|
}
|
|
}
|