Skip to content

Commit

Permalink
merge: pull request #2814
Browse files Browse the repository at this point in the history
  • Loading branch information
@Pavel910
Pavel910 authored Dec 2, 2022
2 parents 990c3ab + ab88aba commit 4087613
Show file tree
Hide file tree
Showing 55 changed files with 2,568 additions and 1,904 deletions.
10 changes: 10 additions & 0 deletions apps/theme/pageBuilder/styles/base.scss
View file
Original file line number Diff line number Diff line change
@@ -1,6 +1,16 @@
@use "./mixins/border";
@use "./mixins/background";

html {
scroll-behavior: smooth;
}

@media screen and (prefers-reduced-motion: reduce) {
html {
scroll-behavior: auto;
}
}

.webiny-pb-page {
min-height: 100vh;
position: relative;
Expand Down
5 changes: 5 additions & 0 deletions apps/website/src/components/Page/Render.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,7 @@ import {
} from "@webiny/app-page-builder/types";
import Layout from "./Layout";
import Element from "@webiny/app-page-builder/render/components/Element";
import WebsiteScripts from "@webiny/app-page-builder/render/components/WebsiteScripts";
import useResponsiveClassName from "@webiny/app-page-builder/hooks/useResponsiveClassName";
import DefaultNotFoundPage from "theme/pageBuilder/components/defaultPages/DefaultNotFoundPage";
import DefaultErrorPage from "theme/pageBuilder/components/defaultPages/DefaultErrorPage";
Expand Down Expand Up @@ -103,6 +104,10 @@ const Render: React.FC<RenderProps> = ({ page, error, settings }) => {
return <meta key={index} property={preparedProperty} content={content} />;
})}
</Helmet>
<WebsiteScripts
headerTags={settings?.htmlTags?.header}
footerTags={settings?.htmlTags?.footer}
/>
<div className={responsiveClassName} ref={pageElementRef}>
<Layout page={page} settings={settings}>
<Element element={page.content} />
Expand Down
8 changes: 8 additions & 0 deletions apps/website/src/components/Page/graphql.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -70,6 +70,10 @@ export interface SettingsQueryResponseData {
src: string;
};
};
htmlTags: {
header: string;
footer: string;
};
logo: {
src: string;
};
Expand Down Expand Up @@ -99,6 +103,10 @@ export const GET_SETTINGS = gql`
src
}
}
htmlTags {
header
footer
}
logo {
src
}
Expand Down
3 changes: 3 additions & 0 deletions packages/api-page-builder-so-ddb-es/src/definitions/settingsEntity.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -40,6 +40,9 @@ export const createSettingsEntity = (params: Params): Entity<any> => {
social: {
type: "map"
},
htmlTags: {
type: "map"
},
pages: {
type: "map"
},
Expand Down
3 changes: 3 additions & 0 deletions packages/api-page-builder-so-ddb/src/definitions/settingsEntity.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -40,6 +40,9 @@ export const createSettingsEntity = (params: Params): Entity<any> => {
social: {
type: "map"
},
htmlTags: {
type: "map"
},
pages: {
type: "map"
},
Expand Down
12 changes: 12 additions & 0 deletions packages/api-page-builder/src/graphql/graphql/settings.gql.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -21,6 +21,11 @@ export const createSettingsGraphQL = (): GraphQLSchemaPlugin<PbContext> => {
image: PbFile
}
type PbHtmlTags {
header: String
footer: String
}
type PbSettingsPrerenderingStorage {
name: String
}
Expand All @@ -41,6 +46,7 @@ export const createSettingsGraphQL = (): GraphQLSchemaPlugin<PbContext> => {
websiteUrl: String
websitePreviewUrl: String
social: PbSocialMedia
htmlTags: PbHtmlTags
pages: PbSettingsPages
prerendering: PbSettingsPrerendering
}
Expand Down Expand Up @@ -95,6 +101,11 @@ export const createSettingsGraphQL = (): GraphQLSchemaPlugin<PbContext> => {
image: PbFileInput
}
input PbHtmlTagsInput {
header: String
footer: String
}
input PbDefaultPageInput {
id: String
title: String
Expand All @@ -107,6 +118,7 @@ export const createSettingsGraphQL = (): GraphQLSchemaPlugin<PbContext> => {
favicon: PbFileInput
logo: PbFileInput
social: PbSocialMediaInput
htmlTags: PbHtmlTagsInput
pages: PbSettingsPagesInput
prerendering: PbSettingsPrerenderingInput
}
Expand Down
4 changes: 4 additions & 0 deletions packages/api-page-builder/src/types.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -410,6 +410,10 @@ export interface Settings {
instagram: string;
image: File;
};
htmlTags: {
header: string;
footer: string;
};
pages: {
home: string;
notFound: string;
Expand Down
7 changes: 7 additions & 0 deletions packages/api-page-builder/src/utils/models/DefaultSettings.model.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -38,6 +38,13 @@ export default withFields({
image: object({})
})()
}),
htmlTags: fields({
value: {},
instanceOf: withFields({
header: string(),
footer: string()
})()
}),
pages: fields({
value: {},
instanceOf: withFields({
Expand Down
9 changes: 6 additions & 3 deletions packages/app-admin/src/ui/elements/form/FileManagerElement/FileManagerElementRenderer.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@ import styled from "@emotion/styled";
import { UIRenderer, UIRenderParams } from "~/ui/UIRenderer";
import { FormElementMessage } from "@webiny/ui/FormElementMessage";
import { FileManagerElement } from "~/ui/elements/form/FileManagerElement";
import { FileManager } from "~/components";
import { FileManager, FileManagerFileItem } from "~/components/FileManager";
import { FormFieldElementRenderProps } from "~/ui/elements/form/FormFieldElement";

const ImageUploadWrapper = styled("div")({
Expand Down Expand Up @@ -65,7 +65,9 @@ export class FileManagerElementRenderer extends UIRenderer<
)}

<FileManager
onChange={onChange}
onChange={(value: FileManagerFileItem | null) =>
onChange(value ? { id: value.id, src: value.src } : null)
}
accept={accept}
images={!accept}
maxSize={element.getMaxSize()}
Expand All @@ -75,7 +77,8 @@ export class FileManagerElementRenderer extends UIRenderer<
fileManagerElement: element,
showFileManager,
value,
onChange
onChange: (value: FileManagerFileItem | null) =>
onChange(value ? { id: value.id, src: value.src } : null)
})
}
/>
Expand Down
4 changes: 4 additions & 0 deletions packages/app-page-builder/src/admin/hooks/usePageBuilderSettings/usePageBuilderSettings.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -32,6 +32,10 @@ const DATA_FIELDS = /* GraphQL */ `
src
}
}
htmlTags {
header
footer
}
}
error {
message
Expand Down
2 changes: 1 addition & 1 deletion packages/app-page-builder/src/admin/utils/createBlockCategoryPlugin.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,7 @@ interface IconProps {
category: PbBlockCategory;
}

const Icon: React.FC<IconProps> = ({ category }) => {
export const Icon: React.FC<IconProps> = ({ category }) => {
return (
<FontAwesomeIcon
style={{ color: "var(--mdc-theme-text-secondary-on-background)", fontSize: "24px" }}
Expand Down
19 changes: 13 additions & 6 deletions packages/app-page-builder/src/admin/views/BlockCategories/BlockCategoriesDataList.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -13,6 +13,7 @@ import {
DataListModalOverlayAction,
ScrollList,
ListItem,
ListItemGraphic,
ListItemText,
ListItemMeta,
ListActions,
Expand All @@ -28,6 +29,7 @@ import SearchUI from "@webiny/app-admin/components/SearchUI";
import { ReactComponent as AddIcon } from "@webiny/app-admin/assets/icons/add-18px.svg";
import { ReactComponent as FilterIcon } from "@webiny/app-admin/assets/icons/filter-24px.svg";
import { PageBuilderSecurityPermission, PbBlockCategory } from "~/types";
import { Icon } from "~/admin/utils/createBlockCategoryPlugin";

const t = i18n.ns("app-page-builder/admin/block-categories/data-list");

Expand Down Expand Up @@ -205,12 +207,17 @@ const PageBuilderBlockCategoriesDataList = ({
{({ data }: { data: PbBlockCategory[] }) => (
<ScrollList data-testid="default-data-list">
{data.map(item => (
<ListItem key={item.slug} selected={item.slug === slug}>
<ListItemText
onClick={() =>
history.push(`/page-builder/block-categories?slug=${item.slug}`)
}
>
<ListItem
key={item.slug}
selected={item.slug === slug}
onClick={() =>
history.push(`/page-builder/block-categories?slug=${item.slug}`)
}
>
<ListItemGraphic>
<Icon category={item} />
</ListItemGraphic>
<ListItemText>
{item.name}
<ListItemTextSecondary>
{item.description || t`No description provided.`}
Expand Down
31 changes: 23 additions & 8 deletions packages/app-page-builder/src/admin/views/PageBlocks/BlocksByCategoriesDataList.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -14,6 +14,7 @@ import {
ScrollList,
List,
ListItem,
ListItemGraphic,
ListItemText,
ListItemTextPrimary,
ListItemTextSecondary
Expand All @@ -27,6 +28,7 @@ import { ButtonDefault, ButtonIcon, ButtonSecondary } from "@webiny/ui/Button";
import { useSnackbar } from "@webiny/app-admin/hooks/useSnackbar";
import { ReactComponent as FilterIcon } from "@webiny/app-admin/assets/icons/filter-24px.svg";
import { ReactComponent as AddIcon } from "@webiny/app-admin/assets/icons/add-18px.svg";
import { Icon } from "~/admin/utils/createBlockCategoryPlugin";

import { PbBlockCategory, PbPageBlock } from "~/types";
import { LIST_PAGE_BLOCKS_AND_CATEGORIES, LIST_PAGE_BLOCKS, CREATE_PAGE_BLOCK } from "./graphql";
Expand Down Expand Up @@ -193,6 +195,14 @@ const BlocksByCategoriesDataList = ({ canCreate }: PageBuilderBlocksByCategories
}
};

const handleNewBlockClick = useCallback(() => {
if (selectedBlocksCategory) {
onCreatePageBlock(selectedBlocksCategory);
} else {
setIsNewPageBlockDialogOpen(true);
}
}, [selectedBlocksCategory]);

return (
<>
<DataList
Expand All @@ -201,7 +211,7 @@ const BlocksByCategoriesDataList = ({ canCreate }: PageBuilderBlocksByCategories
data={categoryList}
actions={
canCreate ? (
<ButtonSecondary onClick={() => setIsNewPageBlockDialogOpen(true)}>
<ButtonSecondary onClick={handleNewBlockClick}>
<ButtonIcon icon={<AddIcon />} /> {t`New Block`}
</ButtonSecondary>
) : null
Expand Down Expand Up @@ -237,14 +247,16 @@ const BlocksByCategoriesDataList = ({ canCreate }: PageBuilderBlocksByCategories
<ListItem
key={item.slug}
selected={item.slug === selectedBlocksCategory}
onClick={() =>
history.push(
`/page-builder/page-blocks?category=${item.slug}`
)
}
>
<ListItemText
onClick={() =>
history.push(
`/page-builder/page-blocks?category=${item.slug}`
)
}
>
<ListItemGraphic>
<Icon category={item} />
</ListItemGraphic>
<ListItemText>
{item.name}
<ListItemTextSecondary>{`${numberOfBlocks} ${
numberOfBlocks === 1 ? "block" : "blocks"
Expand Down Expand Up @@ -279,6 +291,9 @@ const BlocksByCategoriesDataList = ({ canCreate }: PageBuilderBlocksByCategories
key={item.slug}
onClick={() => onCreatePageBlock(item.slug)}
>
<ListItemGraphic>
<Icon category={item} />
</ListItemGraphic>
<ListItemText>
<ListItemTextPrimary>{item.name}</ListItemTextPrimary>
<ListItemTextSecondary>
Expand Down
2 changes: 1 addition & 1 deletion packages/app-page-builder/src/admin/views/PageBlocks/PageBlocks.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -64,7 +64,7 @@ const PageBlocks: React.FC = () => {
<BlocksByCategoriesDataList canCreate={canCreate} />
</LeftPanel>
<RightPanel>
<PageBlocksDataList canEdit={canEdit} canDelete={canDelete} />
<PageBlocksDataList canCreate={canCreate} canEdit={canEdit} canDelete={canDelete} />
</RightPanel>
</SplitView>
);
Expand Down
Loading

0 comments on commit 4087613

Please sign in to comment.