feat: exporting redesign (#3613)

Co-authored-by: Aakansha Doshi <aakansha1216@gmail.com>
This commit is contained in:
David Luzar 2021-05-25 21:37:14 +02:00 committed by GitHub
parent 357266e9ab
commit 790c9fd02e
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
25 changed files with 793 additions and 385 deletions

View file

@ -11,7 +11,8 @@ import { t } from "../i18n";
import { useIsMobile } from "../components/App";
import { KEYS } from "../keys";
import { register } from "./register";
import { supported } from "browser-fs-access";
import { supported as fsSupported } from "browser-fs-access";
import { CheckboxItem } from "../components/CheckboxItem";
export const actionChangeProjectName = register({
name: "changeProjectName",
@ -40,14 +41,12 @@ export const actionChangeExportBackground = register({
};
},
PanelComponent: ({ appState, updateData }) => (
<label>
<input
type="checkbox"
checked={appState.exportBackground}
onChange={(event) => updateData(event.target.checked)}
/>{" "}
<CheckboxItem
checked={appState.exportBackground}
onChange={(checked) => updateData(checked)}
>
{t("labels.withBackground")}
</label>
</CheckboxItem>
),
});
@ -60,17 +59,15 @@ export const actionChangeExportEmbedScene = register({
};
},
PanelComponent: ({ appState, updateData }) => (
<label style={{ display: "flex" }}>
<input
type="checkbox"
checked={appState.exportEmbedScene}
onChange={(event) => updateData(event.target.checked)}
/>{" "}
<CheckboxItem
checked={appState.exportEmbedScene}
onChange={(checked) => updateData(checked)}
>
{t("labels.exportEmbedScene")}
<Tooltip label={t("labels.exportEmbedScene_details")} long={true}>
<div className="TooltipIcon">{questionCircle}</div>
<div className="Tooltip-icon">{questionCircle}</div>
</Tooltip>
</label>
</CheckboxItem>
),
});
@ -83,14 +80,12 @@ export const actionChangeShouldAddWatermark = register({
};
},
PanelComponent: ({ appState, updateData }) => (
<label>
<input
type="checkbox"
checked={appState.shouldAddWatermark}
onChange={(event) => updateData(event.target.checked)}
/>{" "}
<CheckboxItem
checked={appState.shouldAddWatermark}
onChange={(checked) => updateData(checked)}
>
{t("labels.addWatermark")}
</label>
</CheckboxItem>
),
});
@ -126,11 +121,10 @@ export const actionSaveScene = register({
event.key === KEYS.S && event[KEYS.CTRL_OR_CMD] && !event.shiftKey,
PanelComponent: ({ updateData }) => (
<ToolButton
type="button"
type="icon"
icon={save}
title={t("buttons.save")}
aria-label={t("buttons.save")}
showAriaLabel={useIsMobile()}
onClick={() => updateData(null)}
data-testid="save-button"
/>
@ -162,7 +156,7 @@ export const actionSaveAsScene = register({
title={t("buttons.saveAs")}
aria-label={t("buttons.saveAs")}
showAriaLabel={useIsMobile()}
hidden={!supported}
hidden={!fsSupported}
onClick={() => updateData(null)}
data-testid="save-as-button"
/>