Failed to fetch

;\n\n function processData(data) {\n /*console.log(JSON.stringify(data,null,2))*/\n let processedData = [];\n const onCall = \"On Call\";\n const regular = \"Regular\";\n data.data.forEach(shift => {\n const email = shift.surfer.email;\n let startDate = new Date(shift.interval.start);\n let endDate = new Date(shift.interval.end);\n let minutes = (-startDate.getTime() + endDate.getTime()) / 60000;\n let callHrs;\n let callMinutes;\n let regHrs;\n let regMinutes;\n\n if (shift.shiftTemplate.name === onCall) {\n callHrs = minutes / 60;\n callMinutes = minutes;\n regHrs = 0;\n regMinutes = 0;\n } else if (shift.shiftTemplate.name === regular) {\n regHrs = minutes / 60;\n regMinutes = minutes;\n callHrs = 0;\n callMinutes = 0;\n } else {\n console.log(\"Unkown shift type!\");\n callHrs = 0;\n callMinutes = 0;\n regHrs = 0;\n regMinutes = 0;\n }\n\n for (let i = 0; i <= processedData.length - 1; i++) {\n if (email === processedData[i].email) {\n let surferData = processedData[i];\n\n surferData[\"regHrs\"] += regHrs;\n surferData[\"regMinutes\"] += regMinutes;\n surferData[\"callHrs\"] += callHrs;\n surferData[\"callMinutes\"] += callMinutes;\n\n processedData[i] = surferData;\n return;\n }\n }\n\n let surferData = {\n email,\n regHrs,\n regMinutes,\n regCost: 0,\n callHrs,\n callMinutes,\n callCost: 0,\n totalHrs: 0,\n totalCost: 0,\n };\n processedData.push(surferData);\n });\n\n // Finding cost and total hours\n for (let i = 0; i <= processedData.length - 1; i++) {\n let surferData = processedData[i];\n let callCostM = callCostH / 60;\n let regCostM = regCostH / 60;\n\n surferData.regCost = regCostM * surferData.regMinutes;\n surferData.callCost = callCostM * surferData.callMinutes;\n surferData.totalCost = surferData.regCost + surferData.callCost;\n surferData.totalHrs = surferData.callHrs + surferData.regHrs;\n\n processedData[i] = surferData;\n }\n return processedData;\n }\n\n const processedData = processData(data);\n\n return (\n

Employee hours and pay

(This is an API demo to showcase how the Teamsurfboard API can be used.)

\n The current rates are £{callCostH} per hour for an on call shift and £{regCostH}{\" \"}\n per hour for a regular shift. You may change this by going into the val.town source code. You can also change\n the timeframe, the default is from now till next week.\n

\n {processedData.map((surfer) => )}\n

\n );\n}\n\nconst Surfer = ({ surfer }) => {\n console.log(surfer);\n return (\n

Surfer email: {surfer.email}

On Call Hours: {surfer.callHrs} hours

On Call Pay: £{surfer.callCost}

Regular Hours: {surfer.regHrs} hours

Regular Pay: £{surfer.regCost}

Total Hours: {surfer.totalHrs} hours

Total Pay: £{surfer.totalCost}

\n );\n};\n\nconst App = ({ data }) => (\n \n \n \n \n \n \n);\n\n// if (typeof document !== \"undefined\") {\n// const { hydrateRoot } = await import(\"https://esm.sh/react-dom/client\");\n// const scheduleData = await getSchedule();\n// hydrateRoot(document, );\n// }\n\nexport default async function(req: Request): Promise {\n const scheduleData = await getSchedule();\n const { renderToReadableStream } = await import(\"https://esm.sh/react-dom/server\");\n const stream = await renderToReadableStream(, { bootstrapModules: [import.meta.url] });\n return new Response(stream, { headers: { \"content-type\": \"text/html\" } });\n}\n\n// Styles\nconst styles = {\n box: {\n backgroundColor: \"#fad35f\",\n borderRadius: \"8px\",\n padding: \"20px\",\n marginTop: \"20px\",\n marginBottom: \"20px\",\n boxShadow: \"0 4px 6px rgba(0, 0, 0, 0.1)\",\n transition: \"transform 0.2s ease-in-out\",\n \":hover\": {\n transform: \"translateY(-5px)\",\n },\n },\n hr: {\n height: \"8px\",\n backgroundColor: \"#562ad4\",\n borderColor: \"#562ad4\",\n borderRadius: \"10px\",\n },\n header: {\n height: \"4px\",\n backgroundColor: \"black\",\n borderColor: \"#black\",\n borderRadius: \"10px\",\n },\n container: {\n fontFamily: \"Arial, sans-serif\",\n maxWidth: \"1200px\",\n padding: \"20px\",\n backgroundColor: \"#e1e1fc\",\n marginRight: \"auto\",\n marginLeft: \"auto\",\n },\n \"left\": {\n textAlign: \"left\",\n width: \"50%\",\n display: \"inline-block\",\n marginTop: \"5px\",\n marginBottom: \"5px\",\n fontSize: \"20px\",\n },\n \"right\": {\n textAlign: \"right\",\n width: \"50%\",\n display: \"inline-block\",\n marginTop: \"10px\",\n marginBottom: \"10px\",\n fontSize: \"20px\",\n },\n img: {\n marginLeft: \"auto\",\n marginRight: \"auto\",\n display: \"block\",\n width: \"75px\",\n },\n textbox: {\n width: \"240\",\n display: \"inline-block\",\n marginLeft: \"40px\",\n marginRight: \"40px\",\n marginTop: \"25px\",\n marginBottom: \"25px\",\n },\n // button: {\n // background: \"#5E5DF0\",\n // borderRadius: \"999px\",\n // boxShadow: \"#5E5DF0 0 10px 20px -10px\",\n // boxSizing: \"border-box\",\n // color: \"#FFFFFF\",\n // cursor: \"pointer\",\n // fontFamily: \"Inter\",\n // fontSize: \"16px\",\n // fontWeight: \"700\",\n // lineHeight: \"24px\",\n // opacity: \"1\",\n // outline: \"0 solid transparent\",\n // padding: \"8px 18px\",\n // userSelect: \"none\",\n // touchAction: \"manipulation\",\n // width: \"fit-content\",\n // wordBreak: \"break-word\",\n // border: \"0\",\n // },\n info: {\n backgroundColor: \"#FFFFFF\",\n borderRadius: \"8px\",\n padding: \"20px\",\n marginTop: \"20px\",\n marginBottom: \"20px\",\n boxShadow: \"0 4px 6px rgba(0, 0, 0, 0.1)\",\n transition: \"transform 0.2s ease-in-out\",\n \":hover\": {\n transform: \"translateY(-5px)\",\n },\n },\n info_text: {\n marginTop: \"10px\",\n marginBottom: \"10px\",\n fontFamily: \"Arial, sans-serif\",\n fontStyle: \"italic\",\n },\n};","deleted","label","children",[],[155],"files",[153],"counts",{"_176":32,"_177":178,"_179":32,"_180":32},"pulls","branches",1,"forks","envVars","contents",[183],{"_102":154,"_95":155,"_156":115,"_157":-5,"_158":138,"_159":137,"_160":108,"_104":184,"_99":162,"_163":164,"_165":166,"_167":22,"_168":-5,"_98":185},["D",1721923092313],[155],"file","upstreamProject",{"_102":145,"_95":96,"_111":-5,"_112":-5,"_109":110,"_23":189},{"_93":190,"_130":191},"keenanzucker","https://img.clerk.com/eyJ0eXBlIjoicHJveHkiLCJzcmMiOiJodHRwczovL2ltYWdlcy5jbGVyay5kZXYvb2F1dGhfZ2l0aHViL2ltZ18yaW10Q0lSYlBkYUJocWR0SW5sbXJYd3RkR3cifQ","upstreamBranch",{"_102":141,"_104":194,"_195":196,"_95":43,"_139":145,"_99":197,"_140":198,"_142":32,"_199":200,"_106":-5,"_150":22,"_109":110,"_149":190,"_16":147,"_148":96},["D",1746220088808],"updatedAt",["D",1721918219360],22,"b974ab00-2794-11f0-9d52-569c3dd06744","lockfileKey","1746286054243-esm.town_v_keenanzucker_surfboardDemoSchedule2@22-main","emptyEnvVars","isNew","flags",[],"routes/_app.x.$handle.$name._index",{"_93":94,"_95":96,"_97":-7,"_99":-7,"_100":207,"_181":212,"_215":-7,"_216":217,"_220":-5,"_172":221,"_225":226},{"_102":103,"_95":96,"_104":208,"_106":-5,"_107":108,"_109":110,"_111":-5,"_112":-5,"_14":113,"_114":115,"_116":108,"_117":-5,"_118":32,"_16":119,"_120":121,"_122":121,"_123":124,"_125":124,"_126":124,"_127":121,"_128":121,"_23":209,"_132":210,"_135":211,"_150":22},["D",1746217023264],{"_93":94,"_130":131},{"_93":94,"_134":131},{"_99":137,"_95":43,"_102":138,"_139":103,"_140":141,"_142":32,"_143":110,"_144":145,"_146":147,"_148":96,"_149":94},[213],{"_102":154,"_95":155,"_156":115,"_157":-5,"_158":138,"_159":137,"_160":108,"_104":184,"_99":162,"_163":164,"_165":166,"_167":22,"_168":-5,"_98":214},[155],"readme","upstream",{"_102":141,"_104":218,"_195":219,"_95":43,"_139":145,"_99":197,"_140":198,"_142":32,"_199":200,"_106":-5,"_150":22,"_109":110,"_149":190,"_16":147,"_148":96},["D",1746220088808],["D",1721918219360],"pull",[222],{"_102":154,"_95":155,"_156":115,"_157":-5,"_158":138,"_159":137,"_160":108,"_104":161,"_99":162,"_163":164,"_165":166,"_167":22,"_168":-5,"_169":223,"_98":224},[],[155],"previews",[222],"actionData","errors"]

szymonator

surfboardDemoSchedule2