djkato/saleor-dashboard
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Fix fonts for safari & order settings page (#3316)

Browse source
This commit is contained in:
Krzysztof Żuraw 2023-03-10 10:38:14 +01:00 committed by GitHub
parent 228fe4d802
commit 71d5ac3992
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
7 changed files with 4626 additions and 13640 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

19
locale/defaultMessages.json
View file

@ -1920,10 +1920,6 @@
"context": "refund type", "context": "refund type",
"string": "Refund Products" "string": "Refund Products"
}, },
"CLYlsu": {
"context": "section header",
"string": "Settings"
},
"CLeDae": { "CLeDae": {
"context": "section header", "context": "section header",
"string": "Preferences" "string": "Preferences"
@ -2226,6 +2222,10 @@
"context": "button label", "context": "button label",
"string": "Assign references" "string": "Assign references"
}, },
"EewziG": {
"context": "checkbox gift cards label description",
"string": "When activated non-shippable gift cards will be automatically set as fulfilled and sent to customer"
},
"Egyh2T": { "Egyh2T": {
"context": "section header", "context": "section header",
"string": "Plugin Settings" "string": "Plugin Settings"
@ -3488,10 +3488,6 @@
"context": "content section name", "context": "content section name",
"string": "Content" "string": "Content"
}, },
"Nfh9QM": {
"context": "checkbox gift cards label description",
"string": "when activated non-shippable gift cards will be automatically set as fulfilled and sent to customer"
},
"NgCb99": { "NgCb99": {
"context": "order line discount updated title", "context": "order line discount updated title",
"string": "{productName} discount was updated by" "string": "{productName} discount was updated by"
@ -6633,6 +6629,10 @@
"context": "replacement created order history message draft number", "context": "replacement created order history message draft number",
"string": "Draft #{orderNumber}" "string": "Draft #{orderNumber}"
}, },
"kn7jjd": {
"context": "section header",
"string": "General settings"
},
"kp2IYP": { "kp2IYP": {
"context": "option", "context": "option",
"string": "Gift card product type" "string": "Gift card product type"
@ -8472,9 +8472,6 @@
"context": "channel publication status", "context": "channel publication status",
"string": "Published" "string": "Published"
}, },
"yuiyES": {
"string": "General Settings"
},
"yzYXW/": { "yzYXW/": {
"context": "header, dialog", "context": "header, dialog",
"string": "Create New Warehouse" "string": "Create New Warehouse"

18110
package-lock.json generated
View file

File diff suppressed because it is too large Load diff

2
package.json
View file

@ -33,7 +33,7 @@
"@material-ui/lab": "^4.0.0-alpha.61", "@material-ui/lab": "^4.0.0-alpha.61",
"@material-ui/styles": "^4.11.4", "@material-ui/styles": "^4.11.4",
"@reach/auto-id": "^0.16.0", "@reach/auto-id": "^0.16.0",
"@saleor/macaw-ui": "^0.8.0-pre.34", "@saleor/macaw-ui": "^0.8.0-pre.43",
"@saleor/sdk": "^0.4.4", "@saleor/sdk": "^0.4.4",
"@sentry/react": "^6.0.0", "@sentry/react": "^6.0.0",
"@types/faker": "^5.1.6", "@types/faker": "^5.1.6",

2
src/components/Datagrid/styles.ts
View file

@ -195,7 +195,7 @@ export function useDatagridTheme() {
bgBubbleSelected: theme.palette.background.paper, bgBubbleSelected: theme.palette.background.paper,
textHeader: theme.palette.text.secondary, textHeader: theme.palette.text.secondary,
borderColor: theme.palette.divider, borderColor: theme.palette.divider,
fontFamily: themes.defaultLight.fontFamily.body, fontFamily: "'Inter var', sans-serif",
baseFontStyle: themes.defaultLight.fontSize.bodySmall, baseFontStyle: themes.defaultLight.fontSize.bodySmall,
headerFontStyle: themes.defaultLight.fontSize.bodySmall, headerFontStyle: themes.defaultLight.fontSize.bodySmall,
editorFontSize: themes.defaultLight.fontSize.bodySmall, editorFontSize: themes.defaultLight.fontSize.bodySmall,

43
src/orders/components/OrderFulfillmentSettings/OrderFulfillmentSettings.tsx
View file

@ -1,7 +1,8 @@
import CardTitle from "@dashboard/components/CardTitle"; import CardTitle from "@dashboard/components/CardTitle";
import ControlledCheckbox from "@dashboard/components/ControlledCheckbox"; import ControlledCheckbox from "@dashboard/components/ControlledCheckbox";
import FormSpacer from "@dashboard/components/FormSpacer"; import FormSpacer from "@dashboard/components/FormSpacer";
import { Card, CardContent, Typography } from "@material-ui/core"; import { Card, CardContent } from "@material-ui/core";
import { Box, Text } from "@saleor/macaw-ui/next";
import React from "react"; import React from "react";
import { FormattedMessage, useIntl } from "react-intl"; import { FormattedMessage, useIntl } from "react-intl";
@ -33,20 +34,22 @@ const OrderFulfillmentSettings: React.FC<OrderFulfillmentSettingsProps> = ({
<ControlledCheckbox <ControlledCheckbox
name={"fulfillmentAutoApprove" as keyof OrderSettingsFormData} name={"fulfillmentAutoApprove" as keyof OrderSettingsFormData}
label={ label={
<> <Box display="flex" flexDirection="column">
<FormattedMessage <Text>
id="05hqq6" <FormattedMessage
defaultMessage="Automatically approve all fulfillments" id="05hqq6"
description="checkbox label" defaultMessage="Automatically approve all fulfillments"
/> description="checkbox label"
<Typography variant="caption"> />
</Text>
<Text variant="caption" color="textNeutralSubdued">
<FormattedMessage <FormattedMessage
id="XwQQ1f" id="XwQQ1f"
defaultMessage="All fulfillments will be automatically approved" defaultMessage="All fulfillments will be automatically approved"
description="checkbox label description" description="checkbox label description"
/> />
</Typography> </Text>
</> </Box>
} }
checked={data.fulfillmentAutoApprove} checked={data.fulfillmentAutoApprove}
onChange={onChange} onChange={onChange}
@ -57,20 +60,22 @@ const OrderFulfillmentSettings: React.FC<OrderFulfillmentSettingsProps> = ({
<ControlledCheckbox <ControlledCheckbox
name={"fulfillmentAllowUnpaid" as keyof OrderSettingsFormData} name={"fulfillmentAllowUnpaid" as keyof OrderSettingsFormData}
label={ label={
<> <Box display="flex" flexDirection="column">
<FormattedMessage <Text>
id="2MKkgX" <FormattedMessage
defaultMessage="Allow fulfillment without payment" id="2MKkgX"
description="checkbox label" defaultMessage="Allow fulfillment without payment"
/> description="checkbox label"
<Typography variant="caption"> />
</Text>
<Text variant="caption" color="textNeutralSubdued">
<FormattedMessage <FormattedMessage
id="l9ETHu" id="l9ETHu"
defaultMessage="You will be able to fulfill products without capturing payment for the order." defaultMessage="You will be able to fulfill products without capturing payment for the order."
description="checkbox label description" description="checkbox label description"
/> />
</Typography> </Text>
</> </Box>
} }
checked={data.fulfillmentAllowUnpaid} checked={data.fulfillmentAllowUnpaid}
onChange={onChange} onChange={onChange}

51
src/orders/components/OrderSettings/OrderSettings.tsx
View file

@ -1,7 +1,8 @@
import CardSpacer from "@dashboard/components/CardSpacer"; import CardSpacer from "@dashboard/components/CardSpacer";
import CardTitle from "@dashboard/components/CardTitle"; import CardTitle from "@dashboard/components/CardTitle";
import ControlledCheckbox from "@dashboard/components/ControlledCheckbox"; import ControlledCheckbox from "@dashboard/components/ControlledCheckbox";
import { Card, CardContent, Typography } from "@material-ui/core"; import { Card, CardContent } from "@material-ui/core";
import { Box, Text } from "@saleor/macaw-ui/next";
import React from "react"; import React from "react";
import { FormattedMessage, useIntl } from "react-intl"; import { FormattedMessage, useIntl } from "react-intl";
@ -24,8 +25,8 @@ const OrderSettings: React.FC<OrderSettingsProps> = ({
<Card data-test-id="order-settings"> <Card data-test-id="order-settings">
<CardTitle <CardTitle
title={intl.formatMessage({ title={intl.formatMessage({
id: "CLYlsu", id: "kn7jjd",
defaultMessage: "Settings", defaultMessage: "General settings",
description: "section header", description: "section header",
})} })}
/> />
@ -33,20 +34,22 @@ const OrderSettings: React.FC<OrderSettingsProps> = ({
<ControlledCheckbox <ControlledCheckbox
name="automaticallyConfirmAllNewOrders" name="automaticallyConfirmAllNewOrders"
label={ label={
<> <Box display="flex" flexDirection="column">
<FormattedMessage <Text>
id="RLYfMF" <FormattedMessage
defaultMessage="Automatically confirm all orders" id="RLYfMF"
description="checkbox label" defaultMessage="Automatically confirm all orders"
/> description="checkbox label"
<Typography variant="caption"> />
</Text>
<Text variant="caption" color="textNeutralSubdued">
<FormattedMessage <FormattedMessage
id="wpAXKX" id="wpAXKX"
defaultMessage="All orders will be automatically confirmed and all payments will be captured." defaultMessage="All orders will be automatically confirmed and all payments will be captured."
description="checkbox label description" description="checkbox label description"
/> />
</Typography> </Text>
</> </Box>
} }
checked={data.automaticallyConfirmAllNewOrders} checked={data.automaticallyConfirmAllNewOrders}
onChange={onChange} onChange={onChange}
@ -57,20 +60,22 @@ const OrderSettings: React.FC<OrderSettingsProps> = ({
<ControlledCheckbox <ControlledCheckbox
name="automaticallyFulfillNonShippableGiftCard" name="automaticallyFulfillNonShippableGiftCard"
label={ label={
<> <Box display="flex" flexDirection="column">
<FormattedMessage <Text>
id="7UG1Lx"
defaultMessage="Automatically fulfill non shippable gift cards"
description="checkbox gift cards label"
/>
<Typography variant="caption">
<FormattedMessage <FormattedMessage
id="Nfh9QM" id="7UG1Lx"
defaultMessage="when activated non-shippable gift cards will be automatically set as fulfilled and sent to customer" defaultMessage="Automatically fulfill non shippable gift cards"
description="checkbox gift cards label"
/>
</Text>
<Text variant="caption" color="textNeutralSubdued">
<FormattedMessage
id="EewziG"
defaultMessage="When activated non-shippable gift cards will be automatically set as fulfilled and sent to customer"
description="checkbox gift cards label description" description="checkbox gift cards label description"
/> />
</Typography> </Text>
</> </Box>
} }
checked={data.automaticallyFulfillNonShippableGiftCard} checked={data.automaticallyFulfillNonShippableGiftCard}
onChange={onChange} onChange={onChange}

39
src/orders/components/OrderSettingsPage/OrderSettingsPage.tsx
View file

@ -1,5 +1,4 @@
import { TopNav } from "@dashboard/components/AppLayout/TopNav"; import { TopNav } from "@dashboard/components/AppLayout/TopNav";
import Grid from "@dashboard/components/Grid";
import { DetailPageLayout } from "@dashboard/components/Layouts"; import { DetailPageLayout } from "@dashboard/components/Layouts";
import Savebar from "@dashboard/components/Savebar"; import Savebar from "@dashboard/components/Savebar";
import { import {
@ -9,11 +8,10 @@ import {
import { SubmitPromise } from "@dashboard/hooks/useForm"; import { SubmitPromise } from "@dashboard/hooks/useForm";
import useNavigator from "@dashboard/hooks/useNavigator"; import useNavigator from "@dashboard/hooks/useNavigator";
import { orderListUrl } from "@dashboard/orders/urls"; import { orderListUrl } from "@dashboard/orders/urls";
import { Typography } from "@material-ui/core";
import { ConfirmButtonTransitionState } from "@saleor/macaw-ui"; import { ConfirmButtonTransitionState } from "@saleor/macaw-ui";
import { Box } from "@saleor/macaw-ui/next"; import { Box } from "@saleor/macaw-ui/next";
import React from "react"; import React from "react";
import { FormattedMessage, useIntl } from "react-intl"; import { useIntl } from "react-intl";
import OrderFulfillmentSettings from "../OrderFulfillmentSettings"; import OrderFulfillmentSettings from "../OrderFulfillmentSettings";
import OrderSettings from "../OrderSettings/OrderSettings"; import OrderSettings from "../OrderSettings/OrderSettings";
@ -41,7 +39,7 @@ const OrderSettingsPage: React.FC<OrderSettingsPageProps> = props => {
disabled={disabled} disabled={disabled}
> >
{({ data, submit, change, isSaveDisabled }) => ( {({ data, submit, change, isSaveDisabled }) => (
<DetailPageLayout> <DetailPageLayout gridTemplateColumns={1}>
<TopNav <TopNav
href={orderListUrl()} href={orderListUrl()}
title={intl.formatMessage({ title={intl.formatMessage({
@ -51,28 +49,17 @@ const OrderSettingsPage: React.FC<OrderSettingsPageProps> = props => {
})} })}
/> />
<DetailPageLayout.Content> <DetailPageLayout.Content>
<Box padding={9} margin="auto" height="100vh"> <Box margin="auto" height="100vh">
<Grid variant="inverted"> <OrderSettings
<div> data={data}
<Typography> disabled={disabled}
<FormattedMessage onChange={change}
id="yuiyES" />
defaultMessage="General Settings" <OrderFulfillmentSettings
/> data={data}
</Typography> disabled={disabled}
</div> onChange={change}
<OrderSettings />
data={data}
disabled={disabled}
onChange={change}
/>
<div />
<OrderFulfillmentSettings
data={data}
disabled={disabled}
onChange={change}
/>
</Grid>
</Box> </Box>
</DetailPageLayout.Content> </DetailPageLayout.Content>
<Savebar <Savebar