webstudio/ui/src/features/select_project/presentation/select_project.tsx
2023-11-20 00:48:40 +03:00

43 lines
1.5 KiB
TypeScript

import * as React from "react";
import { observer } from "mobx-react-lite";
import { LoadPage } from "../../../core/ui/pages/load_page";
import { CreateProjectScreenPath } from "../../create_project/create_project_screen";
import { SelectProjectStore } from "./select_project_store";
import { SelectProjectRepository } from "../data/select_project_repository";
import { useNavigate } from "react-router-dom";
import { CreateProjectInstancePath } from "../../create_project_instance/create_project_instance";
import { Button } from "antd";
export const SelectProjectScreenPath = "/select_project";
export const SelectProjectScreen: React.FunctionComponent = observer(() => {
const [selectProjectStore] = React.useState(
() => new SelectProjectStore(new SelectProjectRepository())
);
const navigate = useNavigate();
return (
<>
<LoadPage
path={CreateProjectScreenPath}
largeText={"Select project"}
minText={"add new project?"}
isLoading={selectProjectStore.isLoading}
isError={selectProjectStore.isError}
children={selectProjectStore.projects.map((el) => {
return (
<>
<div>{el.description}</div>
<div>
<Button
onClick={() => navigate(CreateProjectInstancePath + el._id)}
>
create instance
</Button>
</div>
</>
);
})}
/>
</>
);
});