RavenDB-22161 Add Azure Queue Storage Connection String to React views

ravendb · Apr 12, 2024 · b321213 · b321213
1 parent da7abea
commit b321213
Show file tree

Hide file tree

Showing 12 changed files with 446 additions and 35 deletions.
diff --git a/...ypescript/components/pages/database/settings/connectionStrings/ConnectionStrings.spec.tsx b/...ypescript/components/pages/database/settings/connectionStrings/ConnectionStrings.spec.tsx
@@ -1,7 +1,7 @@
 import React from "react";
 import { composeStories } from "@storybook/react";
 import * as stories from "./ConnectionStrings.stories";
-import { rtlRender, RtlScreen, waitForElementToBeRemoved } from "test/rtlTestUtils";
+import { rtlRender_WithWaitForLoad } from "test/rtlTestUtils";
 
 const { DefaultConnectionStrings } = composeStories(stories);
 
@@ -13,48 +13,40 @@ const selectors = {
 };
 
 describe("ConnectionStrings", () => {
-    async function waitForLoad(screen: RtlScreen) {
-        await waitForElementToBeRemoved(screen.getByClassName("lazy-load"));
-    }
-
     it("can render empty list", async () => {
-        const { screen } = rtlRender(<DefaultConnectionStrings isEmpty />);
-        await waitForLoad(screen);
+        const { screen } = await rtlRender_WithWaitForLoad(<DefaultConnectionStrings isEmpty />);
 
         expect(screen.getByText(selectors.emptyList)).toBeInTheDocument();
     });
 
     it("can render connection strings", async () => {
-        const { screen } = rtlRender(<DefaultConnectionStrings />);
-        await waitForLoad(screen);
+        const { screen } = await rtlRender_WithWaitForLoad(<DefaultConnectionStrings />);
 
         expect(screen.queryByText(selectors.emptyList)).not.toBeInTheDocument();
-        expect(screen.queryAllByClassName("rich-panel-name")).toHaveLength(6);
+        expect(screen.queryAllByClassName("rich-panel-name")).toHaveLength(7);
     });
 
     it("can render action buttons when has access database admin", async () => {
-        const { screen } = rtlRender(<DefaultConnectionStrings databaseAccess="DatabaseAdmin" />);
-        await waitForLoad(screen);
+        const { screen } = await rtlRender_WithWaitForLoad(<DefaultConnectionStrings databaseAccess="DatabaseAdmin" />);
 
         // one on the top + one per connection string
-        expect(screen.queryAllByRole("button", { name: selectors.addNew })).toHaveLength(7);
+        expect(screen.queryAllByRole("button", { name: selectors.addNew })).toHaveLength(8);
 
         // one per connection string
-        expect(screen.queryAllByRole("button", { name: selectors.edit })).toHaveLength(6);
-        expect(screen.queryAllByRole("button", { name: selectors.delete })).toHaveLength(6);
+        expect(screen.queryAllByRole("button", { name: selectors.edit })).toHaveLength(7);
+        expect(screen.queryAllByRole("button", { name: selectors.delete })).toHaveLength(7);
     });
 
     it("can hide action buttons when has access below database admin", async () => {
-        const { screen } = rtlRender(<DefaultConnectionStrings databaseAccess="DatabaseRead" />);
-        await waitForLoad(screen);
+        const { screen } = await rtlRender_WithWaitForLoad(<DefaultConnectionStrings databaseAccess="DatabaseRead" />);
 
         expect(screen.queryAllByRole("button", { name: selectors.addNew })).toHaveLength(0);
         expect(screen.queryAllByRole("button", { name: selectors.edit })).toHaveLength(0);
         expect(screen.queryAllByRole("button", { name: selectors.delete })).toHaveLength(0);
     });
 
     it("can disable add button when no license", async () => {
-        const { screen } = rtlRender(
+        const { screen } = await rtlRender_WithWaitForLoad(
             <DefaultConnectionStrings
                 isEmpty
                 hasElasticSearchEtl={false}
@@ -64,7 +56,6 @@ describe("ConnectionStrings", () => {
                 hasQueueEtl={false}
             />
         );
-        await waitForLoad(screen);
 
         expect(screen.getByRole("button", { name: selectors.addNew })).toBeDisabled();
     });

diff --git a/...script/components/pages/database/settings/connectionStrings/ConnectionStrings.stories.tsx b/...script/components/pages/database/settings/connectionStrings/ConnectionStrings.stories.tsx
@@ -10,10 +10,6 @@ import { SharedStubs } from "test/stubs/SharedStubs";
 export default {
     title: "Pages/Database/Settings",
     decorators: [withStorybookContexts, withBootstrap5],
-    argTypes: {
-        licenseType: licenseArgType,
-        databaseAccess: databaseAccessArgType,
-    },
 } satisfies Meta;
 
 interface DefaultConnectionStringsProps {
@@ -83,6 +79,10 @@ export const DefaultConnectionStrings: StoryObj<DefaultConnectionStringsProps> =
         hasElasticSearchEtl: true,
         hasQueueEtl: true,
     },
+    argTypes: {
+        licenseType: licenseArgType,
+        databaseAccess: databaseAccessArgType,
+    },
 };
 
 function mockTestResults(isSuccess: boolean) {

diff --git a/...escript/components/pages/database/settings/connectionStrings/ConnectionStringsInfoHub.tsx b/...escript/components/pages/database/settings/connectionStrings/ConnectionStringsInfoHub.tsx
@@ -36,8 +36,10 @@ export function ConnectionStringsInfoHub() {
                 featureName: defaultFeatureAvailability[5].featureName,
                 value: features.hasQueueEtl,
             },
-
-            //TODO: azure
+            {
+                featureName: defaultFeatureAvailability[6].featureName,
+                value: features.hasQueueEtl,
+            },
         ],
     });
 
@@ -119,5 +121,11 @@ const defaultFeatureAvailability: FeatureAvailabilityData[] = [
         professional: { value: false },
         enterprise: { value: true },
     },
-    //TODO: azure
+    {
+        featureName: "Azure Queue Storage ETL",
+        featureIcon: "azure-queue-storage-etl",
+        community: { value: false },
+        professional: { value: false },
+        enterprise: { value: true },
+    },
 ];
diff --git a/...pescript/components/pages/database/settings/connectionStrings/ConnectionStringsPanels.tsx b/...pescript/components/pages/database/settings/connectionStrings/ConnectionStringsPanels.tsx
@@ -59,6 +59,8 @@ function getTypeLabel(type: StudioEtlType): string {
             return "RavenDB";
         case "Sql":
             return "SQL";
+        case "AzureQueueStorage":
+            return "Azure Queue Storage";
         default:
             return type;
     }

diff --git a/...typescript/components/pages/database/settings/connectionStrings/EditConnectionStrings.tsx b/...typescript/components/pages/database/settings/connectionStrings/EditConnectionStrings.tsx
@@ -25,6 +25,7 @@ import useConnectionStringsLicense, { ConnectionStringsLicenseFeatures } from ".
 import assertUnreachable from "components/utils/assertUnreachable";
 import { databaseSelectors } from "components/common/shell/databaseSliceSelectors";
 import { useAppSelector } from "components/store";
+import AzureQueueStorageConnectionString from "components/pages/database/settings/connectionStrings/editForms/AzureQueueStorageConnectionString";
 
 export interface EditConnectionStringsProps {
     initialConnection?: Connection;
@@ -181,7 +182,7 @@ function getEditConnectionStringComponent(type: StudioEtlType): (props: EditConn
         case "RabbitMQ":
             return RabbitMqConnectionString;
         case "AzureQueueStorage":
-            throw new Error("Not implemeted"); //TODO:
+            return AzureQueueStorageConnectionString;
         default:
             return null;
     }

diff --git a/...typescript/components/pages/database/settings/connectionStrings/connectionStringsTypes.ts b/...typescript/components/pages/database/settings/connectionStrings/connectionStringsTypes.ts
@@ -2,6 +2,8 @@ import ElasticSearchConnectionStringDto = Raven.Client.Documents.Operations.ETL.
 import OlapConnectionStringDto = Raven.Client.Documents.Operations.ETL.OLAP.OlapConnectionString;
 import QueueConnectionStringDto = Raven.Client.Documents.Operations.ETL.Queue.QueueConnectionString;
 import RavenConnectionStringDto = Raven.Client.Documents.Operations.ETL.RavenConnectionString;
+import AzureQueueStorageConnectionSettingsDto = Raven.Client.Documents.Operations.ETL.Queue.AzureQueueStorageConnectionSettings;
+
 type SqlConnectionStringDto = SqlConnectionString;
 import { FormDestinations } from "components/common/formDestinations/utils/formDestinationsTypes";
 
@@ -68,7 +70,21 @@ export interface RabbitMqConnection extends ConnectionBase {
 
 export interface AzureQueueStorageConnection extends ConnectionBase {
     type: Extract<StudioEtlType, "AzureQueueStorage">;
-    connectionString?: string; //TODO: other props
+    authType?: AzureQueueStorageAuthenticationType;
+    settings?: {
+        connectionString?: {
+            connectionStringValue?: string;
+        };
+        entraId?: {
+            clientId?: string;
+            clientSecret?: string;
+            storageAccountName?: string;
+            tenantId?: string;
+        };
+        passwordless?: {
+            storageAccountName?: string;
+        };
+    };
 }
 
 export type Connection =
@@ -86,6 +102,7 @@ export type ConnectionStringDto = Partial<
     | QueueConnectionStringDto
     | RavenConnectionStringDto
     | SqlConnectionStringDto
+    | AzureQueueStorageConnectionSettingsDto
 >;
 
 export interface EditConnectionStringFormProps {