Skip to content

Commit

Permalink
Merge branch 'next' into admin-gen-configurable_support-nested
Browse files Browse the repository at this point in the history
  • Loading branch information
Ben-Ho committed Feb 23, 2024
2 parents 357f7f5 + 16913ff commit a3cf65a
Show file tree
Hide file tree
Showing 189 changed files with 3,890 additions and 2,332 deletions.
5 changes: 5 additions & 0 deletions .changeset/atlantic-scallop-fisherman
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
---
"@comet/cms-api": patch
---

API Generator: Disable input generation if `create` and `update` are set to `false` in the decorator
5 changes: 0 additions & 5 deletions .changeset/big-items-serve.md

This file was deleted.

5 changes: 5 additions & 0 deletions .changeset/gentle-pots-perform.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
---
"@comet/admin-theme": minor
---

Slightly increase the default size of dialogs
5 changes: 0 additions & 5 deletions .changeset/perfect-actors-kick.md

This file was deleted.

5 changes: 0 additions & 5 deletions .changeset/three-eagles-cheat.md

This file was deleted.

23 changes: 23 additions & 0 deletions .changeset/yellow-seahorses-lick.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,23 @@
---
"@comet/cms-admin": major
"@comet/cms-api": major
"@comet/eslint-config": minor
"@comet/cms-site": minor
---

Migrate site preview to Next.js Preview Mode

Requires following changes to site:

- Import `useRouter` from `next/router` (not exported from `@comet/cms-site` anymore)
- Import `Link` from `next/link` (not exported from `@comet/cms-site` anymore)
- Remove preview pages (pages in `src/pages/preview/` directory which call `createGetUniversalProps` with preview parameters)
- Remove `createGetUniversalProps`
- Just implement `getStaticProps`/`getServerSideProps` (Preview Mode will SSR automatically)
- Get `previewData` from `context` and use it to configure the GraphQL Client
- Add `SitePreviewProvider` to `App` (typically in `src/pages/_app.tsx`)
- Add `/api/preview` Next API route (see demo)

Requires following changes to API:

