refactor(edge): move edge deploy script to react [EE-2689] (#6747)

app/edge/components/EdgeScriptForm/EdgePropertiesForm.tsx

@@ -0,0 +1,75 @@
+import { FormControl } from '@/portainer/components/form-components/FormControl';
+import { Input } from '@/portainer/components/form-components/Input';
+import { FormSectionTitle } from '@/portainer/components/form-components/FormSectionTitle';
+import { SwitchField } from '@/portainer/components/form-components/SwitchField';
+
+import { OsSelector } from './OsSelector';
+import { EdgeProperties } from './types';
+
+interface Props {
+  setFieldValue<T>(key: string, value: T): void;
+  values: EdgeProperties;
+  hideIdGetter: boolean;
+}
+
+export function EdgePropertiesForm({
+  setFieldValue,
+  values,
+  hideIdGetter,
+}: Props) {
+  return (
+    <form className="form-horizontal">
+      <FormSectionTitle>Edge script settings</FormSectionTitle>
+
+      <OsSelector
+        value={values.os}
+        onChange={(os) => setFieldValue('os', os)}
+      />
+
+      {!hideIdGetter && (
+        <FormControl
+          label="Edge ID Generator"
+          tooltip="A bash script one liner that will generate the edge id"
+          inputId="edge-id-generator-input"
+        >
+          <Input
+            type="text"
+            name="edgeIdGenerator"
+            value={values.edgeIdGenerator}
+            id="edge-id-generator-input"
+            onChange={(e) => setFieldValue(e.target.name, e.target.value)}
+          />
+        </FormControl>
+      )}
+
+      <div className="form-group">
+        <div className="col-sm-12">
+          <SwitchField
+            checked={values.allowSelfSignedCertificates}
+            label="Allow self-signed certificates"
+            tooltip="When allowing self-signed certificates the edge agent will ignore the domain validation when connecting to Portainer via HTTPS"
+            onChange={(checked) =>
+              setFieldValue('allowSelfSignedCertificates', checked)
+            }
+          />
+        </div>
+      </div>
+
+      {values.platform !== 'k8s' && (
+        <FormControl
+          label="Environment variables"
+          tooltip="Comma separated list of environment variables that will be sourced from the host where the agent is deployed."
+          inputId="env-vars-input"
+        >
+          <Input
+            type="text"
+            name="envVars"
+            value={values.envVars}
+            id="env-vars-input"
+            onChange={(e) => setFieldValue(e.target.name, e.target.value)}
+          />
+        </FormControl>
+      )}
+    </form>
+  );
+}