diff --git a/packages/doceditor/public/locales/en/CompletedForm.json b/packages/doceditor/public/locales/en/CompletedForm.json new file mode 100644 index 0000000000..43ff5c3d0b --- /dev/null +++ b/packages/doceditor/public/locales/en/CompletedForm.json @@ -0,0 +1,7 @@ +{ + "Title": "The form is completed", + "Description": "Your PDF form has been saved in the Complete section. You can fill out this form again and send another result.", + "BackToRoom": "Back to room", + "FillItOutAgain": "Fill it out again", + "GoToCompleteFolder": "Go to Complete folder" +} diff --git a/packages/doceditor/src/app/(root)/completed-form/layout.tsx b/packages/doceditor/src/app/(root)/completed-form/layout.tsx new file mode 100644 index 0000000000..7b753ac0c8 --- /dev/null +++ b/packages/doceditor/src/app/(root)/completed-form/layout.tsx @@ -0,0 +1,32 @@ +// (c) Copyright Ascensio System SIA 2009-2024 +// +// This program is a free software product. +// You can redistribute it and/or modify it under the terms +// of the GNU Affero General Public License (AGPL) version 3 as published by the Free Software +// Foundation. In accordance with Section 7(a) of the GNU AGPL its Section 15 shall be amended +// to the effect that Ascensio System SIA expressly excludes the warranty of non-infringement of +// any third-party rights. +// +// This program is distributed WITHOUT ANY WARRANTY, without even the implied warranty +// of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. For details, see +// the GNU AGPL at: http://www.gnu.org/licenses/agpl-3.0.html +// +// You can contact Ascensio System SIA at Lubanas st. 125a-25, Riga, Latvia, EU, LV-1021. +// +// The interactive user interfaces in modified source and object code versions of the Program must +// display Appropriate Legal Notices, as required under Section 5 of the GNU AGPL version 3. +// +// Pursuant to Section 7(b) of the License you must retain the original Product logo when +// distributing the program. Pursuant to Section 7(e) we decline to grant you any rights under +// trademark law for use of our trademarks. +// +// All the Product's GUI elements, including illustrations and icon sets, as well as technical writing +// content are licensed under the terms of the Creative Commons Attribution-ShareAlike 4.0 +// International. See the License terms at http://creativecommons.org/licenses/by-sa/4.0/legalcode +import React, { PropsWithChildren } from "react"; + +async function Layout({ children }: PropsWithChildren) { + return <>{children}; +} + +export default Layout; diff --git a/packages/doceditor/src/app/(root)/completed-form/page.tsx b/packages/doceditor/src/app/(root)/completed-form/page.tsx new file mode 100644 index 0000000000..2cc50a58c5 --- /dev/null +++ b/packages/doceditor/src/app/(root)/completed-form/page.tsx @@ -0,0 +1,38 @@ +// (c) Copyright Ascensio System SIA 2009-2024 +// +// This program is a free software product. +// You can redistribute it and/or modify it under the terms +// of the GNU Affero General Public License (AGPL) version 3 as published by the Free Software +// Foundation. In accordance with Section 7(a) of the GNU AGPL its Section 15 shall be amended +// to the effect that Ascensio System SIA expressly excludes the warranty of non-infringement of +// any third-party rights. +// +// This program is distributed WITHOUT ANY WARRANTY, without even the implied warranty +// of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. For details, see +// the GNU AGPL at: http://www.gnu.org/licenses/agpl-3.0.html +// +// You can contact Ascensio System SIA at Lubanas st. 125a-25, Riga, Latvia, EU, LV-1021. +// +// The interactive user interfaces in modified source and object code versions of the Program must +// display Appropriate Legal Notices, as required under Section 5 of the GNU AGPL version 3. +// +// Pursuant to Section 7(b) of the License you must retain the original Product logo when +// distributing the program. Pursuant to Section 7(e) we decline to grant you any rights under +// trademark law for use of our trademarks. +// +// All the Product's GUI elements, including illustrations and icon sets, as well as technical writing +// content are licensed under the terms of the Creative Commons Attribution-ShareAlike 4.0 +// International. See the License terms at http://creativecommons.org/licenses/by-sa/4.0/legalcode +import { cookies } from "next/headers"; + +import { ThemeKeys, WhiteLabelLogoType } from "@docspace/shared/enums"; +import { getLogoUrl } from "@docspace/shared/utils/common"; +import { SYSTEM_THEME_KEY } from "@docspace/shared/constants"; + +import { CompletedForm } from "@/components/completed-form"; + +async function Page() { + return ; +} + +export default Page; diff --git a/packages/doceditor/src/components/completed-form/CompletedForm.styled.ts b/packages/doceditor/src/components/completed-form/CompletedForm.styled.ts new file mode 100644 index 0000000000..897e4d59b6 --- /dev/null +++ b/packages/doceditor/src/components/completed-form/CompletedForm.styled.ts @@ -0,0 +1,124 @@ +// (c) Copyright Ascensio System SIA 2009-2024 +// +// This program is a free software product. +// You can redistribute it and/or modify it under the terms +// of the GNU Affero General Public License (AGPL) version 3 as published by the Free Software +// Foundation. In accordance with Section 7(a) of the GNU AGPL its Section 15 shall be amended +// to the effect that Ascensio System SIA expressly excludes the warranty of non-infringement of +// any third-party rights. +// +// This program is distributed WITHOUT ANY WARRANTY, without even the implied warranty +// of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. For details, see +// the GNU AGPL at: http://www.gnu.org/licenses/agpl-3.0.html +// +// You can contact Ascensio System SIA at Lubanas st. 125a-25, Riga, Latvia, EU, LV-1021. +// +// The interactive user interfaces in modified source and object code versions of the Program must +// display Appropriate Legal Notices, as required under Section 5 of the GNU AGPL version 3. +// +// Pursuant to Section 7(b) of the License you must retain the original Product logo when +// distributing the program. Pursuant to Section 7(e) we decline to grant you any rights under +// trademark law for use of our trademarks. +// +// All the Product's GUI elements, including illustrations and icon sets, as well as technical writing +// content are licensed under the terms of the Creative Commons Attribution-ShareAlike 4.0 +// International. See the License terms at http://creativecommons.org/licenses/by-sa/4.0/legalcode +"use client"; + +import styled from "styled-components"; + +import { mobile } from "@docspace/shared/utils"; + +import type { CompletedFormLayoutProps } from "./CompletedForm.types"; + +export const CompletedFormLayout = styled.section` + display: flex; + align-items: center; + flex-direction: column; + + box-sizing: border-box; + + width: 100%; + height: 100%; + + background-image: ${(props) => props.bgPattern}; + background-repeat: no-repeat; + background-attachment: fixed; + background-size: cover; + + padding-top: 100px; + + picture { + margin-bottom: 125px; + } + + .link { + font-weight: 600; + color: ${(props) => props.theme.completedForm.linkColor}; + } + + @media ${mobile} { + padding: 0 16px; + + background-image: none; + + .completed-form__icon { + width: 343px; + } + + picture { + display: flex; + align-self: center; + justify-content: center; + height: 48px; + width: 100vw; + margin: 0 -16px; + + margin-bottom: 32px; + + background-color: ${(props) => props.theme?.login?.navBackground}; + + img { + height: 24px; + align-self: center; + } + } + } +`; + +export const ButtonWrapper = styled.footer` + display: flex; + + gap: 8px; + + margin-bottom: 24px; + max-width: 648px; + width: 100%; + + @media ${mobile} { + flex-wrap: wrap; + } +`; + +export const TextWrapper = styled.section` + display: flex; + align-items: center; + flex-direction: column; + gap: 20px; + + margin: 24px 0; + + h1 { + line-height: 28px; + font-size: 23px; + font-weight: 700; + } + + p { + font-size: 14px; + line-height: 16px; + color: ${(props) => props.theme.completedForm.descriptionColor}; + text-align: center; + max-width: 480px; + } +`; diff --git a/packages/doceditor/src/components/completed-form/CompletedForm.tsx b/packages/doceditor/src/components/completed-form/CompletedForm.tsx new file mode 100644 index 0000000000..7ef456c9cb --- /dev/null +++ b/packages/doceditor/src/components/completed-form/CompletedForm.tsx @@ -0,0 +1,98 @@ +// (c) Copyright Ascensio System SIA 2009-2024 +// +// This program is a free software product. +// You can redistribute it and/or modify it under the terms +// of the GNU Affero General Public License (AGPL) version 3 as published by the Free Software +// Foundation. In accordance with Section 7(a) of the GNU AGPL its Section 15 shall be amended +// to the effect that Ascensio System SIA expressly excludes the warranty of non-infringement of +// any third-party rights. +// +// This program is distributed WITHOUT ANY WARRANTY, without even the implied warranty +// of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. For details, see +// the GNU AGPL at: http://www.gnu.org/licenses/agpl-3.0.html +// +// You can contact Ascensio System SIA at Lubanas st. 125a-25, Riga, Latvia, EU, LV-1021. +// +// The interactive user interfaces in modified source and object code versions of the Program must +// display Appropriate Legal Notices, as required under Section 5 of the GNU AGPL version 3. +// +// Pursuant to Section 7(b) of the License you must retain the original Product logo when +// distributing the program. Pursuant to Section 7(e) we decline to grant you any rights under +// trademark law for use of our trademarks. +// +// All the Product's GUI elements, including illustrations and icon sets, as well as technical writing +// content are licensed under the terms of the Creative Commons Attribution-ShareAlike 4.0 +// International. See the License terms at http://creativecommons.org/licenses/by-sa/4.0/legalcode +"use client"; + +import React, { useMemo } from "react"; +import { ReactSVG } from "react-svg"; +import { useTheme } from "styled-components"; +import { useTranslation } from "react-i18next"; + +import { Text } from "@docspace/shared/components/text"; +import { getBgPattern, getLogoUrl } from "@docspace/shared/utils/common"; + +import CompletedFormDarkIcon from "PUBLIC_DIR/images/completedForm/completed.form.icon.dark.svg?url"; +import CompletedFormLightIcon from "PUBLIC_DIR/images/completedForm/completed.form.icon.light.svg?url"; + +import { + CompletedFormLayout, + ButtonWrapper, + TextWrapper, +} from "./CompletedForm.styled"; +import type { CompletedFormProps } from "./CompletedForm.types"; +import { Button } from "@docspace/shared/components/button"; +import Link from "next/link"; +import { WhiteLabelLogoType } from "@docspace/shared/enums"; +import Image from "next/image"; + +export const CompletedForm = ({}: CompletedFormProps) => { + const theme = useTheme(); + const { t } = useTranslation(["CompletedForm"]); + + const { logoUrl, smallLogoUrl } = useMemo(() => { + const logoUrl = getLogoUrl(WhiteLabelLogoType.LoginPage, !theme.isBase); + const smallLogoUrl = getLogoUrl( + WhiteLabelLogoType.LightSmall, + !theme.isBase, + ); + + return { logoUrl, smallLogoUrl }; + }, [theme.isBase]); + + const bgPattern = useMemo( + () => getBgPattern(theme.currentColorScheme?.id), + [theme.currentColorScheme?.id], + ); + + const iconUrl = theme.isBase ? CompletedFormLightIcon : CompletedFormDarkIcon; + + return ( + + + + + logo + + icon + + {t("CompletedForm:Title")} + {t("CompletedForm:Description")} + + +