signAndAlert()} signatureLoading={isLoading} />)\n } else {\n return (<>)\n }\n }\n\n\n\n return (\n <>\n \n {props.description}\n \n
\n {!loggedIn ? \n
\n
\n {requirementsLoading ?
\"Loading...\"
: <>}\n
\n
This feedback mission is now closed. Thank you for your interest.
\n
\n Screener required: To help us gather the most relevant insights, please complete this short screener before proceeding to the main feedback session.\n
\n \n
\n Screener not available at this time.\n
\n
props.navigate(lastRoute)} />\n \n
\n Unfortunately, you aren't the target audience for this feedback session. Thank you for your interest.\n
\n
props.navigate(lastRoute)} />\n\n \n
\n Thank you for completing the screener. Saving your responses...\n
\n
\n {props.screenerLoaded ?
\n )\n }\n}\n\n\n\nexport default PublicScreener","import React, { useState, useEffect, useCallback, useRef } from \"react\";\nimport { Link, useNavigate, useOutletContext, useParams } from \"react-router-dom\";\nimport { Survey, Model, StylesManager } from \"survey-react\";\nimport 'survey-react/defaultV2.min.css';\n\nimport { PrimaryButtonSmall } from \"../../../user_portal/preauth_portal/components/CommonComponents\";\nimport LoadingIcon from \"../../standard_components/LoadingIcon\";\n\n// API Calls\nimport SurveyAPI from \"../../api/api_calls/SurveyAPI\";\n\n\n\n\n\nfunction PublicSurvey(props) {\n const [survey, setSurvey] = useState(null);\n const [surveyComplete, setSurveyComplete] = useState(false);\n const [failedLoading, setFailedLoading] = useState(false);\n const [surveyLoaded, setSurveyLoaded] = useState(false);\n const [surveyFailed, setSurveyFailed] = useState(false);\n const [surveyId, setSurveyId] = useState(null);\n const stateRef = useRef();\n\n stateRef.current = surveyId;\n const STORAGE_ITEM_KEY = \"survey-\" + surveyId;\n\n\n\n let params = useParams()\n const missionId = params.missionId;\n StylesManager.applyTheme(\"defaultV2\");\n const navigate = useNavigate();\n\n\n\n // On complete, save the survey results\n const onSurveyComplete = useCallback(async (sender) => {\n\n setSurveyComplete(true);\n\n const response = await SurveyAPI.createSurveyResponse(\n missionId,\n stateRef.current, // This lets us send the screenerId to the API call (otherwise it's stale and null)\n sender.data, // This is the survey data\n navigate\n )\n navigate(response.next_path)\n\n\n }, []);\n\n // Save the survey data to local storage\n function saveSurveyData(survey) {\n const data = survey.data;\n data.pageNo = survey.currentPageNo;\n window.localStorage.setItem(STORAGE_ITEM_KEY, JSON.stringify(data));\n }\n\n // Restore the survey data from local storage\n function restoreSurveyData(survey) {\n const prevData = window.localStorage.getItem(STORAGE_ITEM_KEY) || null;\n if (prevData) {\n const data = JSON.parse(prevData);\n survey.data = data;\n if (data.pageNo) {\n survey.currentPageNo = data.pageNo;\n }\n }\n }\n\n // Load the survey\n useEffect(() => {\n // Grab information on this user\n async function GetSurvey() {\n const data = await SurveyAPI.getSurvey(missionId, \"survey\", navigate);\n\n if (data.success == false) {\n setFailedLoading(true);\n return;\n }\n // Once it loads, then run through and set all the survey stuff\n const surveyData = await data.survey;\n // Manually turn off autofocus for these.\n // Not working, but based on https://surveyjs.answerdesk.io/ticket/details/t8403/first-question-gets-focused-automatically\n // surveyData[\"focusFirstQuestionAutomatic\"] = false;\n const tempSurvey = new Model(surveyData);\n // Save survey results when users change a question value...\n tempSurvey.onValueChanged.add(saveSurveyData);\n // ... and switch to the next page\n tempSurvey.onCurrentPageChanged.add(saveSurveyData);\n // Save the survey results when the survey is complete\n tempSurvey.onComplete.add(onSurveyComplete);\n // Restore the survey data from local storage\n restoreSurveyData(tempSurvey);\n setSurvey(tempSurvey);\n setSurveyLoaded(true);\n setSurveyId(data.survey_id);\n }\n\n GetSurvey();\n }, []);\n\n\n return (\n <>\n \n Please complete the survey below.\n
\n \n
\n Survey not available at this time.\n
\n
props.navigate(lastRoute)} />\n \n
\n Unfortunately, you aren't the target audience for this feedback session. Thank you for your interest.\n
\n
props.navigate(lastRoute)} />\n\n \n
\n Thank you for completing the survey. Saving your responses...\n
\n
\n {props.surveyLoaded ?
\n )\n }\n}\n\n\n\nexport default PublicSurvey","import { apiConfig } from '../apiConfig';\nimport { addCommonHeaders, handleResponse, handleErrors } from '../apiUtils';\n\nexport default {\n createCashOut: async (missionId, walletAddress, blockchain, handleRedirect = null) => {\n const url = apiConfig.apiUrl + missionId + \"/cash_outs\";\n\n\n const body = JSON.stringify({\n cash_out: {\n eth_address: walletAddress,\n blockchain: blockchain\n }\n });\n\n try {\n const response = await fetch(url, {\n method: \"POST\",\n headers: addCommonHeaders(),\n body: body,\n credentials: 'include',\n })\n\n return await handleResponse(response, handleRedirect);\n\n } catch (error) {\n return handleErrors(error);\n }\n },\n\n getCashOuts: async (missionId, handleRedirect = null) => {\n const url = apiConfig.apiUrl + missionId + \"/cash_outs\";\n\n try {\n const response = await fetch(url, {\n method: \"GET\",\n headers: addCommonHeaders(),\n credentials: 'include',\n })\n\n return await handleResponse(response, handleRedirect);\n\n } catch (error) {\n return handleErrors(error);\n }\n },\n\n deleteCashOut: async (missionId, cashOutId, handleRedirect = null) => {\n const url = apiConfig.apiUrl + missionId + \"/cash_outs/\" + cashOutId;\n\n const body = JSON.stringify({\n cash_out: {\n id: cashOutId,\n }\n });\n\n try {\n const response = await fetch(url, {\n method: \"DELETE\",\n headers: addCommonHeaders(),\n body: body,\n credentials: 'include',\n })\n\n return await handleResponse(response, handleRedirect);\n\n } catch (error) {\n return handleErrors(error);\n }\n },\n\n}","import React, { useState, useEffect } from \"react\";\nimport { useNavigate, useParams } from \"react-router-dom\";\nimport { useAlert } from 'react-alert';\n\nimport { MissionDetailsHighlight, VertSpacer } from \"../../overview_components/CommonOverviewComponents\";\nimport { FormField, PrimaryButtonSmall } from \"../../../user_portal/preauth_portal/components/CommonComponents\";\nimport IsValidEVMAddress from \"../../../utility_components/IsValidAddress\";\n\n// API Calls\nimport CashOutAPI from \"../../api/api_calls/CashOutAPI\";\n\n\nfunction PublicCashOut(props) {\n const [blockchain, setBlockchain] = useState(\"Polygon\");\n const [walletAddress, setWalletAddress] = useState(\"\");\n const [confirmAddress, setConfirmAddress] = useState(\"\");\n\n let params = useParams()\n const missionId = params.missionId;\n const navigate = useNavigate();\n const alert = useAlert();\n\n\n\n\n\n\n // ----------------------------------------\n // ----------------------------------------\n // --------------- UseEffects ----------------\n // ----------------------------------------\n // ----------------------------------------\n\n\n\n // ----------------------------------------\n // ----------------------------------------\n // --------------- Helpers ----------------\n // ----------------------------------------\n // ----------------------------------------\n\n //Update state on input change\n function onChange(event) {\n switch (event.target.name) {\n case 'address':\n setWalletAddress(event.target.value)\n case 'confirmAddress':\n setConfirmAddress(event.target.value)\n }\n }\n\n function onSubmit(event) {\n event.preventDefault();\n\n // Make sure eth address matches confirmed eth address\n if (walletAddress != confirmAddress) {\n alert.show(\"Wallet addresses do not match\", { type: 'error' })\n return;\n }\n\n // Make sure eth address is valid\n if (IsValidEVMAddress(walletAddress) == false) {\n alert.show(\"Not a valid \" + blockchain + \" address\",\n { type: 'error' })\n return;\n }\n\n async function CashOutRequest() {\n const returnData = await CashOutAPI.createCashOut(missionId, walletAddress, blockchain, navigate)\n\n if (returnData.success) {\n props.setRefreshCashOuts(props.refreshCashOuts + 1)\n alert.show(\"Thank you for participating! Your reward will be sent within 48 hours\", { type: \"success\" })\n } else {\n alert.show(returnData.error.message, { type: 'error' })\n }\n }\n\n CashOutRequest();\n }\n\n\n\n return (\n <>\n \n
{/* This sets the width and margins */}\n
\n Give Feedback, Get Paid \n \n Enjoy giving feedback? Create a Despark account and you can get paid to help improve web3\n
\n\n \n \n
\n
Completed - Link \n )\n } else {\n return (\n cashOut.status\n )\n }\n }\n\n function CashOutRows() {\n const rows = props.cashOutList.map((cashOut) => {\n return (\n \n {cashOut.eth_address} \n {cashOut.blockchain} \n ${cashOut.usd_amount_formatted} \n \n {cashOut.status == \"requested\" ?\n ( onSubmit(cashOut.id)} text=\"Delete & Update\" />)\n :\n <>\n }\n \n \n )\n })\n\n return (\n \n {rows}\n \n )\n }\n\n function CashOutHeader() {\n return (\n \n \n Address \n Chain \n Amount \n Status \n Edit \n \n \n )\n\n }\n\n function CashOutTableHelper() {\n return (\n \n
\n
\n Cash outs are generally processed within 48 hours.\n
\n
Cash Out Status \n {props.cashOutLoaded ? \n {completionNotice}\n \n {time} \n )\n })\n }\n }\n\n // Get hte list of dates\n let dateList = appointmentList.days.map(day => {\n const date = day.date_text\n return (\n \n
\n
\n
\n
\n {props.timezone}\n
\n
\n
\n
\n
\n
\n Available Days:\n
\n
\n
\n \n {dateList}\n \n
\n
\n
\n
\n
\n Available Times:\n
\n
\n
\n \n \n
\n
\n
\n
\n
finalizeAppointment()} isDisabled={selectedTime == null || props.submitting} />\n \n
\n
\n Change\n \n )\n }\n\n return (\n <>\n \n \n
\n Selected Time:\n
\n
\n {props.selectedDate} @ {props.selectedTime}\n
\n
props.setSelectingEmail(false)} />\n \n \n
\n Where should we send the invite?\n \n
\n We will ONLY send you information about this session, including an invitation and information on the session and reward. We will NOT share your email.\n
\n
\n
\n
props.onSubmit(email, name)} disabled={props.submitting} />\n \n
\n Please select a slot to {props.rescheduleClicked ? \"re\" : \"\"}schedule your {props.timeEstimate}-minute feedback session. Video is {props.videoRequired ? \"\" : \"NOT \"}required.\n
\n {selectingEmail ?\n props.reschedule()}>\n Reschedule\n \n )\n }\n\n function CancelButton() {\n return (\n props.cancel()}>\n Cancel\n \n )\n }\n\n function joinMeeting() {\n window.open(props.meetingUrl, '_blank');\n }\n\n return (\n <>\n \n You've scheduled a time for your feedback session. After attending and completing the session, you'll be sent an email with details of your reward. Your email is “{props.email}” and pseudonym is \"{props.name}\".\n
\n \n \n
\n Selected Time:\n
\n
\n {props.selectedDate} @ {props.selectedTime}\n
\n
\n
\n
\n \n
joinMeeting()} isDisabled={!joinButtonActive} />\n \n
\n
props.cancelReschedule()} />\n \n
\n There are no currently available times. We're working to find new time slots for sessions. Please check back again soon.\n \n \n Unfortunately, you are not the target audience for this mission. Thanks for your interest in giving feedback.\n \n \n \n {checkPageLoading || missionLoading ? \n \n {hasScreener ? \n \n \n 0} />} />\n \n \n }\n \n \n \n )\n\n}\n\nfunction SectionTitle(props) {\n return (\n \n {props.title}\n
\n )\n}\n\nfunction FullPageContainer(props) {\n return (\n \n {props.children}\n
\n )\n}\n\nfunction MissionDetailsCard(props) {\n return (\n \n
\n
\n {props.children}\n
\n
\n
\n \n
\n
\n \n despark \n \n
\n
\n
\n
\n
\n \n
{props.label} \n
\n
props.onChange(event)} className=\"form-control style-black\" placeholder={props.placeholder} type={props.type} tooltip=\"true\" autoComplete={props.autoComplete} />\n
\n {props.label} \n
\n )\n }\n}\n\nfunction TextEntryQuestion(props) {\n return (\n \n {props.label} \n
\n )\n}\n\nfunction MultipleChoiceQuestion(props) {\n return (\n \n
{props.questionText} \n
\n {props.children}\n
\n
\n props.onChange(props.value)}\n />\n \n {props.label}\n \n
\n )\n}\n\nfunction CheckboxOption(props) {\n const classes = \"form-check-input custom-checkbox-color\"\n\n return (\n \n props.onChange(event.target.checked)}\n />\n \n {props.label}\n \n
\n )\n}\n\nfunction DropdownQuestion(props) {\n const placeholderSelection = props.placeholder && \n {props.questionText ? {props.questionText} : <>}\n props.onChange(event.target.value)} id={props.id} value={props.value} defaultValue={props.defaultValue} aria-label={props.ariaLabel}>\n {placeholderSelection}\n {props.children}\n \n
\n )\n}\n\nfunction DropdownOption(props) {\n return (\n {props.label} \n )\n}\n\n\n// A 100% width button with a purple gradient background, white text, and no border\nfunction PrimaryButton(props) {\n const marginClass = props.marginClass || \"\";\n const cssClass = \"btn btn-purple-gradient-color text-white w-100 \" + marginClass\n\n return (\n \n {props.text}
\n \n )\n}\n\n// A minimally sized button with a purple gradient background, white text, and no border\nfunction PrimaryButtonSmall(props) {\n const marginClass = props.marginClass || \"\";\n const cssClass = \"btn btn-small btn-purple-gradient-color min-width-content text-white \" + marginClass\n\n return (\n \n {props.text}
\n \n )\n}\n\n// A 100% width button with a gray gradient background, and gradient border white text, and no border\nfunction SecondaryButton(props) {\n const marginClass = props.marginClass || \"\";\n const cssClass = !props.isDisabled ? (\"secondary-border-outer w-100 \" + marginClass) : (\"secondary-border-outer disabled w-100 \" + marginClass)\n\n return (\n \n )\n\n}\n\n// A minimally sized button with a gray gradient background, and gradient border white text, and no border\nfunction SecondaryButtonSmall(props) {\n const marginClass = props.marginClass || \"\";\n const shrinkClass = !props.shrink ? \" flex-shrink-0\" : \"\"; // If not shrink, then add in flex-shrink-0\n const disabledClass = props.isDisabled ? \" disabled\" : \"\";\n const cssClass = \"secondary-border-outer border-small \" + marginClass + shrinkClass + disabledClass\n\n return (\n \n )\n}\n\nfunction TertiaryButton(props) {\n const marginClass = props.marginClass || \"\";\n const cssClass = \"btn btn-transparent-color text-mid-gray \" + marginClass\n\n return (\n \n {props.text}
\n \n )\n}\n\n// A minimally sized button with a transparent backgroudn and gray border and text\nfunction TertiaryButtonSmall(props) {\n const marginClass = props.marginClass || \"\";\n const cssClass = \"btn btn-small btn-transparent-color text-mid-gray \" + marginClass\n\n return (\n \n {props.text}
\n \n )\n}\n\nfunction OrSeparater() {\n return (\n \n
\n
\n
or
\n
\n
\n
\n
{/* This sets the width and margins */}\n {children}\n
\n
\n {children}\n
\n )\n\n}\n\nfunction LogInForm({ children, onSubmit }) {\n return (\n \n )\n}\n\nfunction LogInCardTitle({ title }) {\n return (\n {title} \n )\n}\n\nfunction ForgotPasswordLink() {\n\n return (\n \n
\n )\n}\n\nfunction SignUpTertiary({ preLinkText = \"Don't have an account? \", path = \"/signup\", linkText = \"Sign Up\" }) {\n return (\n \n
{preLinkText}
\n
\n
\n {/* Okay, then we map each error to a new line */}\n {errors.map((error, index) => {\n return
{error}
\n })}\n
\n
\n
\n {/* Okay, then we map each error to a new line */}\n {notices.map((notice, index) => {\n return
{notice}
\n })}\n
\n
\n )\n}\n\n\nexport {\n FormField, TextEntryQuestion, MultipleChoiceQuestion, RadioOption, CheckboxOption, DropdownQuestion, DropdownOption, PrimaryButton, PrimaryButtonSmall,\n SecondaryButton, SecondaryButtonSmall, TertiaryButton, TertiaryButtonSmall,\n OrSeparater, LogInCard, LogInCardTitle, ErrorMessage, NoticeMessage, TurnBackgroundBlackComponent, LogInContainer, LogInCardBody, LogInForm, ForgotPasswordLink, SignUpTertiary, PreAuthPageContainer\n}","import React from 'react'\n\nconst alertStyle = {\n backgroundColor: '#141414',\n color: '#FEFEFE',\n borderRadius: '10px',\n border: '1px solid #5A5A5A',\n display: 'flex',\n justifyContent: 'space-between',\n alignItems: 'center',\n boxShadow: '0 4px 4px 0 rgba(0,0,0,0.25)', /* offset-x | offset-y | blur-radius | spread-radius | color */\n // width: '300px',\n boxSizing: 'border-box',\n fontSize: '.9rem',\n position: 'relative'\n}\n\nconst contentWrapperStyle = {\n padding: '16px',\n display: 'flex',\n width: '100%',\n justifyContent: 'center',\n alignItems: 'center',\n flexDirection: 'row',\n columnGap: '16px'\n}\n\nconst iconPlaceholderStyle = {\n display: 'flex',\n justifyContent: 'center',\n}\n\nconst messageStyle = {\n flex: 3,\n textAlign: 'left',\n width: '100%'\n}\n\nconst closeButtonStyle = {\n // minWidth: '50px',\n height: '100%',\n // position: 'absolute',\n // borderRadius: '0 10px 10px 0',\n cursor: 'pointer',\n // top: 0,\n // right: 0,\n // backgroundColor: '#141414',\n display: 'flex',\n justifyContent: 'center',\n alignItems: 'center'\n}\n\nconst getIcon = type => {\n switch (type) {\n case 'error':\n return (\n \n \n \n )\n case 'info':\n return (\n \n \n \n ) \n case 'success':\n return (\n \n \n \n )\n }\n}\n\nconst CustomAlertTemplate = ({ message, options, style, close }) => (\n \n
\n
\n
\n {getIcon(options.type)}\n
\n
\n
\n {message}\n
\n
\n
\n
\n {children ? children : \n )\n};\n\nfunction PreAuthRoute({\n children\n}) {\n return (\n \n {children ? children : \n )\n\n};\n\n// Not used today. \nfunction UnconfirmedUserRoute({\n children\n}) {\n return (\n \n {children ? children : \n )\n};\n\nfunction ConfirmedNoProfileRoute({\n children\n}) {\n return (\n \n {children ? children : \n )\n};\n\n// Public route - auth doesn't actually matter. \n// Hypothetically, a user could be logged in and connected and go here. \n// That should be fine. \nfunction PublicRoute({\n children\n}) {\n return children ? children :