git.iko.soy/bridge
on c19b2a8 help sign in
bridge/src/views/Release/Active.js
101 lines 2.8 kB history raw
1import React, { useCallback } from 'react';
2import { Grid } from 'indigo-react';
3import cn from 'classnames';
4import * as ob from 'urbit-ob';
6import Sigil from 'components/Sigil';
8import { usePointCache } from 'store/pointCache';
9import { useWallet } from 'store/wallet';
11import * as need from 'lib/need';
12import usePermissionsForPoint from 'lib/usePermissionsForPoint';
13import { useSyncOwnedPoints } from 'lib/useSyncPoints';
14import { buildKeyType } from 'lib/point';
16function ActiveViewRow({ point, goPoint }) {
17 const { wallet } = useWallet();
18 const address = need.addressFromWallet(wallet);
19 useSyncOwnedPoints([point]);
20 const permissions = usePermissionsForPoint(address, point);
22 const keyType = buildKeyType(permissions);
23 const patp = ob.patp(point);
24 const sigilSize = 50;
26 const onClick = useCallback(() => goPoint(point), [point, goPoint]);
27 return (
28 <>
29 <Grid.Item className="flex-row align-center" cols={[1, 3]}>
30 {patp}{' '}
31 </Grid.Item>
32 <Grid.Item className="flex-row align-center" cols={[3, 6]}>
33 <div
34 style={{
35 display: 'inline-block',
36 height: `${sigilSize}px`,
37 width: `${sigilSize}px`,
38 }}>
39 <Sigil patp={patp} size={25} colors={['#FFFFFF', '#000000']} />
40 </div>
41 </Grid.Item>
42 <Grid.Item className="flex-row align-center" cols={[6, 10]}>
43 {keyType}
44 </Grid.Item>
45 <Grid.Item
46 onClick={onClick}
47 cols={[10, 13]}
48 className="flex-row-r align-center mr2">
49 ->
50 </Grid.Item>
51 <Grid.Divider />
52 </>
53 );
56export default function ActiveView({ className, goPoint }) {
57 // const points = [2560, 2561, 2562];
58 const { controlledPoints } = usePointCache();
59 console.log(controlledPoints);
60 const points = controlledPoints
61 .matchWith({
62 Nothing: () => [],
63 Just: ps =>
64 ps.value.matchWith({
65 Error: () => null,
66 Ok: ({ value }) => {
67 return [
68 ...value.ownedPoints,
69 ...value.votingPoints,
70 ...value.managingPoints,
71 ...value.spawningPoints,
72 ];
73 },
74 }),
75 })
76 .filter(Boolean)
77 .filter(p => 255 < p && p < 65536);
79 return (
80 <Grid full className={cn('f5', className)}>
81 <Grid.Item className="pv3 " cols={[1, 6]} third={1}>
82 Point
83 </Grid.Item>
84 <Grid.Item className="pv3 " cols={[6, 10]}>
85 Key Type
86 </Grid.Item>
87 <Grid.Divider />
88 {points.length === 0 && (
89 <Grid.Item full className="flex-center pv8 f5 gray4">
90 You have no active stars
91 </Grid.Item>
92 )}
93 {points.map(point => (
94 <ActiveViewRow
95 key={point}
96 goPoint={goPoint}
97 point={point}></ActiveViewRow>
98 ))}
99 </Grid>
100 );