2020-04-20 11:14:46 +02:00
|
|
|
|
import { FunctionalComponent, h } from "preact";
|
2020-04-22 22:07:52 +02:00
|
|
|
|
import style from "./style.module.css";
|
2020-04-20 11:14:46 +02:00
|
|
|
|
import { route } from 'preact-router';
|
|
|
|
|
import { base58UUID } from '../../util/uuid';
|
2020-04-20 14:07:26 +02:00
|
|
|
|
import { useStoredProjectList } from "../../hooks/use-stored-project-list";
|
2020-04-20 11:14:46 +02:00
|
|
|
|
|
|
|
|
|
const Home: FunctionalComponent = () => {
|
2020-04-20 14:07:26 +02:00
|
|
|
|
const [ projects, refreshProjects ] = useStoredProjectList();
|
2020-04-20 11:14:46 +02:00
|
|
|
|
|
|
|
|
|
const openNewProject = () => {
|
|
|
|
|
const uuid = base58UUID();
|
|
|
|
|
route(`/p/${uuid}`);
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
return (
|
|
|
|
|
<div class={`container ${style.home}`}>
|
|
|
|
|
<div class="columns">
|
|
|
|
|
<div class="column">
|
|
|
|
|
<div class="buttons is-right">
|
|
|
|
|
<button class="button is-primary"
|
|
|
|
|
onClick={openNewProject}>
|
|
|
|
|
<strong>+</strong> Nouveau projet
|
|
|
|
|
</button>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="panel">
|
|
|
|
|
<p class="panel-heading">
|
|
|
|
|
Mes projets
|
|
|
|
|
</p>
|
2020-04-20 14:07:26 +02:00
|
|
|
|
{/* <div class="panel-block">
|
2020-04-20 11:14:46 +02:00
|
|
|
|
<p class="control has-icons-left">
|
|
|
|
|
<input class="input" type="text" placeholder="Search" />
|
|
|
|
|
<span class="icon is-left">🔍</span>
|
|
|
|
|
</p>
|
2020-04-20 14:07:26 +02:00
|
|
|
|
</div> */}
|
|
|
|
|
{
|
|
|
|
|
projects.map(p => (
|
|
|
|
|
<a class="panel-block" href={`/p/${p.id}`}>
|
|
|
|
|
<span class="panel-icon">🗒️</span>
|
|
|
|
|
{ p.label ? p.label : "Projet sans nom" }
|
|
|
|
|
</a>
|
|
|
|
|
))
|
|
|
|
|
}
|
|
|
|
|
{
|
|
|
|
|
projects.length === 0 ?
|
|
|
|
|
<p class="panel-block">
|
|
|
|
|
<div class={style.noProjects}>Aucun project pour l'instant.</div>
|
|
|
|
|
</p> :
|
|
|
|
|
null
|
|
|
|
|
}
|
2020-04-20 11:14:46 +02:00
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
);
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
export default Home;
|