feat(secret-scanning): BitBucket data source

frontend/src/components/secret-scanning/forms/SecretScanningDataSourceConfigFields/BitBucketDataSourceConfigFields.tsx

@@ -0,0 +1,122 @@
+import { useEffect } from "react";
+import { Controller, useFormContext, useWatch } from "react-hook-form";
+import { MultiValue } from "react-select";
+import { faCircleInfo } from "@fortawesome/free-solid-svg-icons";
+import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
+
+import { FilterableSelect, FormControl, Select, SelectItem, Tooltip } from "@app/components/v2";
+import {
+  TBitBucketRepo,
+  useBitBucketConnectionListRepositories
+} from "@app/hooks/api/appConnections/bitbucket";
+import { SecretScanningDataSource } from "@app/hooks/api/secretScanningV2";
+
+import { TSecretScanningDataSourceForm } from "../schemas";
+import { SecretScanningDataSourceConnectionField } from "../SecretScanningDataSourceConnectionField";
+
+enum ScanMethod {
+  AllRepositories = "all-repositories",
+  SelectRepositories = "select-repositories"
+}
+
+export const BitBucketDataSourceConfigFields = () => {
+  const { control, watch, setValue } = useFormContext<
+    TSecretScanningDataSourceForm & {
+      type: SecretScanningDataSource.BitBucket;
+    }
+  >();
+
+  const connectionId = useWatch({ control, name: "connection.id" });
+  const isUpdate = Boolean(watch("id"));
+
+  const { data: repositories, isPending: areRepositoriesLoading } =
+    useBitBucketConnectionListRepositories(connectionId, { enabled: Boolean(connectionId) });
+
+  const includeRepos = watch("config.includeRepos");
+
+  const scanMethod =
+    !includeRepos || includeRepos[0] === "*"
+      ? ScanMethod.AllRepositories
+      : ScanMethod.SelectRepositories;
+
+  useEffect(() => {
+    if (!includeRepos) {
+      setValue("config.includeRepos", ["*"]);
+    }
+  }, [includeRepos, setValue]);
+
+  return (
+    <>
+      <SecretScanningDataSourceConnectionField
+        isUpdate={isUpdate}
+        onChange={() => {
+          if (scanMethod === ScanMethod.SelectRepositories) {
+            setValue("config.includeRepos", []);
+          }
+        }}
+      />
+      <FormControl label="Scan Repositories">
+        <Select
+          value={scanMethod}
+          onValueChange={(val) => {
+            setValue("config.includeRepos", val === ScanMethod.AllRepositories ? ["*"] : []);
+          }}
+          className="w-full border border-mineshaft-500 capitalize"
+          position="popper"
+          dropdownContainerClassName="max-w-none"
+          isDisabled={!connectionId}
+        >
+          {Object.values(ScanMethod).map((method) => {
+            return (
+              <SelectItem className="capitalize" value={method} key={method}>
+                {method.replace("-", " ")}
+              </SelectItem>
+            );
+          })}
+        </Select>
+      </FormControl>
+      {scanMethod === ScanMethod.SelectRepositories && (
+        <Controller
+          name="config.includeRepos"
+          defaultValue={["*"]}
+          control={control}
+          render={({ field: { value, onChange }, fieldState: { error } }) => (
+            <FormControl
+              isError={Boolean(error)}
+              errorText={error?.message}
+              label="Include Repositories"
+              helperText={
+                <Tooltip
+                  className="max-w-md"
+                  content={<>Ensure that your connection has the correct permissions.</>}
+                >
+                  <div>
+                    <span>Don&#39;t see the repository you&#39;re looking for?</span>{" "}
+                    <FontAwesomeIcon icon={faCircleInfo} className="text-mineshaft-400" />
+                  </div>
+                </Tooltip>
+              }
+            >
+              <FilterableSelect
+                menuPlacement="top"
+                isLoading={areRepositoriesLoading && Boolean(connectionId)}
+                isDisabled={!connectionId}
+                isMulti
+                value={repositories?.filter((repository) => value.includes(repository.name))}
+                onChange={(newValue) => {
+                  onChange(
+                    newValue ? (newValue as MultiValue<TBitBucketRepo>).map((p) => p.name) : null
+                  );
+                }}
+                options={repositories}
+                placeholder="Select repositories..."
+                getOptionLabel={(option) => option.name}
+                getOptionValue={(option) => option.name}
+              />
+            </FormControl>
+          )}
+        />
+      )}
+    </>
+  );
+};

frontend/src/components/secret-scanning/forms/SecretScanningDataSourceConfigFields/SecretScanningDataSourceConfigFields.tsx

