\n Oops!\n {message}\n

\n );\n}\n\nfunction Loader() {\n return (\n

\n {/* Outer container for spin */}\n

\n {/* Main record container */}\n

\n {/* Outer ring groove */}\n

\n\n {/* Inner grooves */}\n

\n\n {/* Light arcs to show rotation */}\n

\n\n {/* Center label */}\n

\n {/* Center hole */}\n

\n {/* Subtle label detail */}\n

\n\n {/* Loading text with subtle pulse animation */}\n

\n Loading Ash's record collection...\n

\n );\n}\n\nfunction shuffleArray(array) {\n const shuffledArray = [...array];\n for (let i = shuffledArray.length - 1; i > 0; i--) {\n const j = Math.floor(Math.random() * (i + 1));\n [shuffledArray[i], shuffledArray[j]] = [shuffledArray[j], shuffledArray[i]];\n }\n return shuffledArray;\n}\n\nfunction RecordCard() {\n const [records, setRecords] = useState([]);\n const [currentRecordIndex, setCurrentRecordIndex] = useState(0);\n const [isLoading, setIsLoading] = useState(true);\n const [error, setError] = useState(null);\n const [backHistory, setBackHistory] = useState([]);\n const [forwardHistory, setForwardHistory] = useState([]);\n const [moveDirection, setMoveDirection] = useState(null);\n const [hasInteracted, setHasInteracted] = useState(false);\n\n useEffect(() => {\n async function fetchReleases() {\n try {\n const response = await fetch(\"https://ashryanio-getallreleasesfromdiscogs.web.val.run\");\n if (!response.ok) {\n throw new Error(`HTTP error! status: ${response.status}`);\n }\n const fetchedRecords = await response.json();\n console.log(fetchedRecords);\n if (!Array.isArray(fetchedRecords)) {\n throw new Error(\"Received data is not an array\");\n }\n const shuffledRecords = shuffleArray(fetchedRecords);\n setRecords(shuffledRecords);\n setIsLoading(false);\n } catch (error) {\n console.error(\"Failed to fetch releases:\", error);\n setError(error.message);\n setIsLoading(false);\n }\n }\n fetchReleases();\n }, []);\n\n const getRandomRecord = useCallback(() => {\n if (!hasInteracted) setHasInteracted(true);\n setMoveDirection(\"right\");\n\n if (forwardHistory.length > 0) {\n const nextIndex = forwardHistory[forwardHistory.length - 1];\n setCurrentRecordIndex(nextIndex);\n setForwardHistory(prev => prev.slice(0, -1));\n setBackHistory(prev => [...prev, currentRecordIndex]);\n } else {\n const randomIndex = Math.floor(Math.random() * records.length);\n setBackHistory(prev => [...prev, currentRecordIndex]);\n setForwardHistory([]);\n setCurrentRecordIndex(randomIndex);\n }\n }, [records, currentRecordIndex, forwardHistory, hasInteracted]);\n\n const goBack = useCallback(() => {\n if (!hasInteracted) setHasInteracted(true);\n setMoveDirection(\"left\");\n\n if (backHistory.length > 0) {\n const lastIndex = backHistory[backHistory.length - 1];\n setForwardHistory(prev => [...prev, currentRecordIndex]);\n setCurrentRecordIndex(lastIndex);\n setBackHistory(prev => prev.slice(0, -1));\n }\n }, [backHistory, currentRecordIndex, hasInteracted]);\n\n useEffect(() => {\n function handleKeydown(event) {\n if (\n event.target.tagName.toLowerCase() !== \"input\"\n && event.target.tagName.toLowerCase() !== \"textarea\"\n ) {\n switch (event.key) {\n case \"ArrowLeft\":\n if (backHistory.length > 0) {\n goBack();\n }\n break;\n case \"ArrowRight\":\n getRandomRecord();\n break;\n }\n }\n }\n\n window.addEventListener(\"keydown\", handleKeydown);\n return () => window.removeEventListener(\"keydown\", handleKeydown);\n }, [goBack, getRandomRecord]);\n\n const handleDragEnd = useCallback((event, info) => {\n const SWIPE_THRESHOLD = 50;\n const SWIPE_VELOCITY = 0.3;\n\n if (Math.abs(info.offset.x) > SWIPE_THRESHOLD && Math.abs(info.velocity.x) > SWIPE_VELOCITY) {\n if (info.offset.x > 0 && backHistory.length > 0) {\n goBack();\n } else if (info.offset.x < 0) {\n getRandomRecord();\n }\n }\n }, [goBack, getRandomRecord, backHistory.length]);\n\n if (error) return ;\n if (isLoading) return ;\n if (records.length === 0) {\n return (\n

No records found.

\n );\n }\n\n const record = records[currentRecordIndex];\n\n const variants = {\n enter: (direction) => ({\n x: direction === \"left\" ? -200 : 200,\n opacity: 0,\n }),\n center: {\n x: 0,\n opacity: 1,\n },\n exit: (direction) => ({\n x: direction === \"left\" ? 200 : -200,\n opacity: 0,\n }),\n };\n\n const navigationVariants = {\n visible: { opacity: 1 },\n hidden: { opacity: 0 },\n };\n\n return (\n

Ash Randorecs

\n Pulling from {records.length} records\n

\n\n

\n {/* Navigation buttons outside AnimatePresence */}\n {backHistory.length > 0 && (\n \n \n \n \n \n )}\n\n \n \n \n \n \n\n \n \n

\n \n

\n\n

{record.basic_information.title}

\n {record.basic_information.artists.map(a => a.name).join(\", \")} • {record.basic_information.year}\n

\n\n

Format

{record.basic_information.formats[0]?.name} - {record.basic_information.formats[0]?.text}

{record.basic_information.formats[0]?.descriptions?.join(\" • \")}

\n\n

Label

{record.basic_information.labels[0]?.name} • {record.basic_information.labels[0]?.catno}

\n\n

\n {record.basic_information.genres?.map(genre => (\n \n {genre}\n \n ))}\n {record.basic_information.styles?.map(style => (\n \n {style}\n \n ))}\n

\n \n \n

\n );\n}\n\nclass ErrorBoundary extends React.Component {\n constructor(props) {\n super(props);\n this.state = { hasError: false };\n }\n\n static getDerivedStateFromError(error) {\n return { hasError: true };\n }\n\n componentDidCatch(error, errorInfo) {\n console.error(\"ErrorBoundary caught an error:\", error, errorInfo);\n }\n\n render() {\n if (this.state.hasError) {\n return ;\n }\n\n return this.props.children;\n }\n}\n\nfunction client() {\n const rootElement = document.getElementById(\"root\");\n if (!rootElement) {\n console.error(\"Root element not found\");\n return;\n }\n const root = createRoot(rootElement);\n root.render(\n \n \n ,\n );\n}\n\n// Ensure client() runs after the DOM is fully loaded\nif (typeof document !== \"undefined\") {\n document.addEventListener(\"DOMContentLoaded\", client);\n}\n\nexport default async function server(request: Request): Promise {\n const url = new URL(request.url);\n\n if (url.pathname === \"/favicon.svg\") {\n return new Response(\n ``,\n );\n }\n\n return new Response(\n `\n \n \n Ash Randorecs\n \n \n \n \n \n \n

\n \n \n \n `,\n {\n headers: { \"content-type\": \"text/html\" },\n },\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",1733576238036],[155],"file","upstreamProject",{"_102":145,"_95":96,"_111":-5,"_112":-5,"_109":110,"_23":189},{"_93":190,"_130":191},"ashryanio","https://img.clerk.com/eyJ0eXBlIjoicHJveHkiLCJzcmMiOiJodHRwczovL2ltYWdlcy5jbGVyay5kZXYvb2F1dGhfZ2l0aHViL2ltZ18yaG5kR0hRRTM0S1BSeXlIR2hCdjFqb1dTS3AifQ","upstreamBranch",{"_102":141,"_104":194,"_195":196,"_95":43,"_139":145,"_99":197,"_140":-5,"_142":-5,"_198":199,"_106":-5,"_150":22,"_109":110,"_149":190,"_16":147,"_148":96},["D",1746211347023],"updatedAt",["D",1747842542942],219,"lockfileKey","1756180949400-esm.town_v_ashryanio_randoDisc@219-main","emptyEnvVars","isNew","flags",[],"routes/_app.x.$handle.$name._index",{"_93":94,"_95":96,"_97":-7,"_99":-7,"_100":206,"_181":211,"_214":-7,"_215":216,"_219":-5,"_172":220,"_224":225},{"_102":103,"_95":96,"_104":207,"_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":208,"_132":209,"_135":210,"_150":22},["D",1745962184870],{"_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},[212],{"_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":213},[155],"readme","upstream",{"_102":141,"_104":217,"_195":218,"_95":43,"_139":145,"_99":197,"_140":-5,"_142":-5,"_198":199,"_106":-5,"_150":22,"_109":110,"_149":190,"_16":147,"_148":96},["D",1746211347023],["D",1747842542942],"pull",[221],{"_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":222,"_98":223},[],[155],"previews",[221],"actionData","errors"]

stevekrouse

randoDisc