Transaction: GGrXavw...1iep

{ "data": { "events_v1.near": { "widget": { "app__frame": { "": "const VERSION = '0.0.1';\n\nconst APP_OWNER = 'events_v1.near';\nconst APP_NAME = 'events_app';\nconst EVENTS_CONTRACT = 'events_v1.near';\nconst ENTRY_ROUTE = 'index';\n\nconst accountId = context.accountId;\nif (!accountId) {\n return 'Please connect your NEAR wallet to create an activity';\n}\n\nconst env = {\n APP_OWNER,\n APP_NAME,\n EVENTS_CONTRACT,\n};\n\n// TODO: get layers from URL\nState.init({\n env,\n layers: [\n {\n name: ENTRY_ROUTE,\n props: {},\n },\n ],\n});\n\nif (!state) {\n return 'Loading';\n}\n\nfunction slugFromName(name) {\n return name.split(/\\.|\\//gu).join('__');\n}\n\nconst Select = styled.select`\n background-color: #4caf50;\n border: none;\n color: white;\n padding: 15px 32px;\n text-align: center;\n text-decoration: none;\n display: inline-block;\n font-size: 16px;\n margin: 4px 2px;\n cursor: pointer;\n`;\n\nconst Button = styled.button`\n background-color: #4caf50;\n border: none;\n color: white;\n padding: 15px 32px;\n text-align: center;\n text-decoration: none;\n display: inline-block;\n font-size: 16px;\n transition: all 0.5s ease;\n\n &:hover {\n background-color: #3e8e41;\n }\n`;\n\nconst Components = {\n Select,\n Button,\n};\n\nconst currentRoute = state.layers[state.layers.length - 1];\n\nconst engine = {\n renderComponent,\n};\n\nfunction push(name, props) {\n State.update({\n layers: [\n ...state.layers,\n {\n name,\n props: props || {},\n },\n ],\n });\n}\n\n// pop from the stack, ensure we always have at least one layer\nfunction pop() {\n State.update({\n layers: state.layers.length > 1 ? state.layers.slice(0, -1) : state.layers,\n });\n}\n\nconst routing = {\n push,\n pop,\n currentRoute,\n};\n\n// TODO: layouting, render widgets in widgets for maximum awesomeness\nfunction renderComponent(name, props) {\n return (\n <Widget\n src={`${APP_OWNER}/widget/${APP_NAME}__${slugFromName(name)}`}\n props={{\n ...props,\n routing,\n engine,\n Components,\n accountId,\n env,\n VERSION,\n }}\n />\n );\n}\n\nreturn (\n <>\n {/* main widget */}\n {state.layers.map((layer, index) => {\n return (\n <div\n key={index}\n style={{\n width: '100%',\n height: '100%',\n position: 'fixed',\n backgroundColor: 'white',\n top: 72, // sit right below the navbar\n left: 0,\n right: 0,\n bottom: 0,\n padding: 0,\n zIndex: Math.pow(10, 1 + index) + 10000,\n }}\n >\n <div\n style={{\n position: 'absolute',\n top: 0,\n right: 0,\n left: 0,\n overflow: 'scroll',\n width: '100%',\n minHeight: '100%',\n }}\n >\n {renderComponent(layer.name, layer.props)}\n </div>\n </div>\n );\n })}\n </>\n);\n" } } } } }