@@ -5,10 +5,12 @@ import { RESOURCE_DESCRIPTION_HELPER } from "@app/helpers/secretScanningV2";
 import { SecretScanningDataSource } from "@app/hooks/api/secretScanningV2";
 
 import { TSecretScanningDataSourceForm } from "../schemas";
+import { BitBucketDataSourceConfigFields } from "./BitBucketDataSourceConfigFields";
 import { GitHubDataSourceConfigFields } from "./GitHubDataSourceConfigFields";
 
 const COMPONENT_MAP: Record<SecretScanningDataSource, React.FC> = {
-  [SecretScanningDataSource.GitHub]: GitHubDataSourceConfigFields
+  [SecretScanningDataSource.GitHub]: GitHubDataSourceConfigFields,
+  [SecretScanningDataSource.BitBucket]: BitBucketDataSourceConfigFields
 };
 
 export const SecretScanningDataSourceConfigFields = () => {

frontend/src/components/secret-scanning/forms/SecretScanningDataSourceReviewFields/BitBucketDataSourceReviewFields.tsx

@@ -0,0 +1,27 @@
+import { useFormContext } from "react-hook-form";
+
+import { GenericFieldLabel } from "@app/components/v2";
+import { SecretScanningDataSource } from "@app/hooks/api/secretScanningV2";
+
+import { TSecretScanningDataSourceForm } from "../schemas";
+import { SecretScanningDataSourceConfigReviewSection } from "./shared";
+
+export const BitBucketDataSourceReviewFields = () => {
+  const { watch } = useFormContext<
+    TSecretScanningDataSourceForm & {
+      type: SecretScanningDataSource.BitBucket;
+    }
+  >();
+
+  const [{ includeRepos }, connection] = watch(["config", "connection"]);
+  const shouldScanAll = includeRepos[0] === "*";
+
+  return (
+    <SecretScanningDataSourceConfigReviewSection>
+      {connection && <GenericFieldLabel label="Connection">{connection.name}</GenericFieldLabel>}
+      <GenericFieldLabel label="Scan Repositories">
+        {shouldScanAll ? "All" : includeRepos.join(", ")}
+      </GenericFieldLabel>
+    </SecretScanningDataSourceConfigReviewSection>
+  );
+};

frontend/src/components/secret-scanning/forms/SecretScanningDataSourceReviewFields/SecretScanningDataSourceReviewFields.tsx

@@ -4,10 +4,12 @@ import { GenericFieldLabel } from "@app/components/v2";
 import { SecretScanningDataSource } from "@app/hooks/api/secretScanningV2";
 
 import { TSecretScanningDataSourceForm } from "../schemas";
+import { BitBucketDataSourceReviewFields } from "./BitBucketDataSourceReviewFields";
 import { GitHubDataSourceReviewFields } from "./GitHubDataSourceReviewFields";
 
 const COMPONENT_MAP: Record<SecretScanningDataSource, React.FC> = {
-  [SecretScanningDataSource.GitHub]: GitHubDataSourceReviewFields
+  [SecretScanningDataSource.GitHub]: GitHubDataSourceReviewFields,
+  [SecretScanningDataSource.BitBucket]: BitBucketDataSourceReviewFields
 };
 
 export const SecretScanningDataSourceReviewFields = () => {

frontend/src/components/secret-scanning/forms/schemas/bitbucket-data-source-schema.ts

@@ -0,0 +1,18 @@
+import { z } from "zod";
+
+import { SecretScanningDataSource } from "@app/hooks/api/secretScanningV2";
+
+import { BaseSecretScanningDataSourceSchema } from "./base-secret-scanning-data-source-schema";
+
+export const BitBucketDataSourceSchema = z
+  .object({
+    type: z.literal(SecretScanningDataSource.BitBucket),
+    config: z.object({
+      includeRepos: z
+        .string()
+        .array()
+        .min(1, "One or more repositories required")
+        .max(100, "Cannot configure more than 100 repositories")
+    })
+  })
+  .merge(BaseSecretScanningDataSourceSchema({ isConnectionRequired: true }));

frontend/src/components/secret-scanning/forms/schemas/index.ts

@@ -1,9 +1,11 @@
 import { z } from "zod";
 
+import { BitBucketDataSourceSchema } from "./bitbucket-data-source-schema";
 import { GitHubDataSourceSchema } from "./github-data-source-schema";
 
 export const SecretScanningDataSourceSchema = z.discriminatedUnion("type", [
-  GitHubDataSourceSchema
+  GitHubDataSourceSchema,
+  BitBucketDataSourceSchema
 ]);
 
 export type TSecretScanningDataSourceForm = z.infer<typeof SecretScanningDataSourceSchema>;