update: add a second New from template action to FileMenu
This commit is contained in:
committed by
Nicolás Hatcher Andrés
parent
6a3e37f4c1
commit
0b925a4d6a
@@ -102,6 +102,10 @@ function App() {
|
|||||||
setModel(newModel);
|
setModel(newModel);
|
||||||
}}
|
}}
|
||||||
newModel={() => {
|
newModel={() => {
|
||||||
|
const createdModel = createNewModel();
|
||||||
|
setModel(createdModel);
|
||||||
|
}}
|
||||||
|
newModelFromTemplate={() => {
|
||||||
setShowWelcomeDialog(true);
|
setShowWelcomeDialog(true);
|
||||||
}}
|
}}
|
||||||
setModel={(uuid: string) => {
|
setModel={(uuid: string) => {
|
||||||
|
|||||||
@@ -27,6 +27,7 @@ function useWindowWidth() {
|
|||||||
export function FileBar(properties: {
|
export function FileBar(properties: {
|
||||||
model: Model;
|
model: Model;
|
||||||
newModel: () => void;
|
newModel: () => void;
|
||||||
|
newModelFromTemplate: () => void;
|
||||||
setModel: (key: string) => void;
|
setModel: (key: string) => void;
|
||||||
onModelUpload: (blob: ArrayBuffer, fileName: string) => Promise<void>;
|
onModelUpload: (blob: ArrayBuffer, fileName: string) => Promise<void>;
|
||||||
onDelete: () => void;
|
onDelete: () => void;
|
||||||
@@ -52,6 +53,7 @@ export function FileBar(properties: {
|
|||||||
<Divider />
|
<Divider />
|
||||||
<FileMenu
|
<FileMenu
|
||||||
newModel={properties.newModel}
|
newModel={properties.newModel}
|
||||||
|
newModelFromTemplate={properties.newModelFromTemplate}
|
||||||
setModel={properties.setModel}
|
setModel={properties.setModel}
|
||||||
onModelUpload={properties.onModelUpload}
|
onModelUpload={properties.onModelUpload}
|
||||||
onDownload={async () => {
|
onDownload={async () => {
|
||||||
|
|||||||
@@ -1,6 +1,6 @@
|
|||||||
import styled from "@emotion/styled";
|
import styled from "@emotion/styled";
|
||||||
import { Menu, MenuItem, Modal } from "@mui/material";
|
import { Menu, MenuItem, Modal } from "@mui/material";
|
||||||
import { Check, FileDown, FileUp, Plus, Trash2 } from "lucide-react";
|
import { Check, FileDown, FileUp, Plus, Table2, Trash2 } from "lucide-react";
|
||||||
import { useRef, useState } from "react";
|
import { useRef, useState } from "react";
|
||||||
import DeleteWorkbookDialog from "./DeleteWorkbookDialog";
|
import DeleteWorkbookDialog from "./DeleteWorkbookDialog";
|
||||||
import UploadFileDialog from "./UploadFileDialog";
|
import UploadFileDialog from "./UploadFileDialog";
|
||||||
@@ -8,6 +8,7 @@ import { getModelsMetadata, getSelectedUuid } from "./storage";
|
|||||||
|
|
||||||
export function FileMenu(props: {
|
export function FileMenu(props: {
|
||||||
newModel: () => void;
|
newModel: () => void;
|
||||||
|
newModelFromTemplate: () => void;
|
||||||
setModel: (key: string) => void;
|
setModel: (key: string) => void;
|
||||||
onDownload: () => void;
|
onDownload: () => void;
|
||||||
onModelUpload: (blob: ArrayBuffer, fileName: string) => Promise<void>;
|
onModelUpload: (blob: ArrayBuffer, fileName: string) => Promise<void>;
|
||||||
@@ -92,7 +93,18 @@ export function FileMenu(props: {
|
|||||||
<StyledIcon>
|
<StyledIcon>
|
||||||
<Plus />
|
<Plus />
|
||||||
</StyledIcon>
|
</StyledIcon>
|
||||||
<MenuItemText>New</MenuItemText>
|
<MenuItemText>New blank workbook</MenuItemText>
|
||||||
|
</MenuItemWrapper>
|
||||||
|
<MenuItemWrapper
|
||||||
|
onClick={() => {
|
||||||
|
props.newModelFromTemplate();
|
||||||
|
setMenuOpen(false);
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<StyledIcon>
|
||||||
|
<Table2 />
|
||||||
|
</StyledIcon>
|
||||||
|
<MenuItemText>New from template</MenuItemText>
|
||||||
</MenuItemWrapper>
|
</MenuItemWrapper>
|
||||||
<MenuItemWrapper
|
<MenuItemWrapper
|
||||||
onClick={() => {
|
onClick={() => {
|
||||||
@@ -105,6 +117,7 @@ export function FileMenu(props: {
|
|||||||
</StyledIcon>
|
</StyledIcon>
|
||||||
<MenuItemText>Import</MenuItemText>
|
<MenuItemText>Import</MenuItemText>
|
||||||
</MenuItemWrapper>
|
</MenuItemWrapper>
|
||||||
|
<MenuDivider />
|
||||||
<MenuItemWrapper onClick={props.onDownload}>
|
<MenuItemWrapper onClick={props.onDownload}>
|
||||||
<StyledIcon>
|
<StyledIcon>
|
||||||
<FileDown />
|
<FileDown />
|
||||||
|
|||||||
@@ -8,9 +8,7 @@ function WelcomeDialog(properties: {
|
|||||||
onClose: () => void;
|
onClose: () => void;
|
||||||
onSelectTemplate: (templateId: string) => void;
|
onSelectTemplate: (templateId: string) => void;
|
||||||
}) {
|
}) {
|
||||||
const [selectedTemplate, setSelectedTemplate] = useState<string>(
|
const [selectedTemplate, setSelectedTemplate] = useState<string>("blank");
|
||||||
"blank",
|
|
||||||
);
|
|
||||||
|
|
||||||
const handleClose = () => {
|
const handleClose = () => {
|
||||||
properties.onClose();
|
properties.onClose();
|
||||||
@@ -74,7 +72,9 @@ function WelcomeDialog(properties: {
|
|||||||
</TemplatesListWrapper>
|
</TemplatesListWrapper>
|
||||||
</DialogContent>
|
</DialogContent>
|
||||||
<DialogFooter>
|
<DialogFooter>
|
||||||
<DialogFooterButton onClick={() => properties.onSelectTemplate(selectedTemplate)}>
|
<DialogFooterButton
|
||||||
|
onClick={() => properties.onSelectTemplate(selectedTemplate)}
|
||||||
|
>
|
||||||
Create workbook
|
Create workbook
|
||||||
</DialogFooterButton>
|
</DialogFooterButton>
|
||||||
</DialogFooter>
|
</DialogFooter>
|
||||||
|
|||||||
Reference in New Issue
Block a user