v4.amy.rip/src/App.tsx

import './App.css'
import {createEffect, createSignal, onCleanup} from "solid-js";
import SingularOomf from './components/oomfs';

export function arrayRand<T>(arr: T[]): T {
  const meow = Math.floor(Math.random() * arr.length);
  return arr[meow];
}

function App() {
    const [name, setName] = createSignal("amy");
    const [balls, setBalls] = createSignal(false);
    let intervalId: number | undefined; 

    createEffect(() => {
        if (balls()) {
            if (intervalId) {
                clearInterval(intervalId);
            }
            intervalId = setInterval(() => {
                setName(arrayRand([
                    "amy",
                    "yma",
                    "may",
                    "sdkjfhgsdf",
                    "slkdfhsdf",
                    "igasdfuausyfrd",
                    "hi :3",
                    "girls,,,,,"
                ]));
            }, 25);
        } else {
            if (intervalId) {
                clearInterval(intervalId);
                intervalId = undefined;
            }
            setName("amy");
        }
    });

    onCleanup(() => {
        if (intervalId) {
            clearInterval(intervalId);
        }
    });

    return (
        <>
            <div class="pfp">
                <img src="https://dp.nea.moe/avatar/603229858612510720.png" alt="" />
                <h1
                    onMouseEnter={() => {
                        setBalls(true);
                    }}
                    onMouseLeave={() => setBalls(false)}
                >{name()}</h1>
            </div>
            <div class="containermain">
                <h1
                    style={{
                        color: "#eebebe"
                    }}
                >meow!</h1>
                <p>silly self-taught programmer who makes software that wont change the world<br/><small>yes, i stole your motto. you know who you are.</small></p>
                <p>check out my cute friends</p>
                <div class="oomfs">
                    <SingularOomf discordId='435026627907420161'  link='https://yellows.ink' name='hazel'/>
                    <SingularOomf discordId='148801388938264576'  link='https://nax.dev' name='nax'/>
                    <SingularOomf discordId='406028027768733696'  name='sunnie'/>
                    <SingularOomf discordId='487788215177314307'  link='https://leahs.gay' name='leah'/>
                    <SingularOomf discordId='277830029399031818'  name='neomi'/>
                    <SingularOomf discordId='1079479184478441643' name='rini'/>
                    <SingularOomf discordId='352837489125228546'  name='tasky'/>
                </div>
                <h2>*website is under heavy construction. expect a lot of changes</h2>
            </div>
        </>
    );
}

export default App