feat(namespace): migrate create ns to react [EE-2226] (#10377)

app/react/kubernetes/namespaces/components/NamespaceSummary.tsx

@@ -0,0 +1,46 @@
+import _ from 'lodash';
+
+import { FormSection } from '@@/form-components/FormSection';
+import { TextTip } from '@@/Tip/TextTip';
+
+import { CreateNamespaceFormValues } from '../CreateView/types';
+
+interface Props {
+  initialValues: CreateNamespaceFormValues;
+  values: CreateNamespaceFormValues;
+  isValid: boolean;
+}
+
+export function NamespaceSummary({ initialValues, values, isValid }: Props) {
+  const hasChanges = !_.isEqual(values, initialValues);
+
+  if (!hasChanges || !isValid) {
+    return null;
+  }
+
+  return (
+    <FormSection title="Summary" isFoldable defaultFolded={false}>
+      <div className="form-group">
+        <div className="col-sm-12">
+          <TextTip color="blue">
+            Portainer will execute the following Kubernetes actions.
+          </TextTip>
+        </div>
+      </div>
+      <div className="col-sm-12 small text-muted pt-1">
+        <ul>
+          <li>
+            Create a <span className="bold">Namespace</span> named{' '}
+            <code>{values.name}</code>
+          </li>
+          {values.resourceQuota.enabled && (
+            <li>
+              Create a <span className="bold">ResourceQuota</span> named{' '}
+              <code>portainer-rq-{values.name}</code>
+            </li>
+          )}
+        </ul>
+      </div>
+    </FormSection>
+  );
+}