on d760cbf help sign in
bridge/src/components/old/RenderedPoint.js
57 lines 1.5 kB history raw
1import React from 'react';
2import { Just } from 'folktale/maybe';
3import { Col } from './Base';
4import { Button } from './Base';
5import { pour } from 'sigil-js';
6import * as ob from 'urbit-ob';
8import { ROUTE_NAMES } from '../../lib/routeNames';
9import ReactSVGComponents from '../ReactSVGComponents';
11const RenderedPoint = props => {
12 const { setPointCursor, routeHandler, point } = props;
14 const name = ob.patp(point);
15 const sigil = pour({
16 patp: name,
17 renderer: ReactSVGComponents,
18 size: 128,
19 });
21 return (
22 <Col className={'col-md-3 mb-8'} key={`rendered-${point}`}>
23 <div
24 key={`rendered-sigil-${point}`}
25 className="clickable"
26 onClick={() => {
27 setPointCursor(Just(point));
28 routeHandler(ROUTE_NAMES.POINT);
29 }}>
30 {sigil}
31 </div>
32 <div
33 key={`rendered-name-${point}`}
34 className="clickable"
35 onClick={() => {
36 setPointCursor(Just(point));
37 routeHandler(ROUTE_NAMES.POINT);
38 }}>
39 <code>{name}</code>
40 </div>
41 <div key={`rendered-deets-${point}`}>
42 <Button
43 key={`rendered-deets-button-${point}`}
44 prop-type={'link'}
45 prop-size={'sm'}
46 onClick={() => {
47 setPointCursor(Just(point));
48 routeHandler(ROUTE_NAMES.POINT);
49 }}>
50 {'Details →'}
51 </Button>
52 </div>
53 </Col>
54 );
55};
57export default RenderedPoint;