morten/bob
1
0
Fork 0
mirror of https://github.com/morten-olsen/bob.git synced 2026-02-08 01:46:29 +01:00
Code Issues Packages Projects Releases Wiki Activity

docs: improved webpage

Browse Source
This commit is contained in:
Morten Olsen
2023-09-26 21:14:31 +02:00
parent c00b073d37
commit 5d8cba0ddd
54 changed files with 1358 additions and 693 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
packages/algorithm/src/index.ts
View File

@@ -5,4 +5,4 @@ export {
type CalulationResult,
type PlanableWithPlugins,
} from './algorithm/calulation';
export { plugins } from './plugins/index';
export { plugins, type AllPlugins } from './plugins';

5
packages/algorithm/src/plugins/index.ts
View File

@@ -7,4 +7,9 @@ const plugins = {
capabilities,
} satisfies Record<string, (...args: any[]) => Plugin>;
type AllPlugins = {
[K in keyof typeof plugins]: ReturnType<(typeof plugins)[K]>;
};
export type { AllPlugins };
export { plugins };

13
packages/algorithm/src/types/plugin.ts
View File

@@ -1,3 +1,4 @@
import { Expand, UnionToIntersection } from '../types/utils';
import { GraphNode } from './node';
import { Planable } from './planable';
@@ -20,16 +21,20 @@ type Plugin<TAttributes = any, TContext = any> = {
type Plugins = Record<string, Plugin>;
type PluginAttributes<TPlugins extends Plugins> = {
type PluginAttributes<TPlugins extends Plugins> = MergeRecords<{
[K in keyof TPlugins]: TPlugins[K] extends Plugin<infer TAttributes, any>
? TAttributes
: never;
}[keyof TPlugins];
}>;
type PluginContext<TPlugins extends Plugins> = {
type MergeRecords<T extends Record<string, any>> = Expand<
UnionToIntersection<T[keyof T]>
>;
type PluginContext<TPlugins extends Plugins> = MergeRecords<{
[K in keyof TPlugins]: TPlugins[K] extends Plugin<any, infer TContext>
? TContext
: never;
}[keyof TPlugins];
}>;
export type { Plugin, Plugins, PluginAttributes, PluginContext };

17
packages/algorithm/src/types/utils.ts Normal file
View File

@@ -0,0 +1,17 @@
// expands object types one level deep
type Expand<T> = T extends infer O ? { [K in keyof O]: O[K] } : never;
// expands object types recursively
type ExpandRecursively<T> = T extends object
? T extends infer O
? { [K in keyof O]: ExpandRecursively<O[K]> }
: never
: T;
type UnionToIntersection<U> = (U extends any ? (k: U) => void : never) extends (
k: infer I,
) => void
? I
: never;
export type { Expand, ExpandRecursively, UnionToIntersection };

3
packages/playground/index.html
View File

@@ -3,9 +3,10 @@
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link href="/src/index.css" rel="stylesheet" />
<title>Vite + React + TS</title>
</head>
<body>
<body class="dark text-foreground bg-background">
<div id="root"></div>
<script type="module" src="/src/main.tsx"></script>
</body>

2
packages/playground/package.json
View File

@@ -16,6 +16,8 @@
"framer-motion": "^10.16.4",
"react": "^18.2.0",
"react-dom": "^18.2.0",
"react-json-tree": "^0.18.0",
"react-router-dom": "^6.16.0",
"tailwindcss": "^3.3.3"
},
"devDependencies": {

10
packages/playground/src/app.tsx
View File

@@ -1,11 +1,13 @@
import { NextUIProvider } from '@nextui-org/react';
import { Page } from './containers/experiment';
import { Router } from './router';
const App: React.FC = () => {
return (
<NextUIProvider>
<Page slug=".capabilities" />
</NextUIProvider>
<div className="dark text-foreground bg-background">
<NextUIProvider>
<Router />
</NextUIProvider>
</div>
);
};

13
packages/playground/src/components/content/index.tsx Normal file
View File

@@ -0,0 +1,13 @@
type ContentProps = {
children: React.ReactNode;
};
const Content: React.FC<ContentProps> = ({ children }) => {
return (
<div className="max-w-3xl mx-auto w-full">
<div className="flex-1 p-8">{children}</div>
</div>
);
};
export { Content };

41
packages/playground/src/components/frame/index.tsx Normal file
View File

@@ -0,0 +1,41 @@
import {
Navbar,
NavbarBrand,
NavbarContent,
NavbarItem,
Link,
} from '@nextui-org/react';
import { Link as RouterLink } from 'react-router-dom';
type FrameProps = {
children: React.ReactNode;
};
const Frame = ({ children }: FrameProps) => {
return (
<div className="h-screen flex flex-col">
<Navbar shouldHideOnScroll isBordered isBlurred>
<NavbarBrand>
<RouterLink to="/">
<p className="font-bold text-inherit">Bob</p>
</RouterLink>
</NavbarBrand>
<NavbarContent className="hidden sm:flex gap-4" justify="center">
<NavbarItem>
<RouterLink to="/">
<Link color="foreground">Home</Link>
</RouterLink>
</NavbarItem>
<NavbarItem>
<RouterLink to="/experiments">
<Link color="foreground">Experiments</Link>
</RouterLink>
</NavbarItem>
</NavbarContent>
</Navbar>
<div className="flex flex-col flex-1">{children}</div>
</div>
);
};
export { Frame };

97
packages/playground/src/containers/experiment/find-node/index.tsx Normal file
View File

@@ -0,0 +1,97 @@
import {
Button,
Modal,
ModalBody,
ModalContent,
ModalHeader,
useDisclosure,
Badge,
Checkbox,
Input,
} from '@nextui-org/react';
import { useMemo, useState } from 'react';
import { useExperimentResult } from '../../../features/experiment';
import { useSelectNode } from '../../../features/experiment/hooks';
import { GraphNode } from '@bob-the-algorithm/core';
const FindNodeView = () => {
const data = useExperimentResult();
const { isOpen, onOpen, onOpenChange } = useDisclosure();
const [completed, setCompleted] = useState(true);
const [text, setText] = useState('');
const selectNode = useSelectNode();
const nodes = useMemo(() => {
if (!data) {
return [];
}
let result = [...data.nodes];
if (completed) {
result = result.filter((node) => node.completed);
}
if (text) {
result = result.filter((node) => node.id === text);
}
return result.sort((a, b) => b.score - a.score).slice(0, 10);
}, [data, completed, text]);
const getColor = (node: GraphNode) => {
if (node.completed) {
return 'success';
}
if (node.deadEnd) {
return 'danger';
}
return 'primary';
};
return (
<>
<Button onPress={onOpen}>Find node</Button>
<Modal
isOpen={isOpen}
scrollBehavior="inside"
onOpenChange={onOpenChange}
>
<ModalContent>
{(close) => (
<>
<ModalHeader className="flex flex-col gap-1">Nodes</ModalHeader>
<ModalBody>
<Input
placeholder="Node ID"
value={text}
onValueChange={setText}
/>
<Checkbox isSelected={completed} onValueChange={setCompleted}>
Completed
</Checkbox>
<div className="flex gap-4 flex-wrap">
{nodes.map((node) => (
<Badge
content={node.score}
color={getColor(node)}
key={node.id}
>
<Button
onClick={() => {
selectNode(node);
close();
}}
key={node.id}
>
{node.id}
</Button>
</Badge>
))}
</div>
</ModalBody>
</>
)}
</ModalContent>
</Modal>
</>
);
};
export { FindNodeView };

32
packages/playground/src/containers/experiment/graph.tsx Normal file
View File

@@ -0,0 +1,32 @@
import {
Modal,
ModalContent,
ModalHeader,
ModalBody,
Button,
useDisclosure,
} from '@nextui-org/react';
import { Graph } from '../../presenters/graph';
const GraphView = () => {
const { isOpen, onOpen, onOpenChange } = useDisclosure();
return (
<>
<Button onPress={onOpen}>Show graph</Button>
<Modal isOpen={isOpen} onOpenChange={onOpenChange} size="full">
<ModalContent>
{() => (
<>
<ModalHeader className="flex flex-col gap-1">Graph</ModalHeader>
<ModalBody>
<Graph />
</ModalBody>
</>
)}
</ModalContent>
</Modal>
</>
);
};
export { GraphView };

38
packages/playground/src/containers/experiment/index.tsx
View File

@@ -1,18 +1,18 @@
import { useEffect, useState } from 'react';
import { experiments } from '../../utils/experiments';
import { ExperimentProvider } from '../../features/experiment/context';
import { ExperimentView } from './view';
import { ExperimentInfo } from '../../features/experiment/types';
type PageProps = {
slug: string;
content: () => Promise<{ default: Experiment }>;
};
type Experiment = {
worker: () => Worker;
view: React.ReactElement;
info: ExperimentInfo;
view: React.ComponentType;
};
const Page: React.FC<PageProps> = ({ slug }) => {
const ExperimentPage: React.FC<PageProps> = ({ content }) => {
const [loading, setLoading] = useState(true);
const [error, setError] = useState<unknown>();
const [experiment, setExperiment] = useState<Experiment>();
@@ -22,11 +22,9 @@ const Page: React.FC<PageProps> = ({ slug }) => {
setError(undefined);
const load = async () => {
try {
const page = experiments.find((page) => page.slug === slug);
if (!page) {
throw new Error(`Page not found: ${slug}`);
}
const next = (await page.loader()) as Experiment;
const { default: next } = (await content()) as {
default: Experiment;
};
console.log('n', next);
setExperiment(next);
} catch (err) {
@@ -37,7 +35,7 @@ const Page: React.FC<PageProps> = ({ slug }) => {
};
load();
}, [slug]);
}, [content]);
if (error) {
return <div>Error: {error.toString()}</div>;
@@ -48,10 +46,22 @@ const Page: React.FC<PageProps> = ({ slug }) => {
}
return (
<ExperimentProvider worker={experiment.worker}>
<ExperimentView>{experiment.view}</ExperimentView>
<ExperimentProvider experimentInfo={experiment.info}>
<ExperimentView>
<experiment.view />
</ExperimentView>
</ExperimentProvider>
);
};
export { Page };
const pageImports = import.meta.glob('../../experiments/*/index.tsx');
const experiments: {
path: string;
element: JSX.Element;
}[] = Object.entries(pageImports).map(([path, page]) => ({
path: path.replace('../../experiments/', '').replace('/index.tsx', ''),
element: <ExperimentPage content={page as any} />,
}));
export { experiments };

116
packages/playground/src/containers/experiment/input/index.tsx Normal file
View File

@@ -0,0 +1,116 @@
import {
Modal,
ModalContent,
ModalHeader,
ModalBody,
Button,
useDisclosure,
Card,
CardBody,
CardHeader,
} from '@nextui-org/react';
import { useExperimentResult } from '../../../features/experiment';
import { formatTime } from '../../../utils/time';
const InputView = () => {
const data = useExperimentResult();
const { isOpen, onOpen, onOpenChange } = useDisclosure();
if (!data) {
return null;
}
return (
<>
<Button onPress={onOpen}>Show input</Button>
<Modal
isOpen={isOpen}
onOpenChange={onOpenChange}
scrollBehavior="inside"
>
<ModalContent>
<ModalHeader className="flex flex-col gap-1">Input</ModalHeader>
<ModalBody>
<div className="flex flex-col gap-4">
{data.planables.map((item) => {
const description: [string, string][] = [];
if (item.start) {
if (item.start.min === item.start.max) {
description.push(['start', formatTime(item.start.min)]);
} else {
const min = formatTime(item.start.min);
const max = formatTime(item.start.max);
description.push(['start', `${min} - ${max}`]);
}
}
if (item.count || 0 > 1) {
description.push(['count', item.count?.toString() || '']);
}
if (item.attributes.locations) {
description.push([
'locations',
item.attributes.locations.join(', '),
]);
}
if (item.attributes.capabilities?.requires) {
description.push([
'requires',
item.attributes.capabilities.requires.join(', '),
]);
}
if (item.attributes.capabilities?.perhibits) {
description.push([
'prohibits',
item.attributes.capabilities.perhibits.join(', '),
]);
}
if (item.attributes.capabilities?.provides) {
description.push([
'provides',
item.attributes.capabilities.provides.join(', '),
]);
}
if (item.attributes.capabilities?.consumes) {
description.push([
'consumes',
item.attributes.capabilities.consumes.join(', '),
]);
}
description.push([
'duration',
`${item.duration / 1000 / 60} minutes`,
]);
return (
<Card>
<CardHeader>{item.id}</CardHeader>
<CardBody>
<div>
{description.map((d) => (
<div className="flex justify-between">
<div>
<span className="font-bold">{d[0]}: </span>
</div>
<div>
<span>{d[1]}</span>
</div>
</div>
))}
</div>
</CardBody>
</Card>
);
})}
</div>
</ModalBody>
</ModalContent>
</Modal>
</>
);
};
export { InputView };

26
packages/playground/src/containers/experiment/node.tsx
View File

@@ -1,26 +0,0 @@
import { Accordion, AccordionItem } from '@nextui-org/react';
import { useSelectedNode } from '../../features/experiment/hooks';
import { Plan } from '../../presenters/plan';
const NodeView = () => {
const node = useSelectedNode();
if (!node) {
return null;
}
return (
<div>
<h1>{node.id}</h1>
<Accordion>
<AccordionItem title="Plan" key="plan">
<Plan node={node} />
</AccordionItem>
<AccordionItem title="Context" key="context">
<pre>{JSON.stringify(node.context, null, 2)}</pre>
</AccordionItem>
</Accordion>
</div>
);
};
export { NodeView };

46
packages/playground/src/containers/experiment/node/details.tsx Normal file
View File

@@ -0,0 +1,46 @@
import { GraphNode } from '@bob-the-algorithm/core';
import { Modal, ModalBody, ModalContent, ModalHeader } from '@nextui-org/react';
import { format } from 'date-fns';
import { JSONTree } from 'react-json-tree';
import { useExperimentResult } from '../../../features/experiment';
import { useMemo } from 'react';
type NodeDetailsViewProps = {
node?: GraphNode;
onClose: () => void;
};
const NodeDetailsInfo = ({ node }: { node: GraphNode }) => {
const data = useExperimentResult();
const start = format(new Date(node.time), 'HH:mm');
const planable = useMemo(() => {
if (!data) {
return null;
}
return node.planable
? data.planables.find((n) => n.id === node.planable)
: null;
}, [node, data]);
return (
<div>
<h1>{node.id}</h1>
<p>{start}</p>
<pre></pre>
<JSONTree data={node.context} />
{planable && <JSONTree data={planable} />}
</div>
);
};
const NodeDetailsView = ({ node, onClose }: NodeDetailsViewProps) => {
return (
<Modal size="3xl" isOpen={!!node} onClose={onClose}>
<ModalContent>
<ModalHeader>Item details</ModalHeader>
<ModalBody>{node && <NodeDetailsInfo node={node} />}</ModalBody>
</ModalContent>
</Modal>
);
};
export { NodeDetailsView };

44
packages/playground/src/containers/experiment/node/index.tsx Normal file
View File

@@ -0,0 +1,44 @@
import { Modal, ModalBody, ModalContent, ModalHeader } from '@nextui-org/react';
import { GraphNode } from '@bob-the-algorithm/core';
import {
useSelectNode,
useSelectedNode,
} from '../../../features/experiment/hooks';
import { Plan } from '../../../presenters/plan';
import { useState } from 'react';
import { NodeDetailsView } from './details';
import { HorizontalPlan } from '../../../presenters/horizontal-plan';
const NodeView = () => {
const node = useSelectedNode();
const selectNode = useSelectNode();
const [selectedItem, setSelectedItem] = useState<GraphNode<any>>();
return (
<>
<Modal
isOpen={!!node}
scrollBehavior="inside"
onClose={() => selectNode(undefined)}
>
<ModalContent>
<ModalHeader>Node</ModalHeader>
<ModalBody>
{node && (
<>
<HorizontalPlan node={node} />
<Plan node={node} onSelect={setSelectedItem} />
</>
)}
</ModalBody>
</ModalContent>
</Modal>
<NodeDetailsView
node={selectedItem}
onClose={() => setSelectedItem(undefined)}
/>
</>
);
};
export { NodeView };

23
packages/playground/src/containers/experiment/nodes.tsx
View File

@@ -1,23 +0,0 @@
import { useExperimentResult } from '../../features/experiment';
import { useSelectNode } from '../../features/experiment/hooks';
const NodesView = () => {
const data = useExperimentResult();
const selectNode = useSelectNode();
if (!data) {
return null;
}
return (
<div>
{data.completed.map((node) => (
<div onClick={() => selectNode(node)} key={node.id}>
{node.id} {node.score}
</div>
))}
</div>
);
};
export { NodesView };

17
packages/playground/src/containers/experiment/stats/index.tsx Normal file
View File

@@ -0,0 +1,17 @@
import { useExperimentResult } from '../../../features/experiment';
import { useExperimentDuration } from '../../../features/experiment/hooks';
const Stats = () => {
const data = useExperimentResult();
const duration = useExperimentDuration();
return (
<div className="flex gap-2">
<div>Nodes: {data?.nodes.length}</div>
<div>Completed: {data?.completed.length}</div>
<div>Duration: {duration}ms</div>
</div>
);
};
export { Stats };

30
packages/playground/src/containers/experiment/view.tsx
View File

@@ -1,6 +1,10 @@
import { Graph } from '../../presenters/graph';
import { Content } from '../../components/content';
import { Frame } from '../../components/frame';
import { FindNodeView } from './find-node';
import { GraphView } from './graph';
import { InputView } from './input';
import { NodeView } from './node';
import { NodesView } from './nodes';
import { Stats } from './stats';
type ExperimentViewProps = {
children: React.ReactNode;
@@ -8,11 +12,23 @@ type ExperimentViewProps = {
const ExperimentView: React.FC<ExperimentViewProps> = ({ children }) => {
return (
<>
<Graph />
<NodesView />
<NodeView />
</>
<Frame>
<div className="flex flex-row h-full">
<div className="flex flex-col flex-1 h-full">
<div className="flex-1">
<Content>{children}</Content>
</div>
<div className="flex-initial p-2 flex gap-2 items-center">
<GraphView />
<InputView />
<FindNodeView />
<div className="flex-1" />
<Stats />
</div>
</div>
<NodeView />
</div>
</Frame>
);
};

15
packages/playground/src/containers/page/index.tsx Normal file
View File

@@ -0,0 +1,15 @@
import { Page } from './page';
const pageImports = import.meta.glob('../../pages/**/*.tsx');
const pages: any = Object.entries(pageImports).map(([path, page]) => ({
path: path
.replace('../../pages/', '')
.replace('index.tsx', '')
.replace('.tsx', ''),
element: <Page content={page as any} />,
}));
console.log('pages', pages);
export { pages };

38
packages/playground/src/containers/page/page.tsx Normal file
View File

@@ -0,0 +1,38 @@
import { useEffect, useState } from 'react';
import { Frame } from '../../components/frame';
import { Skeleton } from '@nextui-org/react';
import { Content } from '../../components/content';
type Props = {
content: () => Promise<{ Page: (props: any) => JSX.Element }>;
};
const Page = ({ content }: Props) => {
const [Component, setComponent] = useState<React.ComponentType>();
useEffect(() => {
const run = async () => {
const component = await content();
setComponent(() => component.Page);
};
run();
}, [content]);
return (
<Frame>
<Content>
{!!Component ? (
<article className="my-10">
<Component />
</article>
) : (
<div className="w-full flex flex-col gap-2">
<Skeleton className="h-3 w-3/5 rounded-lg" />
<Skeleton className="h-3 w-4/5 rounded-lg" />
</div>
)}
</Content>
</Frame>
);
};
export { Page };

163
packages/playground/src/experiments/capabilities/experiment.ts Normal file
View File

@@ -0,0 +1,163 @@
import { ExperimentInfo } from '../../features/experiment/types';
const MIN = 1000 * 60;
const HOUR = 1000 * 60 * 60;
const info: ExperimentInfo = {
start: 0,
planables: [
{
id: `Brush teeth`,
duration: 2 * MIN,
start: {
min: 7 * HOUR,
max: 8 * HOUR,
},
attributes: {
locations: ['home'],
},
score: 1,
},
{
id: 'Drop off kids',
duration: 30 * MIN,
attributes: {
locations: ['daycare'],
capabilities: {
consumes: ['kids'],
requires: ['kids'],
},
},
score: 1,
start: {
min: 7 * HOUR,
max: 9 * HOUR,
},
},
{
id: 'visit zoo',
duration: 1 * HOUR,
attributes: {
locations: ['zoo'],
capabilities: {
requires: ['kids'],
},
},
score: 1,
start: {
min: 10 * HOUR,
max: 14 * HOUR,
},
},
{
id: 'Pickup the kids',
duration: 30 * MIN,
attributes: {
locations: ['daycare'],
capabilities: {
provides: ['kids'],
},
},
score: 1,
start: {
min: 10 * HOUR,
max: 15.5 * HOUR,
},
},
{
id: 'Do work',
duration: 1 * HOUR,
count: 5,
attributes: {
locations: ['work'],
capabilities: {
perhibits: ['kids'],
},
},
score: 10,
start: {
min: 8 * HOUR,
max: 18 * HOUR,
},
},
{
id: 'put kids to bed',
duration: 30 * MIN,
attributes: {
locations: ['home'],
capabilities: {
consumes: ['kids'],
requires: ['kids'],
},
},
score: 1,
},
{
id: 'Read book',
duration: 0.5 * HOUR,
attributes: {
locations: ['home', 'work'],
capabilities: {
perhibits: ['kids'],
},
},
score: 3,
count: 2,
start: {
min: 8 * HOUR,
max: 22 * HOUR,
},
},
{
id: 'Meditate',
duration: 10 * MIN,
score: 1,
attributes: {
locations: ['home', 'work'],
capabilities: {
perhibits: ['kids'],
},
},
start: {
min: 8 * HOUR,
max: 22 * HOUR,
},
},
{
id: 'Meeting 1',
duration: 1 * HOUR,
attributes: {
locations: ['work', 'work'],
capabilities: {
perhibits: ['kids'],
},
},
score: 10,
start: {
min: 10 * HOUR,
max: 10 * HOUR,
},
},
{
id: 'Play playstation',
duration: 1 * HOUR,
attributes: {
locations: ['home'],
capabilities: {
perhibits: ['kids'],
},
},
score: 10,
start: {
min: 16 * HOUR,
max: 24 * HOUR,
},
},
],
context: {
location: 'home',
capabilities: ['kids'],
},
};
export { info };

16
packages/playground/src/experiments/capabilities/index.tsx
View File

@@ -1,12 +1,6 @@
const Foo = () => {
return <div></div>;
import { info } from './experiment';
export default {
info,
view: () => <>Hello</>,
};
const worker = () =>
new Worker(new URL('./script.ts', import.meta.url), {
type: 'module',
});
const view = <Foo />;
export { worker, view };

181
packages/playground/src/experiments/capabilities/script.ts
View File

@@ -1,181 +0,0 @@
import { Bob, plugins } from '@bob-the-algorithm/core';
import { createWorker } from '../../features/experiment/worker';
const MIN = 1000 * 60;
const HOUR = 1000 * 60 * 60;
const getTravelTime = async () => 30 * MIN;
const transport = plugins.transport({
getTravelTime,
});
const realistic = async () => {
try {
const bob = new Bob({
plugins: { transport, capabilities: plugins.capabilities() },
});
const result = await bob.run({
context: {
location: 'home',
capabilities: ['kids'],
},
start: 0,
heuristic: ({ completed }) => completed.length >= 30,
planables: [
{
id: `Brush teeth`,
duration: 2 * MIN,
start: {
min: 7 * HOUR,
max: 8 * HOUR,
},
attributes: {
locations: ['home'],
},
score: 1,
},
{
id: 'Drop off kids',
duration: 30 * MIN,
attributes: {
locations: ['daycare'],
capabilities: {
consumes: ['kids'],
requires: ['kids'],
},
},
score: 1,
start: {
min: 7 * HOUR,
max: 9 * HOUR,
},
},
{
id: 'visit zoo',
duration: 1 * HOUR,
attributes: {
locations: ['zoo'],
capabilities: {
requires: ['kids'],
},
},
score: 1,
start: {
min: 10 * HOUR,
max: 14 * HOUR,
},
},
{
id: 'Pickup the kids',
duration: 30 * MIN,
attributes: {
locations: ['daycare'],
capabilities: {
provides: ['kids'],
},
},
score: 1,
start: {
min: 10 * HOUR,
max: 15.5 * HOUR,
},
},
{
id: 'Do work',
duration: 1 * HOUR,
count: 5,
attributes: {
locations: ['work'],
capabilities: {
perhibits: ['kids'],
},
},
score: 10,
start: {
min: 8 * HOUR,
max: 18 * HOUR,
},
},
{
id: 'put kids to bed',
duration: 30 * MIN,
attributes: {
locations: ['home'],
capabilities: {
consumes: ['kids'],
requires: ['kids'],
},
},
score: 1,
},
{
id: 'Read book',
duration: 0.5 * HOUR,
attributes: {
locations: ['home', 'work'],
capabilities: {
perhibits: ['kids'],
},
},
score: 3,
count: 2,
start: {
min: 8 * HOUR,
max: 22 * HOUR,
},
},
{
id: 'Meditate',
duration: 10 * MIN,
score: 1,
attributes: {
locations: ['home', 'work'],
capabilities: {
perhibits: ['kids'],
},
},
start: {
min: 8 * HOUR,
max: 22 * HOUR,
},
},
{
id: 'Meeting 1',
duration: 1 * HOUR,
attributes: {
locations: ['work', 'work'],
capabilities: {
perhibits: ['kids'],
},
},
score: 10,
start: {
min: 10 * HOUR,
max: 10 * HOUR,
},
},
{
id: 'Play playstation',
duration: 1 * HOUR,
attributes: {
locations: ['home'],
capabilities: {
perhibits: ['kids'],
},
},
score: 10,
start: {
min: 16 * HOUR,
max: 24 * HOUR,
},
},
],
});
return result;
} catch (e) {
console.error(e);
throw e;
}
};
createWorker(realistic);

3
packages/playground/src/experiments/capabilities/view.mdx Normal file
View File

@@ -0,0 +1,3 @@
# Hello
world

12
packages/playground/src/experiments/hello/index.tsx
View File

@@ -1,12 +0,0 @@
const Foo = () => {
return <div></div>;
};
const worker = () =>
new Worker(new URL('./script.ts', import.meta.url), {
type: 'module',
});
const view = <Foo />;
export { worker, view };

153
packages/playground/src/experiments/hello/script.ts
View File

@@ -1,153 +0,0 @@
import { Bob, plugins } from '@bob-the-algorithm/core';
import { createWorker } from '../../features/experiment/worker';
const MIN = 1000 * 60;
const HOUR = 1000 * 60 * 60;
const getTravelTime = async () => 30 * MIN;
const transport = plugins.transport({
getTravelTime,
});
const realistic = async () => {
try {
const bob = new Bob({
plugins: { transport, capabilities: plugins.capabilities() },
});
const result = await bob.run({
context: {
location: 'home',
},
start: 0,
heuristic: ({ completed }) => completed.length >= 3,
planables: [
{
id: `Brush teeth`,
duration: 2 * MIN,
start: {
min: 7 * HOUR,
max: 8 * HOUR,
},
attributes: {
locations: ['home'],
},
score: 1,
},
{
id: 'Drop off kids',
duration: 30 * MIN,
attributes: {
locations: ['daycare'],
},
score: 1,
start: {
min: 7 * HOUR,
max: 9 * HOUR,
},
},
{
id: 'Pickup the kids',
duration: 30 * MIN,
attributes: {
locations: ['daycare'],
},
score: 1,
start: {
min: 15 * HOUR,
max: 15.5 * HOUR,
},
},
{
id: `Eat breakfast`,
duration: 15 * MIN,
start: {
min: 7 * HOUR,
max: 9 * HOUR,
},
attributes: {
locations: ['home'],
},
score: 1,
},
{
id: 'Do work',
duration: 1 * HOUR,
count: 5,
attributes: {
locations: ['work'],
},
score: 10,
start: {
min: 8 * HOUR,
max: 18 * HOUR,
},
},
{
id: 'Read book',
duration: 0.5 * HOUR,
attributes: {
locations: ['home', 'work'],
},
score: 3,
count: 2,
start: {
min: 8 * HOUR,
max: 22 * HOUR,
},
},
{
id: 'Meditate',
duration: 10 * MIN,
score: 1,
attributes: {},
start: {
min: 8 * HOUR,
max: 22 * HOUR,
},
},
{
id: 'Meeting 1',
duration: 1 * HOUR,
attributes: {
locations: ['work', 'work'],
},
score: 10,
start: {
min: 10 * HOUR,
max: 10 * HOUR,
},
},
{
id: 'Meeting 2',
duration: 1 * HOUR,
attributes: {
locations: ['work', 'work'],
},
score: 10,
start: {
min: 12 * HOUR,
max: 12 * HOUR,
},
},
{
id: 'Play playstation',
duration: 1 * HOUR,
attributes: {
locations: ['home'],
},
score: 10,
start: {
min: 16 * HOUR,
max: 24 * HOUR,
},
},
],
});
return result;
} catch (e) {
console.error(e);
throw e;
}
};
createWorker(realistic);

204
packages/playground/src/experiments/realistic/experiment.ts Normal file
View File

@@ -0,0 +1,204 @@
import { ExperimentInfo } from '../../features/experiment/types';
const MIN = 1000 * 60;
const HOUR = 1000 * 60 * 60;
const info: ExperimentInfo = {
context: {
location: 'home',
capabilities: ['kids'],
},
start: 0,
planables: [
{
id: `Brush teeth`,
duration: 2 * MIN,
start: {
min: 7 * HOUR,
max: 8 * HOUR,
},
attributes: {
locations: ['home'],
},
score: 1,
},
{
id: 'Drop off kids',
duration: 30 * MIN,
attributes: {
locations: ['daycare'],
capabilities: {
requires: ['kids'],
consumes: ['kids'],
},
},
score: 1,
start: {
min: 7 * HOUR,
max: 9 * HOUR,
},
},
{
id: 'put kids to bed',
duration: 30 * MIN,
attributes: {
locations: ['home'],
capabilities: {
consumes: ['kids'],
requires: ['kids'],
},
},
start: {
min: 18.5 * HOUR,
max: 19.5 * HOUR,
},
score: 1,
},
{
id: 'Pickup the kids',
duration: 30 * MIN,
attributes: {
locations: ['daycare'],
capabilities: {
provides: ['kids'],
},
},
score: 1,
start: {
min: 15 * HOUR,
max: 16 * HOUR,
},
},
{
id: `Eat breakfast`,
duration: 15 * MIN,
start: {
min: 7 * HOUR,
max: 9 * HOUR,
},
attributes: {
locations: ['home'],
},
score: 1,
},
{
id: 'Eat dinner',
duration: 60 * MIN,
attributes: {
locations: ['home'],
capabilities: {
requires: ['kids'],
},
},
score: 1,
start: {
min: 17 * HOUR,
max: 22 * HOUR,
},
},
{
id: 'Have lunch',
duration: 30 * MIN,
attributes: {},
score: 1,
start: {
min: 11 * HOUR,
max: 13.5 * HOUR,
},
},
{
id: 'Do work',
duration: 1 * HOUR,
count: 5,
attributes: {
locations: ['work'],
capabilities: {
perhibits: ['kids'],
},
},
score: 10,
start: {
min: 8 * HOUR,
max: 22 * HOUR,
},
},
{
id: 'Read book',
duration: 0.5 * HOUR,
attributes: {
locations: ['home', 'work'],
capabilities: {
perhibits: ['kids'],
},
},
score: 3,
count: 2,
start: {
min: 8 * HOUR,
max: 22 * HOUR,
},
},
{
id: 'Meditate',
duration: 10 * MIN,
score: 1,
attributes: {
locations: ['home', 'work'],
capabilities: {
perhibits: ['kids'],
},
},
start: {
min: 8 * HOUR,
max: 22 * HOUR,
},
},
{
id: 'Meeting 1',
duration: 1 * HOUR,
attributes: {
locations: ['work'],
capabilities: {
perhibits: ['kids'],
},
},
score: 10,
start: {
min: 10 * HOUR,
max: 10 * HOUR,
},
},
{
id: 'Meeting 2',
duration: 1 * HOUR,
attributes: {
locations: ['work'],
capabilities: {
perhibits: ['kids'],
},
},
score: 10,
start: {
min: 12 * HOUR,
max: 12 * HOUR,
},
},
{
id: 'Play playstation',
duration: 1 * HOUR,
attributes: {
locations: ['home'],
capabilities: {
perhibits: ['kids'],
},
},
score: 10,
start: {
min: 16 * HOUR,
max: 24 * HOUR,
},
},
],
};
export { info };

9
packages/playground/src/experiments/realistic/index.tsx Normal file
View File

@@ -0,0 +1,9 @@
import { info } from './experiment';
const Foo = () => {
return <div></div>;
};
export default {
info,
view: Foo,
};

24
packages/playground/src/features/experiment/context.tsx
View File

@@ -1,4 +1,8 @@
import { CalulationResult, GraphNode } from '@bob-the-algorithm/core';
import {
AllPlugins,
CalulationResult,
GraphNode,
} from '@bob-the-algorithm/core';
import {
ReactNode,
createContext,
@@ -7,9 +11,11 @@ import {
useMemo,
useState,
} from 'react';
import { ExperimentInfo } from './types';
type ExperimentResult = {
payload: CalulationResult<any>;
payload: CalulationResult<AllPlugins>;
duration: number;
};
type ExperimentContextValue = {
@@ -22,9 +28,14 @@ type ExperimentContextValue = {
type ExperimentProviderProps = {
children: ReactNode;
worker: () => Worker;
experimentInfo: ExperimentInfo;
};
const createWorker = () =>
new Worker(new URL('./worker.ts', import.meta.url), {
type: 'module',
});
const ExperimentContext = createContext<ExperimentContextValue>({
loading: false,
selectNode: () => { },
@@ -32,7 +43,7 @@ const ExperimentContext = createContext<ExperimentContextValue>({
const ExperimentProvider: React.FC<ExperimentProviderProps> = ({
children,
worker,
experimentInfo,
}) => {
const [result, setResult] = useState<ExperimentResult>();
const [error, setError] = useState<any>();
@@ -49,7 +60,7 @@ const ExperimentProvider: React.FC<ExperimentProviderProps> = ({
setLoading(true);
setError(undefined);
setResult(undefined);
const workerInstance = worker();
const workerInstance = createWorker();
workerInstance.onmessage = (e) => {
switch (e.data.type) {
case 'error': {
@@ -69,13 +80,14 @@ const ExperimentProvider: React.FC<ExperimentProviderProps> = ({
};
workerInstance.postMessage({
type: 'run',
payload: experimentInfo,
});
};
run();
return () => {
workerInstance?.terminate();
};
}, [worker]);
}, [experimentInfo]);
const value = useMemo(
() => ({

15
packages/playground/src/features/experiment/create.tsx
View File

@@ -1,15 +0,0 @@
import { ReactNode } from 'react';
import { ExperimentProvider } from './context';
type CreateExperimentInput = {
worker: () => Worker;
view: ReactNode;
};
const createExperiment = (input: CreateExperimentInput) => {
return (
<ExperimentProvider worker={input.worker}>{input.view}</ExperimentProvider>
);
};
export { createExperiment };

12
packages/playground/src/features/experiment/hooks.ts
View File

@@ -6,6 +6,11 @@ const useExperimentResult = () => {
return result?.payload;
};
const useExperimentDuration = () => {
const { result } = useContext(ExperimentContext);
return result?.duration;
};
const useSelectNode = () => {
const { selectNode } = useContext(ExperimentContext);
return selectNode;
@@ -16,4 +21,9 @@ const useSelectedNode = () => {
return selectedNode;
};
export { useExperimentResult, useSelectNode, useSelectedNode };
export {
useExperimentResult,
useSelectNode,
useSelectedNode,
useExperimentDuration,
};

2
packages/playground/src/features/experiment/index.ts
View File

@@ -1,4 +1,2 @@
export { createWorker } from './worker';
export { ExperimentProvider as Experminent } from './context';
export { createExperiment } from './create';
export { useExperimentResult } from './hooks';

9
packages/playground/src/features/experiment/types.ts Normal file
View File

@@ -0,0 +1,9 @@
import { AllPlugins, PlanableWithPlugins } from '@bob-the-algorithm/core';
type ExperimentInfo = {
planables: PlanableWithPlugins<AllPlugins>[];
context: any;
start: number;
};
export type { ExperimentInfo };

55
packages/playground/src/features/experiment/worker.ts
View File

@@ -1,23 +1,38 @@
type WorkerFn = (...args: any[]) => any;
import { Bob, plugins } from '@bob-the-algorithm/core';
import { ExperimentInfo } from './types';
const createWorker = (fn: WorkerFn) => {
const run = async () => {
const startTime = performance.now();
try {
const result = await fn();
const endTime = performance.now();
const duration = endTime - startTime;
self.postMessage({ type: 'output', payload: result, duration });
} catch (error) {
self.postMessage({ type: 'error', payload: error });
}
};
self.addEventListener('message', (event) => {
const { type } = event.data;
if (type === 'run') {
run();
}
});
const MIN = 1000 * 60;
const getTravelTime = async () => 30 * MIN;
const transport = plugins.transport({
getTravelTime,
});
const run = async (payload: ExperimentInfo) => {
const startTime = performance.now();
try {
const bob = new Bob({
plugins: { transport, capabilities: plugins.capabilities() },
});
const result = await bob.run({
planables: payload.planables,
context: payload.context,
start: payload.start,
heuristic: ({ completed }) => completed.length >= 3,
});
const endTime = performance.now();
const duration = endTime - startTime;
self.postMessage({ type: 'output', payload: result, duration });
} catch (error) {
self.postMessage({ type: 'error', payload: error });
console.error(error);
}
};
export { createWorker };
self.addEventListener('message', (event) => {
const { type, payload } = event.data;
if (type === 'run') {
run(payload);
}
});

7
packages/playground/src/main.css → packages/playground/src/index.css
View File

@@ -1,3 +1,10 @@
@tailwind base;
@tailwind components;
@tailwind utilities;
html,
body,
#root,
#root > div {
height: 100%;
}

1
packages/playground/src/main.tsx
View File

@@ -1,4 +1,3 @@
import './main.css';
import React from 'react';
import ReactDOM from 'react-dom/client';
import { App } from './app.tsx';

53
packages/playground/src/pages/experiments.tsx Normal file
View File

@@ -0,0 +1,53 @@
import { useNavigate } from 'react-router-dom';
import { Card, CardBody, Button } from '@nextui-org/react';
type Experiment = {
title: string;
slug: string;
description: string;
};
const experiments: Experiment[] = [
{
title: 'Capabilities',
slug: 'capabilities',
description: 'Explore the capabilities of Bob.',
},
{
title: 'Packed day',
slug: 'realistic',
description: 'Explore the capabilities of Bob.',
},
];
const Experiments = () => {
const navigate = useNavigate();
return (
<div className="flex flex-col gap-4">
<h1 className="text-2xl font-bold">Experiments</h1>
{experiments.map(({ title, slug, description }) => (
<Card>
<CardBody>
<div className="flex justify-between items-center">
<div className="flex flex-col gap-2">
<p className="text-md">{title}</p>
<p className="text-sm">{description}</p>
</div>
<Button
color="primary"
radius="full"
size="sm"
variant="solid"
onPress={() => navigate(`/experiments/${slug}`)}
>
Show
</Button>
</div>
</CardBody>
</Card>
))}
</div>
);
};
export { Experiments as Page };

5
packages/playground/src/pages/index.tsx Normal file
View File

@@ -0,0 +1,5 @@
const Experiments = () => {
return <div>Welcome</div>;
};
export { Experiments as Page };

90
packages/playground/src/presenters/graph/index.tsx
View File

@@ -1,4 +1,4 @@
import { useMemo, useState } from 'react';
import { useMemo } from 'react';
import { GraphCanvas } from 'reagraph';
import { useExperimentResult } from '../../features/experiment';
import { convertResult } from '../../utils/graph';
@@ -17,7 +17,6 @@ const Graph: React.FC = () => {
}
return convertResult(data);
}, [data]);
const [visualize, setVisualize] = useState(false);
const selectedPath = useMemo(() => {
if (!selectedNode) {
return [];
@@ -45,52 +44,47 @@ const Graph: React.FC = () => {
return (
<>
Nodes count: {output.nodes.length}
<button onClick={() => setVisualize(!visualize)}>
{visualize ? 'Hide' : 'Show'} Visualize
</button>
{visualize && (
<div style={{ position: 'relative', height: '70vh' }}>
<GraphCanvas
{...output}
labelType="all"
layoutType="hierarchicalTd"
onNodeClick={(node) => {
if (node.id === selectedNode?.id) {
selectNode(undefined);
return;
}
const nextNode = data?.nodes.find((n) => n.id === node.id);
selectNode(nextNode);
}}
selections={selectedPath}
renderNode={({ size, opacity, node }) => {
let color = 'gray';
if (node.data?.deadEnd) {
color = 'red';
}
if (node.data?.completed) {
color = 'green';
}
if (node.data?.type === 'root') {
color = 'black';
}
return (
<group>
<mesh>
<circleGeometry attach="geometry" args={[size]} />
<meshBasicMaterial
attach="material"
color={color}
opacity={opacity}
transparent
/>
</mesh>
</group>
);
}}
/>
</div>
)}
<div style={{ position: 'relative', height: '70vh' }}>
<GraphCanvas
{...output}
labelType="all"
layoutType="hierarchicalTd"
onNodeClick={(node) => {
if (node.id === selectedNode?.id) {
selectNode(undefined);
return;
}
const nextNode = data?.nodes.find((n) => n.id === node.id);
selectNode(nextNode);
}}
selections={selectedPath}
renderNode={({ size, opacity, node }) => {
let color = 'gray';
if (node.data?.deadEnd) {
color = 'red';
}
if (node.data?.completed) {
color = 'green';
}
if (node.data?.type === 'root') {
color = 'black';
}
return (
<group>
<mesh>
<circleGeometry attach="geometry" args={[size]} />
<meshBasicMaterial
attach="material"
color={color}
opacity={opacity}
transparent
/>
</mesh>
</group>
);
}}
/>
</div>
</>
);
};

76
packages/playground/src/presenters/graph/plan.tsx
View File

@@ -1,76 +0,0 @@
import { GraphNode } from '@bob-the-algorithm/core';
import { useMemo } from 'react';
import { ConvertedResult } from '../../utils/graph';
import { format } from 'date-fns';
type PlanProps = {
id: string;
output: ConvertedResult;
};
type NodeProps = {
node: GraphNode;
output: ConvertedResult;
};
const Node = ({ node, output }: NodeProps) => {
const planable = useMemo(() => {
return node.planable
? output.result.planables.find((n) => n.id === node.planable)
: null;
}, [node, output]);
const time = useMemo(() => {
const start = new Date(node.time);
const end = new Date(start.getTime() + node.duration);
return (
<span>
{format(start, 'HH:mm')} - {format(end, 'HH:mm')}
</span>
);
}, [node.duration, node.time]);
if (planable) {
return (
<div>
{time} Planable: {planable!.id}
</div>
);
}
if (node.type === 'travel') {
return (
<div>
{time} Travel: {node.context.location}
</div>
);
}
return null;
};
const Plan: React.FC<PlanProps> = ({ id, output }) => {
const nodes = useMemo(() => {
const result: GraphNode[] = [];
let current = output.result.nodes.find((n) => n.id === id);
while (current) {
result.push(current);
if (!current.parent) {
break;
}
current = output.result.nodes.find((n) => n.id === current?.parent);
}
return result;
}, [id, output]);
return (
<>
{nodes.map((n) => (
<Node key={n.id} node={n} output={output} />
))}
</>
);
};
export { Plan };

90
packages/playground/src/presenters/horizontal-plan/index.tsx Normal file
View File

@@ -0,0 +1,90 @@
import { GraphNode } from '@bob-the-algorithm/core';
import { Popover, PopoverTrigger, PopoverContent } from '@nextui-org/react';
import { useExperimentResult } from '../../features/experiment';
import { useMemo } from 'react';
import { formatTime } from '../../utils/time';
type PlanProps = {
node: GraphNode;
};
const timespan = 24 * 60 * 60 * 1000;
const randomColor = () => Math.floor(Math.random() * 16777215).toString(16);
const HorizontalPlan: React.FC<PlanProps> = ({ node }) => {
const data = useExperimentResult();
const nodes = useMemo(() => {
if (!data) {
return [];
}
const result: GraphNode[] = [];
let current = node;
if (!current) {
return [];
}
while (current) {
result.push(current);
if (!current.parent) {
break;
}
current = data.nodes.find((n) => n.id === current?.parent)!;
}
return result;
}, [data, node]);
if (!data) {
return null;
}
return (
<div className="w-full min-h-unit-6 rounded-lg bg-gray-900 relative">
{nodes.map((node) => {
const time = (
<span>
{formatTime(node.time)} - {formatTime(node.time + node.duration)}
</span>
);
let title = '';
if (node.planable) {
const planable = data!.planables.find((n) => n.id === node.planable);
title = `Planable: ${planable?.id}`;
}
if (node.type === 'travel') {
title = `Travel: ${node.context.location}`;
}
return (
<div
className="absolute top-0 bottom-0 h-full left-0 right-0 p-[2px] flex items-stretch justify-stretch"
style={{
left: `${(node.time / timespan) * 100}%`,
width: `${(node.duration / timespan) * 100}%`,
}}
>
<Popover placement="bottom" showArrow>
<PopoverTrigger>
<div
className="flex-1 rounded-[2px]"
style={{
left: `${(node.time / timespan) * 100}%`,
width: `${(node.duration / timespan) * 100}%`,
backgroundColor: `#${randomColor()}`,
}}
/>
</PopoverTrigger>
<PopoverContent>
<div className="px-1 py-2">
<div className="text-small font-bold">{title}</div>
<div className="text-tiny">{time}</div>
</div>
</PopoverContent>
</Popover>
</div>
);
})}
</div>
);
};
export { HorizontalPlan };

96
packages/playground/src/presenters/plan/index.tsx
View File

@@ -1,60 +1,18 @@
import { GraphNode } from '@bob-the-algorithm/core';
import { useMemo } from 'react';
import { convertResult } from '../../utils/graph';
import { format } from 'date-fns';
import { Listbox, ListboxItem, cn } from '@nextui-org/react';
import { useExperimentResult } from '../../features/experiment';
import { useSelectNode } from '../../features/experiment/hooks';
import { formatTime } from '../../utils/time';
type PlanProps = {
node: GraphNode;
onSelect: (node: GraphNode) => void;
};
type NodeProps = {
node: GraphNode;
};
const Node = ({ node }: NodeProps) => {
const selectNode = useSelectNode();
const Plan: React.FC<PlanProps> = ({ node, onSelect }) => {
const data = useExperimentResult();
const planable = useMemo(() => {
return node.planable
? data?.planables.find((n) => n.id === node.planable)
: null;
}, [node, data]);
const time = useMemo(() => {
const start = new Date(node.time);
const end = new Date(start.getTime() + node.duration);
return (
<span>
{format(start, 'HH:mm')} - {format(end, 'HH:mm')}
</span>
);
}, [node.duration, node.time]);
if (planable) {
return (
<div onClick={() => selectNode(node)}>
{time} Planable: {planable!.id}
</div>
);
}
if (node.type === 'travel') {
return (
<div onClick={() => selectNode(node)}>
{time} Travel: {node.context.location}
</div>
);
}
return null;
};
const Plan: React.FC<PlanProps> = ({ node }) => {
const data = useExperimentResult();
const output = useMemo(() => (data ? convertResult(data) : null), [data]);
const nodes = useMemo(() => {
if (!output) {
if (!data) {
return [];
}
const result: GraphNode[] = [];
@@ -68,22 +26,48 @@ const Plan: React.FC<PlanProps> = ({ node }) => {
if (!current.parent) {
break;
}
current = output.result.nodes.find((n) => n.id === current?.parent)!;
current = data.nodes.find((n) => n.id === current?.parent)!;
}
return result;
}, [output, node]);
return result.reverse();
}, [data, node]);
if (!output) {
if (!data) {
return null;
}
return (
<>
{nodes.map((n) => (
<Node key={n.id} node={n} />
))}
</>
<Listbox
variant="flat"
aria-label="Listbox menu with descriptions"
items={nodes}
>
{(node) => {
const time = (
<span>
{formatTime(node.time)} - {formatTime(node.time + node.duration)}
</span>
);
let title = '';
if (node.planable) {
const planable = data!.planables.find((n) => n.id === node.planable);
title = `Planable: ${planable?.id}`;
}
if (node.type === 'travel') {
title = `Travel: ${node.context.location}`;
}
return (
<ListboxItem
key={node.id}
className={cn({ selected: node.id === node.id })}
onClick={() => onSelect(node)}
description={time}
>
{title}
</ListboxItem>
);
}}
</Listbox>
);
};

18
packages/playground/src/router/index.tsx Normal file
View File

@@ -0,0 +1,18 @@
import { createHashRouter, RouterProvider } from 'react-router-dom';
import { pages } from '../containers/page';
import { experiments } from '../containers/experiment';
const router = createHashRouter([
{
path: '/',
children: pages,
},
{
path: '/experiments',
children: experiments,
},
]);
const Router = () => <RouterProvider router={router} />;
export { Router };

8
packages/playground/src/utils/experiments.ts
View File

@@ -1,8 +0,0 @@
const imports = import.meta.glob('../experiments/*/index.tsx');
const experiments = Object.entries(imports).map(([path, loader]) => {
const slug = path.replace('./experiments/', '').replace('/index.tsx', '');
return { slug, loader };
});
export { experiments };

8
packages/playground/src/utils/graph.ts
View File

@@ -1,4 +1,4 @@
import { CalulationResult } from '@bob-the-algorithm/core';
import { AllPlugins, CalulationResult } from '@bob-the-algorithm/core';
function msToHMS(ms: number) {
// 1- Convert to seconds:
@@ -12,13 +12,13 @@ function msToHMS(ms: number) {
seconds = seconds % 60;
return hours + ':' + minutes + ':' + seconds;
}
const convertResult = (result: CalulationResult<any>) => {
const convertResult = (result: CalulationResult<AllPlugins>) => {
const nodes = result.nodes.map((node) => {
let label = `root (${node.location})`;
let label = `root (${node.context.location})`;
if (node.type === 'planable') {
label = `task: ${node.planable!.toString()}`;
} else if (node.type === 'travel') {
label = `travel->${node.location}`;
label = `travel->${node.context.location}`;
}
return {
id: node.id,

6
packages/playground/src/utils/time.ts Normal file
View File

@@ -0,0 +1,6 @@
const formatTime = (time: number) => {
const toUtc = new Date(time).toUTCString();
return toUtc.slice(17, 22);
};
export { formatTime };

6
packages/playground/tailwind.config.js
View File

@@ -1,11 +1,15 @@
/** @type {import('tailwindcss').Config} */
const path = require('path');
const { nextui } = require('@nextui-org/react');
const themePath = require.resolve('@nextui-org/theme/package.json');
const themeDir = path.dirname(themePath);
export default {
content: [
'./index.html',
'./src/**/*.{js,ts,jsx,tsx}',
'./node_modules/@nextui-org/theme/dist/**/*.{js,ts,jsx,tsx}',
`${themeDir}/dist/**/*.{js,ts,jsx,tsx}`,
],
theme: {
extend: {},

1
packages/playground/tsconfig.node.tsbuildinfo
View File

File diff suppressed because one or more lines are too long

2
packages/playground/vite.config.d.ts vendored
View File

@@ -1,2 +0,0 @@
declare const _default: import("vite").UserConfig;
export default _default;

8
packages/playground/vite.config.js
View File

@@ -1,9 +1,11 @@
import { defineConfig } from 'vite';
import react from '@vitejs/plugin-react-swc';
import mdx from '@mdx-js/rollup';
var ASSET_URL = process.env.ASSET_URL || '';
const ASSET_URL = process.env.ASSET_URL || '';
// https://vitejs.dev/config/
export default defineConfig({
base: ASSET_URL,
plugins: [mdx(), react()],
base: ASSET_URL,
plugins: [mdx(), react()],
});

11
packages/playground/vite.config.ts
View File

@@ -1,11 +0,0 @@
import { defineConfig } from 'vite';
import react from '@vitejs/plugin-react-swc';
import mdx from '@mdx-js/rollup';
const ASSET_URL = process.env.ASSET_URL || '';
// https://vitejs.dev/config/
export default defineConfig({
base: ASSET_URL,
plugins: [mdx(), react()],
});