From 9ddafee2cce67e9ece7f8c648e3a4ea63d51dd47 Mon Sep 17 00:00:00 2001
From: Anton Voylenko <anton.voylenko@gmail.com>
Date: Tue, 12 Sep 2023 19:28:03 +0300
Subject: [PATCH] feat: support s3 compatible storage (#318)

* feat: support s3 compatible storage

* reorder vendor list
---
 src/api/constants.ts                          |  9 +-
 src/api/types.ts                              |  1 +
 .../internal/views/accounts/form.tsx          | 92 ++++++++++++++-----
 3 files changed, 77 insertions(+), 25 deletions(-)

diff --git a/src/api/constants.ts b/src/api/constants.ts
index 8a92ddf..f20fe2d 100644
--- a/src/api/constants.ts
+++ b/src/api/constants.ts
@@ -161,6 +161,7 @@ export const SIP_GATEWAY_PROTOCOL_OPTIONS = [
  * Record bucket type
  */
 export const BUCKET_VENDOR_AWS = "aws_s3";
+export const BUCKET_VENDOR_S3_COMPATIBLE = "s3_compatible";
 export const BUCKET_VENDOR_GOOGLE = "google";
 export const BUCKET_VENDOR_AZURE = "azure";
 export const BUCKET_VENDOR_OPTIONS = [
@@ -173,13 +174,17 @@ export const BUCKET_VENDOR_OPTIONS = [
     value: BUCKET_VENDOR_AWS,
   },
   {
-    name: "Google Cloud Storage",
-    value: BUCKET_VENDOR_GOOGLE,
+    name: "AWS S3 Compatible",
+    value: BUCKET_VENDOR_S3_COMPATIBLE,
   },
   {
     name: "Azure Cloud Storage",
     value: BUCKET_VENDOR_AZURE,
   },
+  {
+    name: "Google Cloud Storage",
+    value: BUCKET_VENDOR_GOOGLE,
+  },
 ];
 
 export const AUDIO_FORMAT_OPTIONS = [
diff --git a/src/api/types.ts b/src/api/types.ts
index 77f228e..b226ff3 100644
--- a/src/api/types.ts
+++ b/src/api/types.ts
@@ -306,6 +306,7 @@ export interface BucketCredential {
   tags?: null | AwsTag[];
   service_key?: null | string;
   connection_string?: null | string;
+  endpoint?: null | string;
 }
 
 export interface Application {
diff --git a/src/containers/internal/views/accounts/form.tsx b/src/containers/internal/views/accounts/form.tsx
index c574a09..36de3c5 100644
--- a/src/containers/internal/views/accounts/form.tsx
+++ b/src/containers/internal/views/accounts/form.tsx
@@ -28,6 +28,7 @@ import { ROUTE_INTERNAL_ACCOUNTS } from "src/router/routes";
 import {
   AUDIO_FORMAT_OPTIONS,
   BUCKET_VENDOR_AWS,
+  BUCKET_VENDOR_S3_COMPATIBLE,
   BUCKET_VENDOR_AZURE,
   BUCKET_VENDOR_GOOGLE,
   BUCKET_VENDOR_OPTIONS,
@@ -131,6 +132,7 @@ export const AccountForm = ({
   const deleteMessageRef = useRef<HTMLInputElement | null>(null);
   const [isShowModalLoader, setIsShowModalLoader] = useState(false);
   const [azureConnectionString, setAzureConnectionString] = useState("");
+  const [endpoint, setEndpoint] = useState("");
 
   /** This lets us map and render the same UI for each... */
   const webhooks = [
@@ -265,6 +267,11 @@ export const AccountForm = ({
       ...(bucketVendor === BUCKET_VENDOR_AZURE && {
         connection_string: azureConnectionString,
       }),
+      ...(bucketVendor === BUCKET_VENDOR_S3_COMPATIBLE && {
+        endpoint: endpoint,
+        access_key_id: bucketAccessKeyId,
+        secret_access_key: bucketSecretAccessKey,
+      }),
     };
 
     postAccountBucketCredentialTest(account?.data?.account_sid, cred).then(
@@ -403,6 +410,16 @@ export const AccountForm = ({
             connection_string: azureConnectionString || null,
           },
         }),
+        ...(bucketVendor === BUCKET_VENDOR_S3_COMPATIBLE && {
+          bucket_credential: {
+            vendor: bucketVendor || null,
+            endpoint: endpoint || null,
+            name: bucketName || null,
+            access_key_id: bucketAccessKeyId || null,
+            secret_access_key: bucketSecretAccessKey || null,
+            ...(hasLength(bucketTags) && { tags: bucketTags }),
+          },
+        }),
         ...(!bucketCredentialChecked && {
           record_all_calls: 0,
           bucket_credential: {
@@ -512,6 +529,9 @@ export const AccountForm = ({
           account.data.bucket_credential.connection_string
         );
       }
+      if (account.data.bucket_credential?.endpoint) {
+        setEndpoint(account.data.bucket_credential.endpoint);
+      }
       if (account.data.record_all_calls) {
         setRecordAllCalls(account.data.record_all_calls ? true : false);
       }
@@ -1029,6 +1049,24 @@ export const AccountForm = ({
                       }}
                     />
                   </div>
+                  {bucketVendor === BUCKET_VENDOR_S3_COMPATIBLE && (
+                    <>
+                      <label htmlFor="endpoint">
+                        Endpoint URI<span>*</span>
+                      </label>
+                      <input
+                        id="endpoint"
+                        required
+                        type="text"
+                        name="endpoint"
+                        placeholder="https://domain.com"
+                        value={endpoint}
+                        onChange={(e) => {
+                          setEndpoint(e.target.value);
+                        }}
+                      />
+                    </>
+                  )}
                   <label htmlFor="bucket_name">
                     {bucketVendor === BUCKET_VENDOR_AZURE
                       ? "Container"
@@ -1051,28 +1089,31 @@ export const AccountForm = ({
                       setTmpBucketName(e.target.value);
                     }}
                   />
-                  {bucketVendor === BUCKET_VENDOR_AWS && (
+                  {(bucketVendor === BUCKET_VENDOR_AWS ||
+                    bucketVendor === BUCKET_VENDOR_S3_COMPATIBLE) && (
                     <>
-                      {regions && regions["aws"] && (
-                        <>
-                          <label htmlFor="bucket_aws_region">
-                            Region<span>*</span>
-                          </label>
-                          <Selector
-                            id="region"
-                            name="region"
-                            value={bucketRegion}
-                            required
-                            options={[
-                              {
-                                name: "Select a region",
-                                value: "",
-                              },
-                            ].concat(regions["aws"])}
-                            onChange={(e) => setBucketRegion(e.target.value)}
-                          />
-                        </>
-                      )}
+                      {bucketVendor === BUCKET_VENDOR_AWS &&
+                        regions &&
+                        regions["aws"] && (
+                          <>
+                            <label htmlFor="bucket_aws_region">
+                              Region<span>*</span>
+                            </label>
+                            <Selector
+                              id="region"
+                              name="region"
+                              value={bucketRegion}
+                              required
+                              options={[
+                                {
+                                  name: "Select a region",
+                                  value: "",
+                                },
+                              ].concat(regions["aws"])}
+                              onChange={(e) => setBucketRegion(e.target.value)}
+                            />
+                          </>
+                        )}
                       <label htmlFor="bucket_aws_access_key">
                         Access key ID<span>*</span>
                       </label>
@@ -1151,7 +1192,8 @@ export const AccountForm = ({
                     </>
                   )}
                   <label htmlFor="aws_s3_tags">
-                    {bucketVendor === BUCKET_VENDOR_AWS
+                    {bucketVendor === BUCKET_VENDOR_AWS ||
+                    bucketVendor === BUCKET_VENDOR_S3_COMPATIBLE
                       ? "S3"
                       : bucketVendor === BUCKET_VENDOR_GOOGLE
                       ? "Google Cloud Storage"
@@ -1230,7 +1272,11 @@ export const AccountForm = ({
                         (bucketVendor === BUCKET_VENDOR_GOOGLE &&
                           !bucketGoogleServiceKey) ||
                         (bucketVendor === BUCKET_VENDOR_AZURE &&
-                          !azureConnectionString)
+                          !azureConnectionString) ||
+                        (bucketVendor === BUCKET_VENDOR_S3_COMPATIBLE &&
+                          (!endpoint ||
+                            !bucketAccessKeyId ||
+                            !bucketSecretAccessKey))
                       }
                     >
                       Test