From 8ca7a02df4b891a0be21bda4ef596bf8c6bf85a3 Mon Sep 17 00:00:00 2001 From: Vitalii Nobis <77202393+neatbyte-vnobis@users.noreply.github.com> Date: Fri, 8 Dec 2023 13:59:08 +0200 Subject: [PATCH] refactor: prepare react 18 upgrade - batch #9 [no ci] (#3749) --- .../src/components/ContentReviewEditor/CenterPanel.tsx | 2 +- .../ChangeContentStatus/ChangeContentStatusButton.tsx | 4 ++-- .../ChangeContentStatus/ChangeContentStatusDialog.tsx | 8 ++------ .../ChangeContentStatus/ScheduleActionDialog.tsx | 4 ++-- .../ChangeContentStatus/useScheduleActionDialog.tsx | 6 +++++- .../ContentReviewEditor/ChangeRequest/ApwFile.tsx | 4 ++-- .../ChangeRequest/ChangeRequest.tsx | 2 +- .../ChangeRequest/ChangeRequestDialog.tsx | 4 ++-- .../ChangeRequest/ChangeRequestListItem.tsx | 2 +- .../ChangeRequest/ChangeRequestMedia.tsx | 3 ++- .../ChangeRequest/ProvideSignOff.tsx | 5 +---- .../ChangeRequest/useChangeRequestDialog.tsx | 6 +++++- .../ContentReviewEditor/Comment/CommentBox.tsx | 2 +- .../ContentReviewEditor/Comment/Comments.tsx | 2 +- .../ContentReviewEditor/ContentReviewStep/index.tsx | 8 ++++---- .../src/components/ContentReviewEditor/LeftPanel.tsx | 6 +----- .../components/ContentReviewEditor/PlaceholderBox.tsx | 6 +++++- .../src/components/ContentReviewEditor/RightPanel.tsx | 2 +- .../src/components/ContentReviewEditor/index.tsx | 2 +- packages/app-apw/src/components/Layout.tsx | 4 ++-- packages/app-apw/src/index.tsx | 2 +- packages/app-apw/src/plugins/Module.tsx | 4 ++-- packages/app-apw/src/plugins/cms/ApwOnEntryDelete.tsx | 2 +- packages/app-apw/src/plugins/cms/ApwOnEntryPublish.tsx | 2 +- packages/app-apw/src/plugins/cms/MenuGroupRenderer.tsx | 2 +- .../app-apw/src/plugins/editor/defaultBar/Name.tsx | 2 +- .../app-apw/src/plugins/editor/defaultBar/index.tsx | 2 +- .../app-apw/src/plugins/pageBuilder/ApwOnDelete.tsx | 2 +- .../app-apw/src/plugins/pageBuilder/ApwOnPublish.tsx | 2 +- .../src/plugins/permissionRenderer/ApwPermissions.tsx | 2 +- .../app-apw/src/plugins/permissionRenderer/index.tsx | 2 +- .../contentReviewDashboard/ContentReviewDataList.tsx | 2 +- .../contentReviewDashboard/ContentReviewEditor.tsx | 2 +- .../components/ContentReviewItem.tsx | 2 +- .../components/ContentReviewStatus.tsx | 10 +++++++--- .../components/ContentReviewSubmittedInfo.tsx | 2 +- .../components/LatestComment.tsx | 2 +- .../app-apw/src/views/contentReviewDashboard/index.tsx | 6 +++++- .../PublishingWorkflowsDataList.tsx | 4 ++-- .../components/ListItemWithCheckbox.tsx | 6 +----- .../publishingWorkflows/components/ReviewersList.tsx | 4 ++-- .../components/cms/ApwHeadlessCmsWorkflowScope.tsx | 2 +- .../components/cms/CmsScopeSettings.tsx | 6 +++--- .../pageBuilder/ApwPageBuilderWorkflowScope.tsx | 2 +- .../components/pageBuilder/PbScopeSettings.tsx | 6 +++--- .../app-apw/src/views/publishingWorkflows/index.tsx | 2 +- 46 files changed, 85 insertions(+), 79 deletions(-) diff --git a/packages/app-apw/src/components/ContentReviewEditor/CenterPanel.tsx b/packages/app-apw/src/components/ContentReviewEditor/CenterPanel.tsx index 9478d4df3d6..1353eea406b 100644 --- a/packages/app-apw/src/components/ContentReviewEditor/CenterPanel.tsx +++ b/packages/app-apw/src/components/ContentReviewEditor/CenterPanel.tsx @@ -42,7 +42,7 @@ interface CreateChangeRequestProps { disabled: boolean; } -const CreateChangeRequest: React.FC = ({ create, disabled }) => { +const CreateChangeRequest = ({ create, disabled }: CreateChangeRequestProps) => { if (disabled) { return ( diff --git a/packages/app-apw/src/components/ContentReviewEditor/ChangeContentStatus/ChangeContentStatusButton.tsx b/packages/app-apw/src/components/ContentReviewEditor/ChangeContentStatus/ChangeContentStatusButton.tsx index 2e0f4ece392..b9c412327d4 100644 --- a/packages/app-apw/src/components/ContentReviewEditor/ChangeContentStatus/ChangeContentStatusButton.tsx +++ b/packages/app-apw/src/components/ContentReviewEditor/ChangeContentStatus/ChangeContentStatusButton.tsx @@ -31,7 +31,7 @@ const PublishContentBox = styled(Box)` const defaultButtonStyles = { width: "217px" }; const activeButtonStyles = { backgroundColor: "var(--mdc-theme-secondary)" }; -export const ChangeContentStatusButton: React.FC = () => { +export const ChangeContentStatusButton = () => { const { contentReview } = useCurrentContentReview(); const { loading, deleteScheduledAction } = usePublishContent(); const { setAction, setOpenPublishNowDialog } = useScheduleActionDialog(); @@ -132,7 +132,7 @@ const AuthorName = styled(TypographySecondary)` export type ContentStatusProps = Pick; -export const ContentStatus: React.FC = ({ content }) => { +export const ContentStatus = ({ content }: ContentStatusProps) => { const label = content.scheduledOn ? t`Content Scheduled On:` : t`Content Published On:`; const name = content.scheduledOn ? content.scheduledBy?.displayName diff --git a/packages/app-apw/src/components/ContentReviewEditor/ChangeContentStatus/ChangeContentStatusDialog.tsx b/packages/app-apw/src/components/ContentReviewEditor/ChangeContentStatus/ChangeContentStatusDialog.tsx index 2a9e55e1674..00afdecc576 100644 --- a/packages/app-apw/src/components/ContentReviewEditor/ChangeContentStatus/ChangeContentStatusDialog.tsx +++ b/packages/app-apw/src/components/ContentReviewEditor/ChangeContentStatus/ChangeContentStatusDialog.tsx @@ -26,11 +26,7 @@ interface PublishContentMessageProps { action: ScheduleActionType; } -const PublishContentMessage: React.FC = ({ - publishNow, - setSchedule, - action -}) => { +const PublishContentMessage = ({ publishNow, setSchedule, action }: PublishContentMessageProps) => { const label = action === "publish" ? t`Publish` : t`Unpublish`; return ( @@ -86,7 +82,7 @@ const dialogContainerStyles = css` } `; -export const ChangeContentStatusDialog: React.FC = () => { +export const ChangeContentStatusDialog = () => { const { action, openPublishNowDialog, setOpenPublishNowDialog, setOpenPublishLaterDialog } = useScheduleActionDialog(); const useContentReviewIdResult = useContentReviewId(); diff --git a/packages/app-apw/src/components/ContentReviewEditor/ChangeContentStatus/ScheduleActionDialog.tsx b/packages/app-apw/src/components/ContentReviewEditor/ChangeContentStatus/ScheduleActionDialog.tsx index 8e56a458eff..abf202c64eb 100644 --- a/packages/app-apw/src/components/ContentReviewEditor/ChangeContentStatus/ScheduleActionDialog.tsx +++ b/packages/app-apw/src/components/ContentReviewEditor/ChangeContentStatus/ScheduleActionDialog.tsx @@ -71,7 +71,7 @@ const getTimeGte = (date: string | undefined): string => { return ""; }; -const ScheduleActionMessage: React.FC = ({ Bind, data }) => { +const ScheduleActionMessage = ({ Bind, data }: ScheduleActionMessageProps) => { const dateGte = getTodayDate(); const timeGte = getTimeGte(data?.date); @@ -133,7 +133,7 @@ const dialogContainerStyles = css` } `; -export const ScheduleActionDialog: React.FC = () => { +export const ScheduleActionDialog = () => { const { action, openPublishLaterDialog, setOpenPublishLaterDialog } = useScheduleActionDialog(); const useContentReviewIdResult = useContentReviewId(); if (!useContentReviewIdResult) { diff --git a/packages/app-apw/src/components/ContentReviewEditor/ChangeContentStatus/useScheduleActionDialog.tsx b/packages/app-apw/src/components/ContentReviewEditor/ChangeContentStatus/useScheduleActionDialog.tsx index 8f7d76c4aca..3ad08f33adb 100644 --- a/packages/app-apw/src/components/ContentReviewEditor/ChangeContentStatus/useScheduleActionDialog.tsx +++ b/packages/app-apw/src/components/ContentReviewEditor/ChangeContentStatus/useScheduleActionDialog.tsx @@ -19,7 +19,11 @@ export const useScheduleActionDialog = (): ScheduleActionDialogContextValue => { return useContext(ScheduleActionDialogContext); }; -export const ScheduleActionDialogProvider: React.FC = ({ children }) => { +interface ScheduleActionDialogProviderProps { + children: React.ReactNode; +} + +export const ScheduleActionDialogProvider = ({ children }: ScheduleActionDialogProviderProps) => { const [action, setAction] = useState("publish"); const [openPublishNowDialog, setOpenPublishNowDialog] = useState(false); const [openPublishLaterDialog, setOpenPublishLaterDialog] = useState(false); diff --git a/packages/app-apw/src/components/ContentReviewEditor/ChangeRequest/ApwFile.tsx b/packages/app-apw/src/components/ContentReviewEditor/ChangeRequest/ApwFile.tsx index d26429c33fa..ed2055c38a4 100644 --- a/packages/app-apw/src/components/ContentReviewEditor/ChangeRequest/ApwFile.tsx +++ b/packages/app-apw/src/components/ContentReviewEditor/ChangeRequest/ApwFile.tsx @@ -32,7 +32,7 @@ export const DefaultRenderImagePreview = (renderImageProps: any) => ( ); -export const ApwFile: React.FC = props => { +export const ApwFile = (props: ApwFileProps) => { const { value, onChange, showFileManager } = props; const removeImage = () => onChange(null); @@ -74,7 +74,7 @@ const commentFilePreviewProps = { style: { width: "100%", height: 140, objectFit: "contain" } }; -export const CommentFile: React.FC = props => { +export const CommentFile = (props: CommentFileProps) => { const { value } = props; const isImage = React.useCallback(url => { diff --git a/packages/app-apw/src/components/ContentReviewEditor/ChangeRequest/ChangeRequest.tsx b/packages/app-apw/src/components/ContentReviewEditor/ChangeRequest/ChangeRequest.tsx index ef9bf77aaad..1335855885e 100644 --- a/packages/app-apw/src/components/ContentReviewEditor/ChangeRequest/ChangeRequest.tsx +++ b/packages/app-apw/src/components/ContentReviewEditor/ChangeRequest/ChangeRequest.tsx @@ -77,7 +77,7 @@ interface ChangeRequestProps { id: string; } -export const ChangeRequest: React.FC = props => { +export const ChangeRequest = (props: ChangeRequestProps) => { const { id } = props; const { deleteChangeRequest, changeRequest, markResolved, loading } = useChangeRequest({ id }); const { setOpen, setChangeRequestId } = useChangeRequestDialog(); diff --git a/packages/app-apw/src/components/ContentReviewEditor/ChangeRequest/ChangeRequestDialog.tsx b/packages/app-apw/src/components/ContentReviewEditor/ChangeRequest/ChangeRequestDialog.tsx index 2023ef02597..1cf0851394f 100644 --- a/packages/app-apw/src/components/ContentReviewEditor/ChangeRequest/ChangeRequestDialog.tsx +++ b/packages/app-apw/src/components/ContentReviewEditor/ChangeRequest/ChangeRequestDialog.tsx @@ -42,7 +42,7 @@ interface ChangeRequestMessageProps { Bind: BindComponent; } -const ChangeRequestMessage: React.FC = ({ Bind }) => { +const ChangeRequestMessage = ({ Bind }: ChangeRequestMessageProps) => { return ( @@ -125,7 +125,7 @@ const isValidId = (id: string | null) => { return id.split("#").length === 2; }; -export const ChangeRequestDialog: React.FC = () => { +export const ChangeRequestDialog = () => { const { open, setOpen, changeRequestId, setChangeRequestId } = useChangeRequestDialog(); const { id: stepId } = useCurrentStepId(); const useContentReviewIdResult = useContentReviewId(); diff --git a/packages/app-apw/src/components/ContentReviewEditor/ChangeRequest/ChangeRequestListItem.tsx b/packages/app-apw/src/components/ContentReviewEditor/ChangeRequest/ChangeRequestListItem.tsx index 207af76c302..8f0c687904a 100644 --- a/packages/app-apw/src/components/ContentReviewEditor/ChangeRequest/ChangeRequestListItem.tsx +++ b/packages/app-apw/src/components/ContentReviewEditor/ChangeRequest/ChangeRequestListItem.tsx @@ -32,7 +32,7 @@ const getRandomIndex = () => Math.round(Math.random() * 100) % 3; type ChangeRequestItemProps = ApwChangeRequest; -export const ChangeRequestListItem: React.FC = props => { +export const ChangeRequestListItem = (props: ChangeRequestItemProps) => { const { createdOn, createdBy, title, id, body, resolved } = props; const location = useLocation(); const navigate = useNavigate(); diff --git a/packages/app-apw/src/components/ContentReviewEditor/ChangeRequest/ChangeRequestMedia.tsx b/packages/app-apw/src/components/ContentReviewEditor/ChangeRequest/ChangeRequestMedia.tsx index 12a5b5a1bfe..a3b5cc32815 100644 --- a/packages/app-apw/src/components/ContentReviewEditor/ChangeRequest/ChangeRequestMedia.tsx +++ b/packages/app-apw/src/components/ContentReviewEditor/ChangeRequest/ChangeRequestMedia.tsx @@ -51,9 +51,10 @@ export const Media = styled.div<{ fullWidth?: boolean }>` interface FileWithOverlayProps { media: ApwMediaFile; fullWidth: boolean; + children: React.ReactNode; } -export const FileWithOverlay: React.FC = ({ media, children, fullWidth }) => { +export const FileWithOverlay = ({ media, children, fullWidth }: FileWithOverlayProps) => { return ( {children} diff --git a/packages/app-apw/src/components/ContentReviewEditor/ChangeRequest/ProvideSignOff.tsx b/packages/app-apw/src/components/ContentReviewEditor/ChangeRequest/ProvideSignOff.tsx index 19bc0dc9235..8f72eac2f76 100644 --- a/packages/app-apw/src/components/ContentReviewEditor/ChangeRequest/ProvideSignOff.tsx +++ b/packages/app-apw/src/components/ContentReviewEditor/ChangeRequest/ProvideSignOff.tsx @@ -26,10 +26,7 @@ interface ProvideSignOffProps { changeRequestsPending: boolean; } -export const ProvideSignOff: React.FC = ({ - currentStep, - changeRequestsPending -}) => { +export const ProvideSignOff = ({ currentStep, changeRequestsPending }: ProvideSignOffProps) => { const { provideSignOff, retractSignOff, loading } = useStepSignOff(); if (loading) { diff --git a/packages/app-apw/src/components/ContentReviewEditor/ChangeRequest/useChangeRequestDialog.tsx b/packages/app-apw/src/components/ContentReviewEditor/ChangeRequest/useChangeRequestDialog.tsx index 57f537e4df5..13995f69bc3 100644 --- a/packages/app-apw/src/components/ContentReviewEditor/ChangeRequest/useChangeRequestDialog.tsx +++ b/packages/app-apw/src/components/ContentReviewEditor/ChangeRequest/useChangeRequestDialog.tsx @@ -15,7 +15,11 @@ export const useChangeRequestDialog = (): ChangeRequestDialogContextValue => { return useContext(ChangeRequestDialogContext); }; -export const ChangeRequestDialogProvider: React.FC = ({ children }) => { +interface ChangeRequestDialogProviderProps { + children: React.ReactNode; +} + +export const ChangeRequestDialogProvider = ({ children }: ChangeRequestDialogProviderProps) => { const [open, setOpen] = useState(false); const [changeRequestId, setChangeRequestId] = useState(null); diff --git a/packages/app-apw/src/components/ContentReviewEditor/Comment/CommentBox.tsx b/packages/app-apw/src/components/ContentReviewEditor/Comment/CommentBox.tsx index bccfb94426f..fce275d718c 100644 --- a/packages/app-apw/src/components/ContentReviewEditor/Comment/CommentBox.tsx +++ b/packages/app-apw/src/components/ContentReviewEditor/Comment/CommentBox.tsx @@ -81,7 +81,7 @@ interface CommentBoxProps { scrollToLatestComment: () => void; } -export const CommentBox: React.FC = ({ scrollToLatestComment }) => { +export const CommentBox = ({ scrollToLatestComment }: CommentBoxProps) => { const [loading, setLoading] = useState(false); const { createComment } = useComment(); const changeRequestId = useCurrentChangeRequestId(); diff --git a/packages/app-apw/src/components/ContentReviewEditor/Comment/Comments.tsx b/packages/app-apw/src/components/ContentReviewEditor/Comment/Comments.tsx index 847e86059f3..10b17b075b5 100644 --- a/packages/app-apw/src/components/ContentReviewEditor/Comment/Comments.tsx +++ b/packages/app-apw/src/components/ContentReviewEditor/Comment/Comments.tsx @@ -32,7 +32,7 @@ interface CommentProps { width?: string; } -const Comment: React.FC = props => { +const Comment = (props: CommentProps) => { const { comment, ...restProps } = props; return ( diff --git a/packages/app-apw/src/components/ContentReviewEditor/ContentReviewStep/index.tsx b/packages/app-apw/src/components/ContentReviewEditor/ContentReviewStep/index.tsx index 19ff5404031..e1b378bec8a 100644 --- a/packages/app-apw/src/components/ContentReviewEditor/ContentReviewStep/index.tsx +++ b/packages/app-apw/src/components/ContentReviewEditor/ContentReviewStep/index.tsx @@ -20,10 +20,10 @@ interface CircleProps { innerFillColor?: string; } -const ConcentricCircle: React.FC = ({ +const ConcentricCircle = ({ innerFillColor = "var(--mdc-theme-surface)", outerFillColor -}) => { +}: CircleProps) => { return ( = ({ status }) => { +const StepStatusIcon = ({ status }: StepStatusIconProps) => { return ; }; @@ -61,7 +61,7 @@ interface ContentReviewStepProps { disabled?: boolean; } -export const ContentReviewStep: React.FC = props => { +export const ContentReviewStep = (props: ContentReviewStepProps) => { const { step, createdOn, createdBy, disabled } = props; const navigate = useNavigate(); const activeStepId = useActiveStepId(); diff --git a/packages/app-apw/src/components/ContentReviewEditor/LeftPanel.tsx b/packages/app-apw/src/components/ContentReviewEditor/LeftPanel.tsx index 1fbad2025c0..4f2c3f6a6ab 100644 --- a/packages/app-apw/src/components/ContentReviewEditor/LeftPanel.tsx +++ b/packages/app-apw/src/components/ContentReviewEditor/LeftPanel.tsx @@ -36,11 +36,7 @@ interface LeftPanelProps { status: ApwContentReviewStatus; } -export const LeftPanel: React.FC = ({ - steps, - reviewRequestedBy, - reviewRequestedOn -}) => { +export const LeftPanel = ({ steps, reviewRequestedBy, reviewRequestedOn }: LeftPanelProps) => { return ( diff --git a/packages/app-apw/src/components/ContentReviewEditor/PlaceholderBox.tsx b/packages/app-apw/src/components/ContentReviewEditor/PlaceholderBox.tsx index 9a29396da76..7e7177694e6 100644 --- a/packages/app-apw/src/components/ContentReviewEditor/PlaceholderBox.tsx +++ b/packages/app-apw/src/components/ContentReviewEditor/PlaceholderBox.tsx @@ -8,7 +8,11 @@ const EmptyBox = styled(Box)` background-color: var(--mdc-theme-on-background); `; -export const PlaceholderBox: React.FC<{ text: string }> = ({ text }) => { +interface PlaceholderBoxProps { + text: string; +} + +export const PlaceholderBox = ({ text }: PlaceholderBoxProps) => { return ( diff --git a/packages/app-apw/src/components/ContentReviewEditor/RightPanel.tsx b/packages/app-apw/src/components/ContentReviewEditor/RightPanel.tsx index 9b5aa87cb49..d56bd3a0dd1 100644 --- a/packages/app-apw/src/components/ContentReviewEditor/RightPanel.tsx +++ b/packages/app-apw/src/components/ContentReviewEditor/RightPanel.tsx @@ -17,7 +17,7 @@ const CommentStack = styled(Stack)` flex-direction: column; `; -export const RightPanel: React.FC = () => { +export const RightPanel = () => { const changeRequestId = useCurrentChangeRequestId(); const ref = useRef(null); diff --git a/packages/app-apw/src/components/ContentReviewEditor/index.tsx b/packages/app-apw/src/components/ContentReviewEditor/index.tsx index 9b6c893c919..38ed6e32dbb 100644 --- a/packages/app-apw/src/components/ContentReviewEditor/index.tsx +++ b/packages/app-apw/src/components/ContentReviewEditor/index.tsx @@ -21,7 +21,7 @@ const EditorColumns = styled(Columns)` padding: 65px 0 0; `; -export const ContentReviewEditor: React.FC = () => { +export const ContentReviewEditor = () => { const { loading, contentReview } = useCurrentContentReview(); if (loading) { diff --git a/packages/app-apw/src/components/Layout.tsx b/packages/app-apw/src/components/Layout.tsx index 7aeb72e2e7b..a616f0f5bdf 100644 --- a/packages/app-apw/src/components/Layout.tsx +++ b/packages/app-apw/src/components/Layout.tsx @@ -139,7 +139,7 @@ interface ColumnsProps extends StyledBoxProps { className?: string; } -export const Columns: React.FC = ({ children, space, ...props }) => { +export const Columns = ({ children, space, ...props }: ColumnsProps) => { return ( {React.Children.map(children, (child, index) => { @@ -167,7 +167,7 @@ interface StackProps extends StyledBoxProps { className?: string; } -export const Stack: React.FC = ({ children, space, ...props }) => { +export const Stack = ({ children, space, ...props }: StackProps) => { return ( {React.Children.map(children, (child, index) => { diff --git a/packages/app-apw/src/index.tsx b/packages/app-apw/src/index.tsx index 7bf9cada377..bef1761c896 100644 --- a/packages/app-apw/src/index.tsx +++ b/packages/app-apw/src/index.tsx @@ -40,7 +40,7 @@ import { DefaultBar } from "~/plugins/editor/defaultBar"; import { MenuGroupRenderer } from "~/plugins/cms/MenuGroupRenderer"; import { ApwPermissions } from "~/plugins/permissionRenderer"; -export const AdvancedPublishingWorkflow: React.FC = () => { +export const AdvancedPublishingWorkflow = () => { const { canUseFeature } = useWcp(); if (!canUseFeature("advancedPublishingWorkflow")) { return null; diff --git a/packages/app-apw/src/plugins/Module.tsx b/packages/app-apw/src/plugins/Module.tsx index a08e0a05c75..f8af6e0bb87 100644 --- a/packages/app-apw/src/plugins/Module.tsx +++ b/packages/app-apw/src/plugins/Module.tsx @@ -16,11 +16,11 @@ const ContentReviewEditor = lazy( interface LoaderProps { children: React.ReactElement; } -const Loader: React.FC = ({ children, ...props }) => ( +const Loader = ({ children, ...props }: LoaderProps) => ( }>{React.cloneElement(children, props)} ); -export const Module: React.FC = () => { +export const Module = () => { const { canManageWorkflows } = usePermission(); const manageWorkflows = canManageWorkflows(); diff --git a/packages/app-apw/src/plugins/cms/ApwOnEntryDelete.tsx b/packages/app-apw/src/plugins/cms/ApwOnEntryDelete.tsx index 6a131fca246..c5ec46c2645 100644 --- a/packages/app-apw/src/plugins/cms/ApwOnEntryDelete.tsx +++ b/packages/app-apw/src/plugins/cms/ApwOnEntryDelete.tsx @@ -15,7 +15,7 @@ import { useApolloClient } from "@apollo/react-hooks"; const t = i18n.ns("app-apw/cms/dialog"); -export const ApwOnEntryDelete: React.FC = () => { +export const ApwOnEntryDelete = () => { const client = useApolloClient(); const { onEntryDelete } = useCms(); const { showSnackbar } = useSnackbar(); diff --git a/packages/app-apw/src/plugins/cms/ApwOnEntryPublish.tsx b/packages/app-apw/src/plugins/cms/ApwOnEntryPublish.tsx index 36d50841b4c..f86447bc1d4 100644 --- a/packages/app-apw/src/plugins/cms/ApwOnEntryPublish.tsx +++ b/packages/app-apw/src/plugins/cms/ApwOnEntryPublish.tsx @@ -22,7 +22,7 @@ interface Resolve { type CreateContentReviewInput = Pick; -export const ApwOnEntryPublish: React.FC = () => { +export const ApwOnEntryPublish = () => { const { onEntryRevisionPublish } = useCms(); const client = useApolloClient(); const { showSnackbar } = useSnackbar(); diff --git a/packages/app-apw/src/plugins/cms/MenuGroupRenderer.tsx b/packages/app-apw/src/plugins/cms/MenuGroupRenderer.tsx index d8715fe8de4..27c12fb3060 100644 --- a/packages/app-apw/src/plugins/cms/MenuGroupRenderer.tsx +++ b/packages/app-apw/src/plugins/cms/MenuGroupRenderer.tsx @@ -1,7 +1,7 @@ import { useMenuItem } from "@webiny/app-admin"; import React from "react"; -export const MenuGroupRenderer = (PrevMenuItem: React.FC): React.FC => { +export const MenuGroupRenderer = (PrevMenuItem: React.FC) => { return function MenuGroup() { const { menuItem } = useMenuItem(); diff --git a/packages/app-apw/src/plugins/editor/defaultBar/Name.tsx b/packages/app-apw/src/plugins/editor/defaultBar/Name.tsx index 15005322189..c326db3a755 100644 --- a/packages/app-apw/src/plugins/editor/defaultBar/Name.tsx +++ b/packages/app-apw/src/plugins/editor/defaultBar/Name.tsx @@ -31,7 +31,7 @@ const getContentUrl = (content: ApwContentReviewContent): string => { return ``; }; -export const Name: React.FC = () => { +export const Name = () => { const { contentReview } = useCurrentContentReview(); const url = getContentUrl(contentReview.content); diff --git a/packages/app-apw/src/plugins/editor/defaultBar/index.tsx b/packages/app-apw/src/plugins/editor/defaultBar/index.tsx index 81b8e6b8ed6..e38d4774899 100644 --- a/packages/app-apw/src/plugins/editor/defaultBar/index.tsx +++ b/packages/app-apw/src/plugins/editor/defaultBar/index.tsx @@ -43,7 +43,7 @@ const defaultBaPlugins = [ } ]; -export const DefaultBar: React.FC = () => { +export const DefaultBar = () => { useEffect(() => { plugins.register(defaultBaPlugins); }, []); diff --git a/packages/app-apw/src/plugins/pageBuilder/ApwOnDelete.tsx b/packages/app-apw/src/plugins/pageBuilder/ApwOnDelete.tsx index f65efe7117c..c3fb16e4a3e 100644 --- a/packages/app-apw/src/plugins/pageBuilder/ApwOnDelete.tsx +++ b/packages/app-apw/src/plugins/pageBuilder/ApwOnDelete.tsx @@ -10,7 +10,7 @@ import { IS_REVIEW_REQUIRED_QUERY } from "../graphql"; const t = i18n.ns("app-apw/page-builder/dialog"); -export const ApwOnPageDelete: React.FC = () => { +export const ApwOnPageDelete = () => { const pageBuilder = useAdminPageBuilder(); const client = useApolloClient(); const { showSnackbar } = useSnackbar(); diff --git a/packages/app-apw/src/plugins/pageBuilder/ApwOnPublish.tsx b/packages/app-apw/src/plugins/pageBuilder/ApwOnPublish.tsx index 75df7b9686a..d47f48277fb 100644 --- a/packages/app-apw/src/plugins/pageBuilder/ApwOnPublish.tsx +++ b/packages/app-apw/src/plugins/pageBuilder/ApwOnPublish.tsx @@ -18,7 +18,7 @@ const t = i18n.ns("app-apw/page-builder/dialog"); type CreateContentReviewInput = Pick; -export const ApwOnPublish: React.FC = () => { +export const ApwOnPublish = () => { const pageBuilder = useAdminPageBuilder(); const [input, setInput] = useState(null); const client = useApolloClient(); diff --git a/packages/app-apw/src/plugins/permissionRenderer/ApwPermissions.tsx b/packages/app-apw/src/plugins/permissionRenderer/ApwPermissions.tsx index a4e537e630a..3dd2df77431 100644 --- a/packages/app-apw/src/plugins/permissionRenderer/ApwPermissions.tsx +++ b/packages/app-apw/src/plugins/permissionRenderer/ApwPermissions.tsx @@ -18,7 +18,7 @@ export interface ApwPermissionsProps { value: ApwSecurityPermission[]; onChange: (value: ApwSecurityPermission[]) => void; } -export const ApwPermissions: React.FC = ({ value, onChange }) => { +export const ApwPermissions = ({ value, onChange }: ApwPermissionsProps) => { const onFormChange = useCallback( (data: ApwSecurityPermission) => { const initialPermissions = value.filter( diff --git a/packages/app-apw/src/plugins/permissionRenderer/index.tsx b/packages/app-apw/src/plugins/permissionRenderer/index.tsx index 712d2dc33b9..6b06c532599 100644 --- a/packages/app-apw/src/plugins/permissionRenderer/index.tsx +++ b/packages/app-apw/src/plugins/permissionRenderer/index.tsx @@ -24,7 +24,7 @@ const createPermissions = (): AdminAppPermissionRendererPlugin => { }; }; -export const ApwPermissions: React.FC = () => { +export const ApwPermissions = () => { useEffect(() => { plugins.register(createPermissions()); }, []); diff --git a/packages/app-apw/src/views/contentReviewDashboard/ContentReviewDataList.tsx b/packages/app-apw/src/views/contentReviewDashboard/ContentReviewDataList.tsx index 1737df7a674..79f1e2354d9 100644 --- a/packages/app-apw/src/views/contentReviewDashboard/ContentReviewDataList.tsx +++ b/packages/app-apw/src/views/contentReviewDashboard/ContentReviewDataList.tsx @@ -54,7 +54,7 @@ const InlineLoaderWrapper = styled("div")({ const CONTENT_REVIEW_LIST_REFRESH_INTERVAL = 10000; -export const ContentReviewDataList: React.FC = () => { +export const ContentReviewDataList = () => { const { contentReviews, loading, diff --git a/packages/app-apw/src/views/contentReviewDashboard/ContentReviewEditor.tsx b/packages/app-apw/src/views/contentReviewDashboard/ContentReviewEditor.tsx index d0bde21cf7d..3c5951f7472 100644 --- a/packages/app-apw/src/views/contentReviewDashboard/ContentReviewEditor.tsx +++ b/packages/app-apw/src/views/contentReviewDashboard/ContentReviewEditor.tsx @@ -1,7 +1,7 @@ import React from "react"; import { ContentReviewEditor } from "~/components/ContentReviewEditor"; -const Editor: React.FC = () => { +const Editor = () => { return ; }; diff --git a/packages/app-apw/src/views/contentReviewDashboard/components/ContentReviewItem.tsx b/packages/app-apw/src/views/contentReviewDashboard/components/ContentReviewItem.tsx index f2503160a1c..a14d4d1fd62 100644 --- a/packages/app-apw/src/views/contentReviewDashboard/components/ContentReviewItem.tsx +++ b/packages/app-apw/src/views/contentReviewDashboard/components/ContentReviewItem.tsx @@ -26,7 +26,7 @@ type ContentReviewItemProps = Pick< const STATUS_BOX_WIDTH = "126px"; -export const ContentReviewListItem: React.FC = props => { +export const ContentReviewListItem = (props: ContentReviewItemProps) => { const { activeStep, title, diff --git a/packages/app-apw/src/views/contentReviewDashboard/components/ContentReviewStatus.tsx b/packages/app-apw/src/views/contentReviewDashboard/components/ContentReviewStatus.tsx index 23e2203f07d..e11f050f62b 100644 --- a/packages/app-apw/src/views/contentReviewDashboard/components/ContentReviewStatus.tsx +++ b/packages/app-apw/src/views/contentReviewDashboard/components/ContentReviewStatus.tsx @@ -17,7 +17,11 @@ export const statusToLevel = { [ApwContentReviewStatus.PUBLISHED]: 2 }; -const CommentBadge: React.FC<{ comments: number }> = ({ comments, ...props }) => { +interface CommentBadgeProps { + comments: number; +} + +const CommentBadge = ({ comments, ...props }: CommentBadgeProps) => { return ( {comments} @@ -39,13 +43,13 @@ export interface ContentReviewStatusProps { content: ApwContentReviewContent; } -export const ContentReviewStatus: React.FC = ({ +export const ContentReviewStatus = ({ status, comments, reviewers, content, ...boxProps -}) => { +}: ContentReviewStatusProps) => { const level = statusToLevel[status]; const label = content.scheduledOn ? getScheduledMessage(status) : status; return ( diff --git a/packages/app-apw/src/views/contentReviewDashboard/components/ContentReviewSubmittedInfo.tsx b/packages/app-apw/src/views/contentReviewDashboard/components/ContentReviewSubmittedInfo.tsx index 067bc67a181..b36df843f68 100644 --- a/packages/app-apw/src/views/contentReviewDashboard/components/ContentReviewSubmittedInfo.tsx +++ b/packages/app-apw/src/views/contentReviewDashboard/components/ContentReviewSubmittedInfo.tsx @@ -17,7 +17,7 @@ export interface ContentReviewByProps { submittedOn: string; } -export const ContentReviewBy: React.FC = ({ submittedBy, submittedOn }) => { +export const ContentReviewBy = ({ submittedBy, submittedOn }: ContentReviewByProps) => { return ( diff --git a/packages/app-apw/src/views/contentReviewDashboard/components/LatestComment.tsx b/packages/app-apw/src/views/contentReviewDashboard/components/LatestComment.tsx index 938644eb480..6de3f8c8cd2 100644 --- a/packages/app-apw/src/views/contentReviewDashboard/components/LatestComment.tsx +++ b/packages/app-apw/src/views/contentReviewDashboard/components/LatestComment.tsx @@ -18,7 +18,7 @@ export interface LatestCommentProps { id: string; } -export const LatestComment: React.FC = ({ id, ...boxProps }) => { +export const LatestComment = ({ id, ...boxProps }: LatestCommentProps) => { const { comment, loading } = useComment(id); if (loading) { diff --git a/packages/app-apw/src/views/contentReviewDashboard/index.tsx b/packages/app-apw/src/views/contentReviewDashboard/index.tsx index bf30c171304..efc9cd2d557 100644 --- a/packages/app-apw/src/views/contentReviewDashboard/index.tsx +++ b/packages/app-apw/src/views/contentReviewDashboard/index.tsx @@ -4,7 +4,11 @@ import { leftPanel } from "@webiny/app-admin/components/SplitView/SplitView"; import { restGridStyles } from "../publishingWorkflows/components/Styled"; import { ContentReviewDataList } from "./ContentReviewDataList"; -const LayoutCenter: React.FC = ({ children }) => { +interface LayoutCenterProps { + children: React.ReactNode; +} + +const LayoutCenter = ({ children }: LayoutCenterProps) => { return ( diff --git a/packages/app-apw/src/views/publishingWorkflows/PublishingWorkflowsDataList.tsx b/packages/app-apw/src/views/publishingWorkflows/PublishingWorkflowsDataList.tsx index a193e9e5ff6..a74b4b7c36e 100644 --- a/packages/app-apw/src/views/publishingWorkflows/PublishingWorkflowsDataList.tsx +++ b/packages/app-apw/src/views/publishingWorkflows/PublishingWorkflowsDataList.tsx @@ -46,7 +46,7 @@ interface ListHeaderProps { app: ApwWorkflowApplications; } -const ListHeader: React.FC = ({ title, onClick, app }) => { +const ListHeader = ({ title, onClick, app }: ListHeaderProps) => { return ( @@ -80,7 +80,7 @@ const scopes: Record = { [ApwWorkflowApplications.CMS]: "Headless CMS" }; -const PublishingWorkflowsDataList: React.FC = () => { +const PublishingWorkflowsDataList = () => { const { workflows, loading, diff --git a/packages/app-apw/src/views/publishingWorkflows/components/ListItemWithCheckbox.tsx b/packages/app-apw/src/views/publishingWorkflows/components/ListItemWithCheckbox.tsx index 9db30faadb4..a3cdc1873cc 100644 --- a/packages/app-apw/src/views/publishingWorkflows/components/ListItemWithCheckbox.tsx +++ b/packages/app-apw/src/views/publishingWorkflows/components/ListItemWithCheckbox.tsx @@ -18,11 +18,7 @@ const CheckboxWrapper = styled.div` justify-content: flex-end; `; -export const ListItemWithCheckbox: React.FC = ({ - label, - value, - onChange -}) => { +export const ListItemWithCheckbox = ({ label, value, onChange }: ListItemWithCheckboxProps) => { return ( diff --git a/packages/app-apw/src/views/publishingWorkflows/components/ReviewersList.tsx b/packages/app-apw/src/views/publishingWorkflows/components/ReviewersList.tsx index cdb2208387a..e480f479ad8 100644 --- a/packages/app-apw/src/views/publishingWorkflows/components/ReviewersList.tsx +++ b/packages/app-apw/src/views/publishingWorkflows/components/ReviewersList.tsx @@ -31,7 +31,7 @@ interface ListItemTitleProps { index: number; } -const ListItemTitle: React.FC = ({ index, label }) => { +const ListItemTitle = ({ index, label }: ListItemTitleProps) => { return ( @@ -44,7 +44,7 @@ const ListItemTitle: React.FC = ({ index, label }) => { ); }; -export const ReviewersList: React.FC = ({ onChange, getValue }) => { +export const ReviewersList = ({ onChange, getValue }: ChildrenRenderProp) => { const { reviewers, loading } = useReviewers(); if (loading || !reviewers || reviewers.length === 0) { diff --git a/packages/app-apw/src/views/publishingWorkflows/components/cms/ApwHeadlessCmsWorkflowScope.tsx b/packages/app-apw/src/views/publishingWorkflows/components/cms/ApwHeadlessCmsWorkflowScope.tsx index fa078bd3e3a..5c3504db2fe 100644 --- a/packages/app-apw/src/views/publishingWorkflows/components/cms/ApwHeadlessCmsWorkflowScope.tsx +++ b/packages/app-apw/src/views/publishingWorkflows/components/cms/ApwHeadlessCmsWorkflowScope.tsx @@ -12,7 +12,7 @@ import { WorkflowScopeProps } from "~/views/publishingWorkflows/components/Workf const t = i18n.ns("app-apw/admin/publishing-workflows/form/cms"); -const HeadlessCmsWorkflowScope: React.FC = props => { +const HeadlessCmsWorkflowScope = (props: WorkflowScopeProps) => { const { Bind, workflow } = props; const { scope } = workflow; const noEntries = isEmpty(dotPropImmutable.get(scope, "data.entries")); diff --git a/packages/app-apw/src/views/publishingWorkflows/components/cms/CmsScopeSettings.tsx b/packages/app-apw/src/views/publishingWorkflows/components/cms/CmsScopeSettings.tsx index 49eca7f6440..43db0d61a74 100644 --- a/packages/app-apw/src/views/publishingWorkflows/components/cms/CmsScopeSettings.tsx +++ b/packages/app-apw/src/views/publishingWorkflows/components/cms/CmsScopeSettings.tsx @@ -48,7 +48,7 @@ interface CmsModelsListProps extends CmsScopeSettingsProps { loading: boolean; } -const CmsModelsList: React.FC = ({ Bind, runValidation, models, loading }) => { +const CmsModelsList = ({ Bind, runValidation, models, loading }: CmsModelsListProps) => { return ( @@ -92,7 +92,7 @@ interface CmsEntriesListProps { models: CmsModel[]; } -const CmsEntriesList: React.FC = ({ bind, models }) => { +const CmsEntriesList = ({ bind, models }: CmsEntriesListProps) => { const { loading, setQuery, options, value } = useCmsEntries({ bind, models @@ -148,7 +148,7 @@ interface CmsScopeSettingsProps { runValidation: boolean; } -export const CmsScopeSettings: React.FC = ({ Bind, runValidation }) => { +export const CmsScopeSettings = ({ Bind, runValidation }: CmsScopeSettingsProps) => { const { models = [], loading } = useCmsModels(); return ( diff --git a/packages/app-apw/src/views/publishingWorkflows/components/pageBuilder/ApwPageBuilderWorkflowScope.tsx b/packages/app-apw/src/views/publishingWorkflows/components/pageBuilder/ApwPageBuilderWorkflowScope.tsx index 457776885d1..f2ca2d0a9dc 100644 --- a/packages/app-apw/src/views/publishingWorkflows/components/pageBuilder/ApwPageBuilderWorkflowScope.tsx +++ b/packages/app-apw/src/views/publishingWorkflows/components/pageBuilder/ApwPageBuilderWorkflowScope.tsx @@ -12,7 +12,7 @@ import { WorkflowScopeProps } from "../WorkflowScope"; const t = i18n.ns("app-apw/admin/publishing-workflows/form/page-builder"); -const PageBuilderWorkflowScope: React.FC = props => { +const PageBuilderWorkflowScope = (props: WorkflowScopeProps) => { const { Bind, workflow } = props; const { scope } = workflow; const type = dotPropImmutable.get(scope, "type"); diff --git a/packages/app-apw/src/views/publishingWorkflows/components/pageBuilder/PbScopeSettings.tsx b/packages/app-apw/src/views/publishingWorkflows/components/pageBuilder/PbScopeSettings.tsx index e93405e8f94..da370089fcf 100644 --- a/packages/app-apw/src/views/publishingWorkflows/components/pageBuilder/PbScopeSettings.tsx +++ b/packages/app-apw/src/views/publishingWorkflows/components/pageBuilder/PbScopeSettings.tsx @@ -35,7 +35,7 @@ const tabStyles = css` type PbCategoriesProps = PbScopeSettingsProps; -const PbCategories: React.FC = ({ Bind, runValidation }) => { +const PbCategories = ({ Bind, runValidation }: PbCategoriesProps) => { const { categories, loading } = usePbCategories(); return ( @@ -79,7 +79,7 @@ interface PbPagesListProps { runValidation: boolean; } -const PbPagesList: React.FC = ({ bind }) => { +const PbPagesList = ({ bind }: PbPagesListProps) => { const { loading, setQuery, options, value } = usePbPages({ bind }); return ( @@ -111,7 +111,7 @@ interface PbScopeSettingsProps { runValidation: boolean; } -export const PbScopeSettings: React.FC = ({ Bind, runValidation }) => { +export const PbScopeSettings = ({ Bind, runValidation }: PbScopeSettingsProps) => { return ( diff --git a/packages/app-apw/src/views/publishingWorkflows/index.tsx b/packages/app-apw/src/views/publishingWorkflows/index.tsx index ad0dfc92f7b..f3a64c36875 100644 --- a/packages/app-apw/src/views/publishingWorkflows/index.tsx +++ b/packages/app-apw/src/views/publishingWorkflows/index.tsx @@ -3,7 +3,7 @@ import { SplitView, LeftPanel, RightPanel } from "@webiny/app-admin/components/S import PublishingWorkflowsDataList from "./PublishingWorkflowsDataList"; import PublishingWorkflowForm from "./PublishingWorkflowForm"; -export const PublishingWorkflowsView: React.FC = () => { +export const PublishingWorkflowsView = () => { return (