apple2js/js/components/debugger/Debugger.tsx
Will Scullin 9173bff1ba
Switch to scss, better scope rules (#170)
Restrict element types and global styling to improve embedability
2023-01-11 18:14:44 -08:00

45 lines
1.3 KiB
TypeScript

import { h } from 'preact';
import { useState } from 'preact/hooks';
import { Inset } from '../Inset';
import { Tab, Tabs } from '../Tabs';
import { Apple2 } from 'js/apple2';
import { Applesoft } from './Applesoft';
import { CPU } from './CPU';
import { Disks } from './Disks';
import { Memory } from './Memory';
import { VideoModes } from './VideoModes';
import styles from './css/Debugger.module.scss';
interface DebuggerProps {
apple2: Apple2 | undefined;
}
export const Debugger = ({ apple2 }: DebuggerProps) => {
const [selected, setSelected] = useState(0);
if (!apple2) {
return null;
}
return (
<Inset className={styles.inset}>
<Tabs setSelected={setSelected}>
<Tab>CPU</Tab>
<Tab>Video</Tab>
<Tab>Memory</Tab>
<Tab>Disks</Tab>
<Tab>Applesoft</Tab>
</Tabs>
<div className={styles.debugger}>
{selected === 0 ? <CPU apple2={apple2} /> : null}
{selected === 1 ? <VideoModes apple2={apple2} /> : null}
{selected === 2 ? <Memory apple2={apple2} /> : null}
{selected === 3 ? <Disks apple2={apple2} /> : null}
{selected === 4 ? <Applesoft apple2={apple2} /> : null}
</div>
</Inset>
);
};