Transaction: 4a6eAuv...JRdf

{ "data": { "dropcast.near": { "widget": { "register": { "": "const accountId = context.accountId;\nconst Owner = \"dropcast.near\";\nconst API_URL = props.API_URL || \"http://localhost:3000\";\nconst TOKEN = props.TOKEN || \"\";\nconst changePage = props.changePage || ((page) => {});\n\n//Styles\nconst Wrapper = styled.div`\n display: flex;\n width: 100%;\n padding: 64px;\n position: relative;\n flex-direction: column;\n color: rgb(229 229 229);\n background: rgb(23,23,23);\n @media (max-width: 510px) {\n padding: 25px;\n } \n`;\n\nconst Card = styled.div`\n gap: 24px;\n display: flex;\n width: 100%;\n padding: 48px;\n border-radius: 8px;\n position: relative;\n flex-direction: column;\n background: rgb(38, 38, 38);\n @media (max-width: 510px) {\n padding: 15px;\n height: 100%;\n .menu {\n width: 74vw;\n }\n } \n`;\n\nconst Label = styled.label`\n font-size: 14px;\n margin-bottom: 4px;\n`;\n\nconst StepButton = styled.button`\n color: #FFF;\n padding: 12px;\n border-radius: 6px;\n background-image: linear-gradient(to right, rgb(147, 51, 234), rgb(99, 102, 241));\n`;\n\nState.init({\n error: \"\",\n selected: \"0\",\n next: false,\n loaded: false,\n projects: [{ text: \"Loading\", value: \"0\" }],\n description: \"\",\n mint_price: \"\",\n mint_date: \"\",\n supply: \"\",\n discord: \"\",\n twitter: \"\",\n});\n\nconst getProjects = () => {\n State.update({\n loaded: true,\n });\n let promise = asyncFetch(`${API_URL}/api/project/chanel`, {\n headers: {\n \"Content-Type\": \"application/x-www-form-urlencoded\",\n \"x-auth-token\": TOKEN,\n },\n method: \"GET\",\n });\n\n promise.then((data) => {\n if (data.status === 200) {\n State.update({\n projects: data.body,\n });\n } else {\n State.update({\n loaded: true,\n });\n }\n });\n};\n\nconst changeOption = (value) => {\n State.update({\n ...state,\n selected: value,\n });\n};\n\nconst handleNextStep = () => {\n State.update({\n ...state,\n next: true,\n });\n};\n\nconst onClose = () => {\n State.update({\n ...state,\n next: false,\n });\n};\n\nconst changeInput = (value, key) => {\n State.update({\n ...state,\n [key]: value,\n });\n};\n\nif (!state.loaded) getProjects();\n\nreturn (\n <div className=\"w-100 position-relative\" style={{ height: \"fit-content\" }}>\n <Wrapper>\n <Card>\n <div>\n <h5 className=\"m-0\" style={{ fontSize: 18 }}>\n Register Project\n </h5>\n <p\n className=\"m-0 mt-1\"\n style={{ fontSize: 14, color: \"rgb(115, 115, 115)\" }}\n >\n This information will be displayed publicly.\n </p>\n </div>\n <div>\n <Label>\n Project <span className=\"text-danger\">*</span>\n </Label>\n <Widget\n props={{\n noLabel: true,\n width: \"40vw\",\n options: state.projects,\n value: state.selected,\n onChange: changeOption,\n }}\n src={`${Owner}/widget/Select`}\n />\n </div>\n <div className=\"d-flex flex-column\">\n <Label>\n Description <span className=\"text-danger\">*</span>\n </Label>\n <textarea\n rows=\"3\"\n name=\"description\"\n placeholder=\"Description\"\n value={state.description}\n className=\"w-full px-2 py-1 shadow-sm rounded-3\"\n onChange={(e) => changeInput(e.target.value, \"description\")}\n style={{ fontSize: 14 }}\n />\n <p\n className=\"m-0 mt-1\"\n style={{ fontSize: 14, color: \"rgb(115, 115, 115)\" }}\n >\n Write a few sentences about your project.\n </p>\n </div>\n <div className=\"d-flex flex-column\">\n <Label>Mint Price</Label>\n <input\n type=\"number\"\n min=\"0\"\n name=\"mint_price\"\n placeholder=\"Mint Price\"\n value={state.mint_price}\n className=\"w-full px-2 py-1 rounded-3 border-0\"\n onChange={(e) => changeInput(e.target.value, \"mint_price\")}\n style={{ fontSize: 14 }}\n />\n </div>\n <div className=\"d-flex flex-column\">\n <Label>Mint Date</Label>\n <input\n type=\"date\"\n name=\"mint_date\"\n placeholder=\"Mint Date\"\n value={state.mint_date}\n className=\"w-full px-2 py-1 rounded-3 border-0\"\n onChange={(e) => changeInput(e.target.value, \"mint_date\")}\n style={{ fontSize: 14 }}\n />\n </div>\n <div className=\"d-flex flex-column\">\n <Label>Supply</Label>\n <input\n name=\"supply\"\n value={state.supply}\n className=\"w-full px-2 py-1 rounded-3 border-0\"\n onChange={(e) => changeInput(e.target.value, \"supply\")}\n style={{ fontSize: 14 }}\n />\n </div>\n <div className=\"d-flex flex-column\">\n <Label>Discord</Label>\n <input\n name=\"discord\"\n value={state.discord}\n placeholder=\"Discord invite Link\"\n className=\"w-full px-2 py-1 rounded-3 border-0\"\n onChange={(e) => changeInput(e.target.value, \"discord\")}\n style={{ fontSize: 14 }}\n />\n </div>\n <div className=\"d-flex flex-column\">\n <Label>Twitter</Label>\n <input\n name=\"twitter\"\n placeholder=\"Twitter\"\n value={state.twitter}\n className=\"w-full px-2 py-1 rounded-3 border-0\"\n onChange={(e) => changeInput(e.target.value, \"twitter\")}\n style={{ fontSize: 14 }}\n />\n </div>\n <StepButton\n className=\"btn\"\n disabled={\n // state.selected === \"0\" ||\n !state.description\n }\n onClick={handleNextStep}\n >\n Next Step\n </StepButton>\n </Card>\n </Wrapper>\n {state.next && (\n <Widget\n props={{\n API_URL,\n TOKEN,\n onClose,\n changePage,\n data: {\n guild_id: state.selected,\n name: state.projects.find((e) => e.value === state.selected)?.text,\n icon: state.projects.find((e) => e.value === state.selected)?.icon,\n description: state.description,\n mint_price: state.mint_price,\n mint_date: state.mint_date,\n supply: state.supply,\n discord: state.discord,\n twitter: state.twitter,\n },\n }}\n src={`${Owner}/widget/import_bot`}\n />\n )}\n </div>\n);\n", "metadata": { "fork_of": "dropcast.near/widget/register@113172373" } } } } } }