feat(data-warehouse): Added frontend support for cloudflare R2 (#22218)

* Added frontend support for cloudflare R2 * Update UI snapshots for `chromium` (2) * Update UI snapshots for `chromium` (2) --------- Co-authored-by: github-actions <41898282+github-actions[bot]@users.noreply.github.com>
PostHog · May 21, 2024 · feb0f52 · feb0f52
1 parent 554114b
commit feb0f52
Show file tree

Hide file tree

Showing 4 changed files with 14 additions and 1 deletion.
diff --git a/frontend/public/cloudflare-logo.png b/frontend/public/cloudflare-logo.png
diff --git a/frontend/src/scenes/data-warehouse/new/DataWarehouseTableForm.tsx b/frontend/src/scenes/data-warehouse/new/DataWarehouseTableForm.tsx
@@ -27,6 +27,12 @@ const ProviderMappings: Record<
         accessKeyLabel: 'Access ID',
         accessSecretLabel: 'Secret',
     },
+    'cloudflare-r2': {
+        fileUrlPatternPlaceholder: 'eg: https://your-account-id.r2.cloudflarestorage.com/airbyte/stripe/invoices/*.pqt',
+        accessKeyPlaceholder: 'eg: AKIAIOSFODNN7EXAMPLE',
+        accessKeyLabel: 'Access key',
+        accessSecretLabel: 'Access secret',
+    },
 }
 
 export function DatawarehouseTableForm(): JSX.Element {

diff --git a/frontend/src/scenes/data-warehouse/new/ManualLinkProvider.tsx b/frontend/src/scenes/data-warehouse/new/ManualLinkProvider.tsx
@@ -1,5 +1,6 @@
 import { LemonButton } from '@posthog/lemon-ui'
 import { useActions } from 'kea'
+import cloudflareLogo from 'public/cloudflare-logo.png'
 import googleStorageLogo from 'public/google-cloud-storage-logo.png'
 import s3Logo from 'public/s3-logo.png'
 
@@ -25,6 +26,12 @@ export const ManualLinkProvider = (): JSX.Element => {
                     <div className="text-base">Google Cloud Storage</div>
                 </div>
             </LemonButton>
+            <LemonButton onClick={() => onClick('cloudflare-r2')} fullWidth center type="secondary" className="mb-2">
+                <div className="flex flex-row gap-2 justify-center items-center">
+                    <img src={cloudflareLogo} alt="Cloudflare logo" height={64} className="m-2" />
+                    <div className="text-base">Cloudflare R2</div>
+                </div>
+            </LemonButton>
         </div>
     )
 }
diff --git a/frontend/src/scenes/data-warehouse/new/sourceWizardLogic.tsx b/frontend/src/scenes/data-warehouse/new/sourceWizardLogic.tsx
@@ -148,7 +148,7 @@ export const SOURCE_DETAILS: Record<string, SourceConfig> = {
     },
 }
 
-export type ManualLinkProvider = 'aws' | 'google-cloud'
+export type ManualLinkProvider = 'aws' | 'google-cloud' | 'cloudflare-r2'
 
 export const sourceWizardLogic = kea<sourceWizardLogicType>([
     path(['scenes', 'data-warehouse', 'external', 'sourceWizardLogic']),