[{"_1":2,"_220":-5,"_221":-5},"loaderData",{"_3":4,"_92":93,"_207":208,"_219":-5},"root",{"_5":6,"_33":34,"_59":60,"_90":91},"ctx",{"_7":8,"_18":19,"_20":-5,"_21":22,"_23":24,"_25":26,"_27":26,"_28":26,"_29":30,"_31":32},"auth",{"_9":-5,"_10":-5,"_11":-5,"_12":-5,"_13":-5,"_14":-5,"_15":-5,"_16":-5,"_17":-5},"sessionClaims","sessionId","userId","actor","orgId","orgRole","orgSlug","orgPermissions","factorVerificationAge","environmentVariableKeys",[],"user","preferences_keybindings","default","preferences_theme","light","preferences_fixers",false,"preferences_copilot","preferences_selection_ai","preferences_model","claude-3-5-haiku-20241022","notification_count",0,"ENV",{"_35":36,"_37":38,"_39":40,"_41":42,"_43":44,"_45":46,"_47":48,"_49":50,"_51":52,"_53":54,"_55":56,"_57":58},"REACT_APP_SENTRY_DSN","https://586020d86f05489db63a554690acf1e9@o1398359.ingest.sentry.io/6724499","VAL_RUNTIME_NAME","prod","RENDER_GIT_COMMIT","8bf3c40423bcb56a277b20de05416cc021b3b09a","RENDER_GIT_BRANCH","main","CLERK_PUBLISHABLE_KEY","pk_live_Y2xlcmsudmFsLnRvd24k","POSTHOG_API_TOKEN","phc_nmoyuAkStEZuUp69rYlg1DZgrIt19Gx0Y4Hwf8tGgJP","POSTHOG_API_HOST","https://wart.val.town","WEB_API_TEMPLATE","https://{val}.web.val.run","APP_URL","https://www.val.town","MODULE_URL","https://esm.town","API_URL","https://api.val.town","WORKER_FINGERPRINT","d0746fd0512e0614e3f717607f0da4cd","clerkState",{"_61":62},"__internal_clerk_state",{"_63":64,"_65":44,"_66":67,"_68":67,"_69":26,"_70":67,"_71":67,"_72":67,"_73":67,"_74":67,"_75":67,"_76":67,"_77":67,"_78":79,"_88":26,"_89":26},"__clerk_ssr_state",{"_9":-5,"_10":-5,"_11":-5,"_12":-5,"_13":-5,"_14":-5,"_15":-5,"_16":-5,"_17":-5},"__publishableKey","__proxyUrl","","__domain","__isSatellite","__signInUrl","__signUpUrl","__afterSignInUrl","__afterSignUpUrl","__signInForceRedirectUrl","__signUpForceRedirectUrl","__signInFallbackRedirectUrl","__signUpFallbackRedirectUrl","__clerk_debug",{"_80":26,"_81":67,"_82":83,"_84":67,"_85":44,"_86":26,"_87":67},"isSignedIn","proxyUrl","reason","session-token-and-uat-missing","message","publishableKey","isSatellite","domain","__telemetryDisabled","__telemetryDebug","remixVersion",2,"routes/_app.v.$handle.$name",{"_94":95,"_96":97,"_95":98,"_202":-5,"_203":-5,"_204":205,"_129":130,"_137":138,"_101":102,"_99":100,"_118":-7,"_51":52,"_206":26},"type","val","author","60860640-f86b-11ef-a85c-a957a2b0ef5a",{"_99":100,"_96":97,"_101":102,"_103":-5,"_104":-5,"_105":106,"_107":-5,"_108":109,"_110":111,"_112":26,"_113":111,"_114":115,"_116":117,"_118":119,"_120":26,"_121":32,"_122":32,"_123":32,"_124":32,"_125":32,"_126":32,"_127":-5,"_20":128,"_133":-5,"_134":-7,"_135":136,"_137":138,"_139":140},"name","apple","valNameId","5a0031f8-f9d6-11ef-9f24-569c3dd06744","parentFolderId","isOwned","privacy","public","readme","valType","http","currentVersion","60569742-f9d9-11ef-9b93-569c3dd06744","legacyPrivate","id","code","/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { createRoot } from \"https://esm.sh/react-dom@18.2.0/client\";\nimport React, { useState } from \"https://esm.sh/react@18.2.0\";\n\nfunction AppleSupportPage() {\n const [step, setStep] = useState<\"initial\" | \"product-select\" | \"issue-type\" | \"remote-support\">(\"initial\");\n const [selectedProduct, setSelectedProduct] = useState(\"\");\n const [issueType, setIssueType] = useState(\"\");\n const [remoteAccessCode, setRemoteAccessCode] = useState(\"\");\n\n const generateRemoteAccessCode = () => {\n return Math.floor(100000 + Math.random() * 900000).toString();\n };\n\n const startRemoteSupport = () => {\n const code = generateRemoteAccessCode();\n setRemoteAccessCode(code);\n setStep(\"remote-support\");\n };\n\n const renderInitialScreen = () => (\n

\n $\"Apple$ \n

Apple Support

\n setStep(\"product-select\")}\n className=\"hover-effect\"\n >\n Get Support\n \n

\n );\n\n const renderProductSelection = () => (\n

Select Your Product

\n {[\"iPhone\", \"Mac\", \"iPad\", \"Apple Watch\", \"AirPods\"].map(product => (\n {\n setSelectedProduct(product);\n setStep(\"issue-type\");\n }}\n >\n {product}\n \n ))}\n

\n );\n\n const renderIssueTypeSelection = () => (\n

What's Your Issue?

\n {[\"Technical Problem\", \"Billing\", \"Account\", \"Hardware\", \"Other\"].map(issue => (\n {\n setIssueType(issue);\n startRemoteSupport();\n }}\n >\n {issue}\n \n ))}\n

\n );\n\n const renderRemoteSupportScreen = () => (\n

Remote Support

Your Remote Access Code:

{remoteAccessCode}

Share this 6-digit code with your support agent

\n 🚨 Never share this code with anyone you don't trust\n

\n {\n window.open('https://assist.zoho.com/app/deploy/unattended?encapiKey=wSsVRa12qRfzWqgpnjT%2BI79skVgGBg%2BnQEx40Fr1uXD%2FSPCWpcc4lRXOVFXyTfAbFmM4FjAQ8bMpykgJ0WZc3NktmwsEDiiF9mqRe1U4J3x1p7ztnjPIWm1dkxOILIsAzwxrmg%3D%3D&x-com-zoho-assist-orgid=869344384', '_blank');\n }}\n >\n Connect to Agent\n \n

\n );\n\n return (\n

\n {step === \"initial\" && renderInitialScreen()}\n {step === \"product-select\" && renderProductSelection()}\n {step === \"issue-type\" && renderIssueTypeSelection()}\n {step === \"remote-support\" && renderRemoteSupportScreen()}\n

\n );\n}\n\nconst styles = {\n pageContainer: {\n fontFamily: \"-apple-system, BlinkMacSystemFont, 'San Francisco', 'Helvetica Neue', Helvetica, Arial, sans-serif\",\n backgroundColor: \"#f5f5f7\",\n minHeight: \"100vh\",\n display: \"flex\",\n justifyContent: \"center\",\n alignItems: \"center\",\n transition: \"background-color 0.3s ease\",\n },\n container: {\n backgroundColor: \"white\",\n borderRadius: \"20px\",\n boxShadow: \"0 10px 20px rgba(0,0,0,0.1)\",\n padding: \"40px\",\n textAlign: \"center\",\n maxWidth: \"600px\",\n width: \"100%\",\n transform: \"scale(0.95)\",\n opacity: 0,\n animation: \"fadeInScale 0.5s forwards\",\n },\n header: {\n marginBottom: \"30px\",\n display: \"flex\",\n flexDirection: \"column\",\n alignItems: \"center\",\n },\n logo: {\n width: \"100px\",\n height: \"100px\",\n objectFit: \"contain\",\n marginBottom: \"20px\",\n transition: \"transform 0.3s ease\",\n },\n title: {\n color: \"#000\",\n fontSize: \"24px\",\n fontWeight: 600,\n },\n sectionTitle: {\n color: \"#000\",\n marginBottom: \"20px\",\n fontWeight: 600,\n },\n buttonGroup: {\n display: \"flex\",\n justifyContent: \"center\",\n gap: \"20px\",\n },\n primaryButton: {\n backgroundColor: \"#0071E3\",\n color: \"white\",\n border: \"none\",\n padding: \"12px 24px\",\n borderRadius: \"20px\",\n cursor: \"pointer\",\n fontSize: \"16px\",\n transition: \"background-color 0.3s, transform 0.2s\",\n },\n gridContainer: {\n display: \"grid\",\n gridTemplateColumns: \"repeat(3, 1fr)\",\n gap: \"20px\",\n },\n productButton: {\n backgroundColor: \"#f5f5f7\",\n border: \"1px solid #d2d2d7\",\n padding: \"20px\",\n borderRadius: \"12px\",\n cursor: \"pointer\",\n fontSize: \"16px\",\n transition: \"background-color 0.3s, transform 0.2s\",\n },\n remoteSupportBox: {\n backgroundColor: \"#f5f5f7\",\n padding: \"30px\",\n borderRadius: \"12px\",\n },\n accessCode: {\n fontSize: \"36px\",\n color: \"#0071E3\",\n letterSpacing: \"10px\",\n margin: \"20px 0\",\n },\n warningBox: {\n backgroundColor: \"#FFF4CE\",\n padding: \"15px\",\n borderRadius: \"8px\",\n margin: \"20px 0\",\n color: \"#664D00\",\n },\n};\n\nfunction App() {\n return ;\n}\n\nfunction client() {\n createRoot(document.getElementById(\"root\")).render();\n}\nif (typeof document !== \"undefined\") { client(); }\n\nexport default async function server(request: Request): Promise {\n return new Response(\n `\n \n \n Apple Support\n \n \n \n \n \n

\n \n \n \n \n `,\n {\n headers: { \"Content-Type\": \"text/html\" },\n },\n );\n}","createdAt",["D",1741189749105],"version",15,"currentUserHasLiked","likeCount","forkCount","referenceCount","dependencyCount","commentCount","prCount","mergedPr",{"_129":130,"_131":132},"handle","secure283","profileImageUrl","https://img.clerk.com/eyJ0eXBlIjoiZGVmYXVsdCIsImlpZCI6Imluc18yTm10cGhQUklwU0tqZHNiOHNnNGd2ZjJURFUiLCJyaWQiOiJ1c2VyXzJ0b3k0cUlVeTBlRm5DazZnVVF0NFV2Mnk5RSJ9","forkedVal","interval","slug","secure283/apple","description","@jsxImportSource https://esm.sh/react@18.2.0","versions",[141,144,148,152,156,160,164,168,172,176,180,184,188,192,195,199],{"_118":119,"_142":-5,"_116":143,"_113":111},"prId",["D",1741189749105],{"_118":145,"_142":-5,"_116":146,"_113":147},14,["D",1741189616692],"11698450-f9d9-11ef-9d92-569c3dd06744",{"_118":149,"_142":-5,"_116":150,"_113":151},13,["D",1741189425307],"9f579b2c-f9d8-11ef-a328-569c3dd06744",{"_118":153,"_142":-5,"_116":154,"_113":155},12,["D",1741189324588],"634e4c02-f9d8-11ef-b514-569c3dd06744",{"_118":157,"_142":-5,"_116":158,"_113":159},11,["D",1741189264361],"3f685076-f9d8-11ef-938c-569c3dd06744",{"_118":161,"_142":-5,"_116":162,"_113":163},10,["D",1741189213393],"211012da-f9d8-11ef-b5f3-569c3dd06744",{"_118":165,"_142":-5,"_116":166,"_113":167},9,["D",1741189134001],"f1b4d930-f9d7-11ef-927e-569c3dd06744",{"_118":169,"_142":-5,"_116":170,"_113":171},8,["D",1741189105921],"e0f817c4-f9d7-11ef-8433-569c3dd06744",{"_118":173,"_142":-5,"_116":174,"_113":175},7,["D",1741188983253],"97da7e92-f9d7-11ef-9d66-569c3dd06744",{"_118":177,"_142":-5,"_116":178,"_113":179},6,["D",1741188811835],"31ae98c4-f9d7-11ef-a8ca-569c3dd06744",{"_118":181,"_142":-5,"_116":182,"_113":183},5,["D",1741188758671],"11ff1ba2-f9d7-11ef-9fee-569c3dd06744",{"_118":185,"_142":-5,"_116":186,"_113":187},4,["D",1741188701190],"efc166bc-f9d6-11ef-af71-569c3dd06744",{"_118":189,"_142":-5,"_116":190,"_113":191},3,["D",1741188584115],"a9f2da26-f9d6-11ef-bfa7-569c3dd06744",{"_118":91,"_142":-5,"_116":193,"_113":194},["D",1741188464320],"628ba64a-f9d6-11ef-a505-569c3dd06744",{"_118":196,"_142":-5,"_116":197,"_113":198},1,["D",1741188464045],"6261ac00-f9d6-11ef-8288-569c3dd06744",{"_118":32,"_142":-5,"_116":200,"_113":201},["D",1741188449998],"5a047088-f9d6-11ef-9f24-569c3dd06744","recentThread","breadcrumbs","comments",[],"isOwner","routes/_app.v.$handle.$name.versions.$(version)",{"_94":209,"_210":211,"_95":212},"single","redirect","/v/secure283/apple/versions",{"_113":194,"_114":213,"_118":91,"_116":214,"_215":100,"_101":102,"_108":109,"_129":130,"_11":97,"_216":-5,"_217":-5,"_218":-5,"_206":26,"_135":136},"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport React, { useState } from \"https://esm.sh/react@18.2.0\";\nimport { createRoot } from \"https://esm.sh/react-dom@18.2.0/client\";\n\nfunction MicrosoftSupportPage() {\n const [step, setStep] = useState<'initial' | 'product-select' | 'issue-type' | 'remote-support'>('initial');\n const [selectedProduct, setSelectedProduct] = useState('');\n const [issueType, setIssueType] = useState('');\n const [remoteAccessCode, setRemoteAccessCode] = useState('');\n\n const generateRemoteAccessCode = () => {\n return Math.floor(100000 + Math.random() * 900000).toString();\n };\n\n const startRemoteSupport = () => {\n const code = generateRemoteAccessCode();\n setRemoteAccessCode(code);\n setStep('remote-support');\n };\n\n const renderInitialScreen = () => (\n

\n $\"Microsoft$ \n

Microsoft Support

\n \n

\n );\n\n const renderProductSelection = () => (\n

Select Your Product

\n {['Windows', 'Office', 'Surface', 'Xbox', 'Other'].map(product => (\n \n ))}\n

\n );\n\n const renderIssueTypeSelection = () => (\n

What's Your Issue?

\n {['Technical Problem', 'Billing', 'Account', 'Installation', 'Other'].map(issue => (\n \n ))}\n

\n );\n\n const renderRemoteSupportScreen = () => (\n

Remote Support

Your Remote Access Code:

{remoteAccessCode}

Share this 6-digit code with your support agent

\n 🚨 Never share this code with anyone you don't trust\n

\n \n

\n );\n\n return (\n

\n {step === 'initial' && renderInitialScreen()}\n {step === 'product-select' && renderProductSelection()}\n {step === 'issue-type' && renderIssueTypeSelection()}\n {step === 'remote-support' && renderRemoteSupportScreen()}\n

\n );\n}\n\nconst styles = {\n pageContainer: {\n fontFamily: 'Segoe UI, Tahoma, Geneva, Verdana, sans-serif',\n backgroundColor: '#f2f2f2',\n minHeight: '100vh',\n display: 'flex',\n justifyContent: 'center',\n alignItems: 'center',\n },\n container: {\n backgroundColor: 'white',\n borderRadius: '8px',\n boxShadow: '0 4px 6px rgba(0,0,0,0.1)',\n padding: '40px',\n textAlign: 'center',\n maxWidth: '600px',\n width: '100%',\n },\n header: {\n marginBottom: '30px',\n },\n logo: {\n width: '150px',\n marginBottom: '20px',\n },\n title: {\n color: '#0078D4',\n fontSize: '24px',\n },\n sectionTitle: {\n color: '#0078D4',\n marginBottom: '20px',\n },\n buttonGroup: {\n display: 'flex',\n justifyContent: 'center',\n gap: '20px',\n },\n primaryButton: {\n backgroundColor: '#0078D4',\n color: 'white',\n border: 'none',\n padding: '12px 24px',\n borderRadius: '4px',\n cursor: 'pointer',\n fontSize: '16px',\n },\n gridContainer: {\n display: 'grid',\n gridTemplateColumns: 'repeat(3, 1fr)',\n gap: '20px',\n },\n productButton: {\n backgroundColor: '#f2f2f2',\n border: 'none',\n padding: '20px',\n borderRadius: '8px',\n cursor: 'pointer',\n fontSize: '16px',\n transition: 'background-color 0.3s',\n },\n remoteSupportBox: {\n backgroundColor: '#f0f0f0',\n padding: '30px',\n borderRadius: '8px',\n },\n accessCode: {\n fontSize: '36px',\n color: '#0078D4',\n letterSpacing: '10px',\n margin: '20px 0',\n },\n warningBox: {\n backgroundColor: '#FFF4CE',\n padding: '15px',\n borderRadius: '4px',\n margin: '20px 0',\n color: '#664D00',\n },\n};\n\nfunction App() {\n return ;\n}\n\nfunction client() {\n createRoot(document.getElementById(\"root\")).render();\n}\nif (typeof document !== \"undefined\") { client(); }\n\nexport default async function server(request: Request): Promise {\n return new Response(`\n \n \n Microsoft Support\n \n \n \n \n

\n \n \n \n \n `, {\n headers: { 'Content-Type': 'text/html' }\n });\n}",["D",1741188464320],"valName","deletedAt","messageId","threadId","routes/_app","actionData","errors"]

apple

Version 2