Transaction: 14rMdZB...Nh6i

{ "data": { "events_v1.near": { "widget": { "events__show": { "": "const EVENTS_CONTRACT = 'events_v1.near';\n\nconst eventId = props.event_id;\nif (!eventId) {\n return 'props.eventId is required';\n}\n\nconst event = Near.view(EVENTS_CONTRACT, 'get_event', {\n event_id: props.event_id,\n});\nif (!event) {\n return 'Loading';\n}\n\nprops.controller.setLayout('container', {\n back: true,\n title: event.name,\n});\n\nconst startDate = new Date(event.start_date);\nconst endDate = new Date(event.end_date);\n\nconsole.log('event', { event });\n\nreturn (\n <>\n <div\n style={{\n position: 'relative',\n backgroundColor: 'black',\n }}\n >\n {props.__engine.renderComponent('components.event_image_slider', {\n event,\n mode: 'banner',\n })}\n\n <div\n style={{\n position: 'absolute',\n left: '0',\n bottom: '0',\n transform: 'translate(0, -25%)',\n padding: '8px',\n width: '20vw',\n height: '20vw',\n minWidth: '100px',\n minHeight: '100px',\n background: 'white',\n borderRadius: 14,\n border: '2px solid white',\n }}\n >\n <div\n style={{\n width: '100%',\n height: '100%',\n overflow: 'hidden',\n borderRadius: 12,\n }}\n >\n {props.__engine.renderComponent('components.event_image_slider', {\n event,\n mode: 'tile',\n })}\n </div>\n </div>\n </div>\n <div\n style={{\n padding: '40px 20px',\n }}\n >\n {/* title */}\n <h1>{event.name}</h1>\n\n {/* info bar with condensed info */}\n <div\n style={{\n display: 'flex',\n alignItems: 'center',\n padding: '4px 0',\n borderBottom: '1px solid #ccc',\n }}\n >\n <p style={{}}>{event.location}</p>\n\n <p\n style={{\n marginLeft: '10px',\n }}\n >\n {startDate.getDate()}{' '}\n {startDate.toLocaleString('default', { month: 'short' })}{' '}\n {startDate.getFullYear()} - {endDate.getDate()}{' '}\n {endDate.toLocaleString('default', { month: 'short' })}{' '}\n {endDate.getFullYear()}\n </p>\n </div>\n\n {/* second bar with links */}\n <div\n style={{\n display: 'flex',\n justifyContent: 'middle',\n alignItems: 'center',\n padding: '4px 0',\n borderBottom: '1px solid #ccc',\n marginBottom: '20px',\n }}\n >\n {props.__engine.accountId === event.account_id ? (\n <span\n style={{\n color: '#000',\n textDecoration: 'none',\n fontSize: '14px',\n fontWeight: 'bold',\n padding: '10px 0',\n }}\n role=\"button\"\n tabIndex={0}\n onClick={() => {\n props.__engine.push('edit', { event_id: props.event_id });\n }}\n onKeyDown={() => {\n if (event.key === 'Enter') {\n props.__engine.push('edit', { event_id: props.event_id });\n }\n }}\n >\n Edit\n </span>\n ) : null}\n\n {event.links.map((link, idx) => {\n console.log('link', link);\n return (\n <a\n href={link.url}\n key={idx}\n target=\"_blank\"\n rel=\"noopener noreferrer\"\n style={{\n color: '#000',\n textDecoration: 'none',\n fontSize: '14px',\n fontWeight: 'bold',\n padding: '10px 0',\n marginLeft: '10px',\n }}\n >\n {/* TODO: for each link type find and display icon */}\n {link.text}\n </a>\n );\n })}\n </div>\n\n <p>{event.description}</p>\n <p>{event.type}</p>\n <p>{event.category}</p>\n <p>{event.status}</p>\n </div>\n </>\n);\n" } } } } }