- Set `sitePreviewSecret` in `PageTreeModule`-options (make sure it's the same across multiple API-instances)
2 changes: 1 addition & 1 deletion .env
Original file line number Diff line number Diff line change
Expand Up @@ -42,6 +42,7 @@ API_PORT=4000
API_URL=http://localhost:$API_PORT
API_URL_INTERNAL=http://localhost:$API_PORT
CORS_ALLOWED_ORIGINS="^http:\/\/localhost:\d+,^http://192.168.\d+.\d+:80[0-9]{2}"
SITE_PREVIEW_SECRET=uxa4ZBJ4exw8jgq-qrh

# blob storage
BLOB_STORAGE_DRIVER="file"
Expand All @@ -64,7 +65,6 @@ SITE_PORT=3000
SITE_URL=http://localhost:$SITE_PORT
SITE_PRELOGIN_ENABLED=false
SITE_PRELOGIN_PASSWORD=password
PREVIEW_URL=$SITE_URL/preview
# no gtm in dev mode
NEXT_PUBLIC_GTM_ID=
NEXT_PUBLIC_SITE_DOMAIN=main
Expand Down
1 change: 1 addition & 0 deletions .gitignore
Original file line number Diff line number Diff line change
Expand Up @@ -9,3 +9,4 @@ lang/
.pnp.*
junit.xml
.env.local
**/.idea
179 changes: 68 additions & 111 deletions demo/admin/src/common/ComponentDemo.tsx
Original file line number Diff line number Diff line change
@@ -1,14 +1,15 @@
import {
CheckboxField,
Field,
FieldContainer,
FinalForm,
FinalFormCheckbox,
FinalFormInput,
FinalFormRadio,
FinalFormSelect,
FinalFormSwitch,
MainContent,
SelectField,
Stack,
SwitchField,
TextAreaField,
TextField,
} from "@comet/admin";
import { Add, FocusPointCenter, FocusPointNortheast, FocusPointNorthwest, FocusPointSoutheast, FocusPointSouthwest, Snips } from "@comet/admin-icons";
import {
Expand Down Expand Up @@ -128,51 +129,35 @@ export function ComponentDemo(): React.ReactElement {
}}
initialValues={{ richText: RichTextBlock.defaultValues() }}
>
<Field name="text" placeholder="Input" component={FinalFormInput} fullWidth />

<Field name="select" fullWidth>
{(props) => (
<FinalFormSelect {...props}>
<MenuItem value="Option 1">Option 1</MenuItem>
<MenuItem value="Option 2">Option 2</MenuItem>
<MenuItem value="Option 3">Option 3</MenuItem>
</FinalFormSelect>
)}
</Field>

<Field name="text" label="Input with label" component={FinalFormInput} fullWidth />

<Field name="select" label="Select with label" fullWidth>
{(props) => (
<FinalFormSelect {...props}>
<MenuItem value="Option 1">Option 1</MenuItem>
<MenuItem value="Option 2">Option 2</MenuItem>
<MenuItem value="Option 3">Option 3</MenuItem>
</FinalFormSelect>
)}
</Field>

<Field name="select" label="Select">
{(props) => (
<FinalFormSelect {...props}>
<MenuItem value="Option 1">Option 1</MenuItem>
<MenuItem value="Option 2">Option 2</MenuItem>
<MenuItem value="Option 3">Option 3</MenuItem>
</FinalFormSelect>
)}
</Field>

<Field name="select" label="inline">
{(props) => (
<FinalFormSelect {...props}>
<MenuItem value="Option 1">Option 1</MenuItem>
<MenuItem value="Option 2">Option 2</MenuItem>
<MenuItem value="Option 3">Option 3</MenuItem>
</FinalFormSelect>
)}
</Field>

<Field
<TextField name="text" placeholder="Input" fullWidth />

<SelectField name="select" fullWidth>
<MenuItem value="Option 1">Option 1</MenuItem>
<MenuItem value="Option 2">Option 2</MenuItem>
<MenuItem value="Option 3">Option 3</MenuItem>
</SelectField>

<TextField name="text" label="Input with label" fullWidth />

<SelectField name="select" label="Select with label" fullWidth>
<MenuItem value="Option 1">Option 1</MenuItem>
<MenuItem value="Option 2">Option 2</MenuItem>
<MenuItem value="Option 3">Option 3</MenuItem>
</SelectField>

<SelectField name="select" label="Select">
<MenuItem value="Option 1">Option 1</MenuItem>
<MenuItem value="Option 2">Option 2</MenuItem>
<MenuItem value="Option 3">Option 3</MenuItem>
</SelectField>

<SelectField name="select" label="inline">
<MenuItem value="Option 1">Option 1</MenuItem>
<MenuItem value="Option 2">Option 2</MenuItem>
<MenuItem value="Option 3">Option 3</MenuItem>
</SelectField>

<SelectField
name="select"
label={
<>
Expand All @@ -183,32 +168,24 @@ export function ComponentDemo(): React.ReactElement {
</>
}
>
{(props) => (
<FinalFormSelect {...props}>
<MenuItem value="Option 1">1</MenuItem>
<MenuItem value="Option 2">2</MenuItem>
<MenuItem value="Option 3">3</MenuItem>
</FinalFormSelect>
)}
</Field>

<Field name="select-custom" label="Custom select" fullWidth>
{(props) => (
<FinalFormSelect {...props}>
<MenuItem value="Option 1">
<CustomSelectItem icon={<Snips />} primary="Option 1" secondary="Secondary text" />
</MenuItem>
<MenuItem value="Option 2">
<CustomSelectItem icon={<Snips />} primary="Option 2" secondary="Secondary text" />
</MenuItem>
<MenuItem value="Option 3">
<CustomSelectItem icon={<Snips />} primary="Option 3" secondary="Secondary text" />
</MenuItem>
</FinalFormSelect>
)}
</Field>

<Field name="textArea" label="Text Area" component={FinalFormInput} multiline minRows={3} fullWidth />
<MenuItem value="Option 1">1</MenuItem>
<MenuItem value="Option 2">2</MenuItem>
<MenuItem value="Option 3">3</MenuItem>
</SelectField>

<SelectField name="select-custom" label="Custom select" fullWidth>
<MenuItem value="Option 1">
<CustomSelectItem icon={<Snips />} primary="Option 1" secondary="Secondary text" />
</MenuItem>
<MenuItem value="Option 2">
<CustomSelectItem icon={<Snips />} primary="Option 2" secondary="Secondary text" />
</MenuItem>
<MenuItem value="Option 3">
<CustomSelectItem icon={<Snips />} primary="Option 3" secondary="Secondary text" />
</MenuItem>
</SelectField>

<TextAreaField name="textArea" label="Text Area" fullWidth />

<Field name="richText" label="Rich Text" component={FinalFormRichTextBlock} fullWidth />

Expand All @@ -224,24 +201,14 @@ export function ComponentDemo(): React.ReactElement {
</Field>
</FieldContainer>
<FieldContainer label="Multiple choice">
<Field name="multiple-choice-1" type="checkbox" fullWidth>
{(props) => <FormControlLabel label="Option 1" control={<FinalFormCheckbox {...props} />} />}
</Field>
<Field name="multiple-choice-2" type="checkbox" fullWidth>
{(props) => <FormControlLabel label="Option 2" control={<FinalFormCheckbox {...props} />} />}
</Field>
<Field name="multiple-choice-3" type="checkbox" fullWidth>
{(props) => <FormControlLabel label="Option 3" control={<FinalFormCheckbox {...props} />} />}
</Field>
<CheckboxField name="multiple-choice-1" label="Option 1" fullWidth />
<CheckboxField name="multiple-choice-2" label="Option 2" fullWidth />
<CheckboxField name="multiple-choice-3" label="Option 3" fullWidth />
</FieldContainer>

<Field name="switch" label="Switch with label">
{(props) => <FormControlLabel label={null} control={<FinalFormSwitch {...props} />} />}
</Field>
<SwitchField name="switch" fieldLabel="Switch with label" />

<Field name="switch">
{(props) => <FormControlLabel label="Switch with inline label" control={<FinalFormSwitch {...props} />} />}
</Field>
<SwitchField name="switch" label="Switch with inline label" />

<Field
name="button-group-row"
Expand Down Expand Up @@ -355,27 +322,17 @@ export function ComponentDemo(): React.ReactElement {
// noop
}}
>
<Field name="aspectRatio" label="Aspect ratio">
{(props) => (
<FinalFormSelect {...props}>
<MenuItem value="2:3">2:3</MenuItem>
<MenuItem value="4:3">4:3</MenuItem>
<MenuItem value="16:9">16:9</MenuItem>
</FinalFormSelect>
)}
</Field>
<Field name="overlay" label="Overlay">
{(props) => (
<FinalFormSelect {...props}>
<MenuItem value="0%">0%</MenuItem>
<MenuItem value="10%">10%</MenuItem>
<MenuItem value="20%">20%</MenuItem>
</FinalFormSelect>
)}
</Field>
<Field name="shadow" label="Shadow">
{(props) => <FormControlLabel label={null} control={<FinalFormSwitch {...props} />} />}
</Field>
<SelectField name="aspectRatio" label="Aspect ratio">
<MenuItem value="2:3">2:3</MenuItem>
<MenuItem value="4:3">4:3</MenuItem>
<MenuItem value="16:9">16:9</MenuItem>
</SelectField>
<SelectField name="overlay" label="Overlay">
<MenuItem value="0%">0%</MenuItem>
<MenuItem value="10%">10%</MenuItem>
<MenuItem value="20%">20%</MenuItem>
</SelectField>
<SwitchField name="shadow" fieldLabel="Shadow" />
</BlocksFinalForm>
</AdminComponentPaper>
</AdminComponentSection>
Expand Down
20 changes: 8 additions & 12 deletions demo/admin/src/common/EditPageNode.tsx
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
import { gql } from "@apollo/client";
import { Field, FinalFormSelect } from "@comet/admin";
import { SelectField } from "@comet/admin";
import { createEditPageNode } from "@comet/cms-admin";
import { Box, Divider, MenuItem } from "@mui/material";
import * as React from "react";
Expand Down Expand Up @@ -43,22 +43,18 @@ export const EditPageNode = createEditPageNode({
<Box marginY={6}>
<Divider />
</Box>
<Field
<SelectField
label={<FormattedMessage id="pageTreeNode.fields.userGroup" defaultMessage="User-Group" />}
name="userGroup"
variant="horizontal"
fullWidth
>
{(props) => (
<FinalFormSelect {...props} fullWidth>
{userGroupOptions.map((option) => (
<MenuItem value={option.value} key={option.value}>
{option.label}
</MenuItem>
))}
</FinalFormSelect>
)}
</Field>
{userGroupOptions.map((option) => (
<MenuItem value={option.value} key={option.value}>
{option.label}
</MenuItem>
))}
</SelectField>
</>
),
});
24 changes: 10 additions & 14 deletions demo/admin/src/common/blocks/HeadlineBlock.tsx
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import { Field, FinalFormInput, FinalFormSelect } from "@comet/admin";
import { SelectField, TextField } from "@comet/admin";
import { BlockCategory, BlocksFinalForm, createCompositeBlock, createCompositeSetting } from "@comet/blocks-admin";
import { createRichTextBlock } from "@comet/cms-admin";
import { MenuItem } from "@mui/material";
Expand Down Expand Up @@ -29,7 +29,7 @@ export const HeadlineBlock = createCompositeBlock(
onSubmit={({ eyebrow }) => updateState(eyebrow)}
initialValues={{ eyebrow: state }}
>
<Field name="eyebrow" label="Eyebrow" component={FinalFormInput} fullWidth />
<TextField name="eyebrow" label="Eyebrow" fullWidth />
</BlocksFinalForm>
),
}),
Expand All @@ -46,18 +46,14 @@ export const HeadlineBlock = createCompositeBlock(
onSubmit={({ level }) => updateState(level)}
initialValues={{ level: state }}
>
<Field name="level" label="Level" fullWidth>
{(props) => (
<FinalFormSelect {...props}>
<MenuItem value="header-one">Header One</MenuItem>
<MenuItem value="header-two">Header Two</MenuItem>
<MenuItem value="header-three">Header Three</MenuItem>
<MenuItem value="header-four">Header Four</MenuItem>
<MenuItem value="header-five">Header Five</MenuItem>
<MenuItem value="header-six">Header Six</MenuItem>
</FinalFormSelect>
)}
</Field>
<SelectField name="level" label="Level" fullWidth>
<MenuItem value="header-one">Header One</MenuItem>
<MenuItem value="header-two">Header Two</MenuItem>
<MenuItem value="header-three">Header Three</MenuItem>
<MenuItem value="header-four">Header Four</MenuItem>
<MenuItem value="header-five">Header Five</MenuItem>
<MenuItem value="header-six">Header Six</MenuItem>
</SelectField>
</BlocksFinalForm>
),
}),
Expand Down
4 changes: 2 additions & 2 deletions demo/admin/src/news/blocks/NewsLinkBlock.tsx
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import { Field, FinalFormInput } from "@comet/admin";
import { TextField } from "@comet/admin";
import { BlockInterface, BlocksFinalForm, createBlockSkeleton, LinkBlockInterface } from "@comet/blocks-admin";
import { NewsLinkBlockData, NewsLinkBlockInput } from "@src/blocks.generated";
import * as React from "react";
Expand All @@ -17,7 +17,7 @@ const NewsLinkBlock: BlockInterface<NewsLinkBlockData, State, NewsLinkBlockInput
AdminComponent: ({ state, updateState }) => {
return (
<BlocksFinalForm onSubmit={updateState} initialValues={state}>
<Field name="id" label="ID" fullWidth component={FinalFormInput} />
<TextField name="id" label="ID" fullWidth />
</BlocksFinalForm>
);
},
Expand Down
Loading

0 comments on commit a3cf65a

Please sign in to comment.