From 13d917e62da62a8e4bd4760b75dbc954143f224f Mon Sep 17 00:00:00 2001
From: Rory Doak <rory@opensystemslab.io>
Date: Tue, 12 Nov 2024 15:25:11 +0000
Subject: [PATCH] copy refinement

scroll to view warning message

revert scroll view and simplify demo user screens

refine boolean code and remove redundant space

copy refinement on send component
---
 .../components/Pay/Public/InviteToPayForm.tsx | 36 +++++--------------
 .../src/@planx/components/Pay/Public/Pay.tsx  | 21 ++++++-----
 .../src/@planx/components/Send/Public.tsx     | 12 +++----
 3 files changed, 27 insertions(+), 42 deletions(-)

diff --git a/editor.planx.uk/src/@planx/components/Pay/Public/InviteToPayForm.tsx b/editor.planx.uk/src/@planx/components/Pay/Public/InviteToPayForm.tsx
index 65e1940077..b3c0e4637c 100644
--- a/editor.planx.uk/src/@planx/components/Pay/Public/InviteToPayForm.tsx
+++ b/editor.planx.uk/src/@planx/components/Pay/Public/InviteToPayForm.tsx
@@ -8,7 +8,6 @@ import type {
   PaymentStatus,
 } from "@opensystemslab/planx-core/types";
 import Card from "@planx/components/shared/Preview/Card";
-import { ErrorSummaryContainer } from "@planx/components/shared/Preview/ErrorSummaryContainer";
 import SaveResumeButton from "@planx/components/shared/Preview/SaveResumeButton";
 import { WarningContainer } from "@planx/components/shared/Preview/WarningContainer";
 import DelayedLoadingIndicator from "components/DelayedLoadingIndicator/DelayedLoadingIndicator";
@@ -87,11 +86,7 @@ const InviteToPayForm: React.FC<InviteToPayFormProps> = ({
   yourDetailsLabel,
   paymentStatus,
 }) => {
-  const [sessionId, path, teamSlug] = useStore((state) => [
-    state.sessionId,
-    state.path,
-    state.teamSlug,
-  ]);
+  const [sessionId, path] = useStore((state) => [state.sessionId, state.path]);
   const [isLoading, setIsLoading] = useState(false);
   const [error, setError] = useState(false);
   const isSaveReturn = path === ApplicationPath.SaveAndReturn;
@@ -257,16 +252,15 @@ const InviteToPayForm: React.FC<InviteToPayFormProps> = ({
             no longer be able to make changes.
           </Typography>
         </WarningContainer>
-        {teamSlug !== "demo" &&
-          (error ? (
-            <ErrorWrapper
-              error={"Error generating payment request, please try again"}
-            >
-              <SubmitButton />
-            </ErrorWrapper>
-          ) : (
+        {error ? (
+          <ErrorWrapper
+            error={"Error generating payment request, please try again"}
+          >
             <SubmitButton />
-          ))}
+          </ErrorWrapper>
+        ) : (
+          <SubmitButton />
+        )}
       </StyledForm>
       <Button
         variant="contained"
@@ -278,18 +272,6 @@ const InviteToPayForm: React.FC<InviteToPayFormProps> = ({
       >
         {"I want to pay for this application myself"}
       </Button>
-
-      {teamSlug === "demo" && (
-        <ErrorSummaryContainer mt={2}>
-          <Typography variant="h4" ml={2} mb={1}>
-            GOV.UK Pay is not configured for the Demo team
-          </Typography>
-          <Typography variant="body2" ml={2}>
-            You can click "I want to pay for this application myself" to
-            continue your application
-          </Typography>
-        </ErrorSummaryContainer>
-      )}
       {isSaveReturn && <SaveResumeButton />}
     </Card>
   );
diff --git a/editor.planx.uk/src/@planx/components/Pay/Public/Pay.tsx b/editor.planx.uk/src/@planx/components/Pay/Public/Pay.tsx
index f9f4a4398c..9466b24783 100644
--- a/editor.planx.uk/src/@planx/components/Pay/Public/Pay.tsx
+++ b/editor.planx.uk/src/@planx/components/Pay/Public/Pay.tsx
@@ -41,8 +41,7 @@ enum Action {
   Success,
 }
 
-export const PAY_API_ERROR_UNSUPPORTED_TEAM =
-  "GOV.UK Pay is not enabled for this local authority";
+export const PAY_API_ERROR_UNSUPPORTED_TEAM = "GOV.UK Pay is not enabled for";
 
 function Component(props: Props) {
   const [
@@ -76,6 +75,11 @@ function Component(props: Props) {
 
   const metadata = [...(props.govPayMetadata || []), ...defaultMetadata];
 
+  const errorMessage =
+    teamSlug !== "demo"
+      ? "GOV.UK Pay is not enabled for this local authority"
+      : "GOV.UK Pay is not enabled for the Demo team";
+
   // Handles UI states
   const reducer = (_state: ComponentState, action: Action): ComponentState => {
     switch (action) {
@@ -114,6 +118,10 @@ function Component(props: Props) {
 
   const handleError = useErrorHandler();
 
+  const isTeamSupported =
+    state.status !== "unsupported_team" && teamSlug !== "demo";
+  const showPayOptions = props.allowInviteToPay && !props.hidePay;
+
   useEffect(() => {
     // Auto-skip component when fee=0
     if (fee <= 0) {
@@ -294,17 +302,12 @@ function Component(props: Props) {
               : "Retry payment"
           }
           error={
-            (state.status === "unsupported_team" &&
-              "GOV.UK Pay is not enabled for this local authority") ||
+            (state.status === "unsupported_team" && errorMessage) ||
             (state.status === "undefined_fee" &&
               "We are unable to calculate your fee right now") ||
             undefined
           }
-          showInviteToPay={
-            props.allowInviteToPay &&
-            !props.hidePay &&
-            state.status !== "unsupported_team"
-          }
+          showInviteToPay={showPayOptions && isTeamSupported}
           paymentStatus={govUkPayment?.state?.status}
           hidePay={props.hidePay}
         />
diff --git a/editor.planx.uk/src/@planx/components/Send/Public.tsx b/editor.planx.uk/src/@planx/components/Send/Public.tsx
index a8cdb4f94e..868a27cb88 100644
--- a/editor.planx.uk/src/@planx/components/Send/Public.tsx
+++ b/editor.planx.uk/src/@planx/components/Send/Public.tsx
@@ -33,7 +33,7 @@ const SendComponent: React.FC<Props> = ({
   ) {
     return <SkipSendWarning {...fullProps} />;
   } else if (window.location.pathname.split("/")[1] === "demo") {
-    return <DemoTeamWarning />;
+    return <DemoTeamWarning {...fullProps} />;
   } else {
     return <CreateSendEvents {...fullProps} />;
   }
@@ -55,15 +55,15 @@ const SkipSendWarning: React.FC<Props> = (props) => (
   </Card>
 );
 
-const DemoTeamWarning: React.FC = () => (
-  <Card>
+const DemoTeamWarning: React.FC<Props> = (props) => (
+  <Card handleSubmit={props.handleSubmit}>
     <ErrorSummaryContainer role="status">
       <Typography variant="h4" ml={2} mb={1}>
-        The send component is not configured for the Demo team
+        Send is disabled for the Demo team
       </Typography>
       <Typography variant="body2" ml={2}>
-        Integrations need to be configured to allow submissions to be sent from
-        PlanX
+        Team integrations need to be configured to allow submissions to be sent
+        from PlanX
       </Typography>
     </ErrorSummaryContainer>
   </Card>