Add Azure Blob Storage logo (#590)

Author: pjhampton

src/components/FileUpload/FileUpload.tsx

@@ -1,10 +1,11 @@
 import React, { useEffect } from "react";
 import styled, { css } from "styled-components";
 import { useState, useRef, useCallback } from "react";
+
+import { truncateFilename } from "@/utils/truncate.ts";
 import { Text } from "@/components/Typography/Text/Text";
 import { Title } from "@/components/Typography/Title/Title";
 import { Button, Icon, IconButton, ProgressBar } from "@/components";
-import { truncateFilename } from "@/utils/truncate.ts";
 
 interface FileInfo {
   name: string;

src/components/Logos/AzureBlobStorage.tsx

@@ -0,0 +1,55 @@
+import { SVGAttributes } from "react";
+
+const AzureBlobStorage = (props: SVGAttributes<SVGElement>) => (
+  <svg
+    width="62"
+    height="50"
+    viewBox="0 0 62 50"
+    fill="none"
+    xmlns="http://www.w3.org/2000/svg"
+    {...props}
+  >
+    <path
+      d="M0.777344 13.5801H61.2218V47.2796C61.2218 47.8153 61.009 48.3289 60.6303 48.7077C60.2515 49.0864 59.7378 49.2992 59.2022 49.2992H2.7969C2.26128 49.2992 1.7476 49.0864 1.36886 48.7077C0.990118 48.3289 0.777344 47.8153 0.777344 47.2796V13.5801Z"
+      fill="url(#paint0_linear_11640_11692)"
+    />
+    <path
+      d="M2.80757 0.7012H59.1916C59.4568 0.7012 59.7194 0.753438 59.9644 0.85493C60.2094 0.956422 60.4321 1.10518 60.6196 1.29271C60.8071 1.48025 60.9559 1.70288 61.0574 1.94791C61.1589 2.19293 61.2111 2.45554 61.2111 2.72076V13.5794H0.777344V2.72076C0.77734 2.45464 0.829929 2.19116 0.932087 1.94543C1.03425 1.69971 1.18396 1.4766 1.37262 1.28893C1.56129 1.10126 1.78518 0.95272 2.03144 0.851858C2.2777 0.750995 2.54146 0.699795 2.80757 0.7012Z"
+      fill="#0078D4"
+    />
+    <path
+      d="M28.6036 18.0625H8.28357C7.72784 18.0625 7.27734 18.513 7.27734 19.0687V29.1736C7.27734 29.7293 7.72784 30.1798 8.28357 30.1798H28.6036C29.1593 30.1798 29.6098 29.7293 29.6098 29.1736V19.0687C29.6098 18.513 29.1593 18.0625 28.6036 18.0625Z"
+      fill="#0078D4"
+    />
+    <path
+      d="M53.5215 18.0625H33.2015C32.6458 18.0625 32.1953 18.513 32.1953 19.0687V29.1736C32.1953 29.7293 32.6458 30.1798 33.2015 30.1798H53.5215C54.0773 30.1798 54.5278 29.7293 54.5278 29.1736V19.0687C54.5278 18.513 54.0773 18.0625 53.5215 18.0625Z"
+      fill="white"
+    />
+    <path
+      d="M28.4903 32.5664H8.17028C7.61456 32.5664 7.16406 33.0169 7.16406 33.5726V43.6775C7.16406 44.2332 7.61456 44.6837 8.17028 44.6837H28.4903C29.046 44.6837 29.4965 44.2332 29.4965 43.6775V33.5726C29.4965 33.0169 29.046 32.5664 28.4903 32.5664Z"
+      fill="#0078D4"
+    />
+    <path
+      d="M53.4083 32.5664H33.0883C32.5325 32.5664 32.082 33.0169 32.082 33.5726V43.6775C32.082 44.2332 32.5325 44.6837 33.0883 44.6837H53.4083C53.964 44.6837 54.4145 44.2332 54.4145 43.6775V33.5726C54.4145 33.0169 53.964 32.5664 53.4083 32.5664Z"
+      fill="#0078D4"
+    />
+    <defs>
+      <linearGradient
+        id="paint0_linear_11640_11692"
+        x1="30.9996"
+        y1="49.2992"
+        x2="30.9996"
+        y2="13.5801"
+        gradientUnits="userSpaceOnUse"
+      >
+        <stop stopColor="#32BEDD" />
+        <stop
+          offset="0.775"
+          stopColor="#32D4F5"
+        />
+      </linearGradient>
+    </defs>
+  </svg>
+);
+
+export default AzureBlobStorage;

src/components/Logos/LogosDark.ts

@@ -7,6 +7,7 @@ import AWSS3 from "./AWS_S3";
 import AWSAthena from "./AWSAthena";
 import AWSMsk from "./AWSMsk";
 import Azure from "./Azure";
+import AzureBlobStorage from "./AzureBlobStorage";
 import AzureEventHub from "./AzureEventHub";
 import BigQuery from "./BigQuery";
 import Chash from "./Chash";
@@ -62,6 +63,7 @@ const LogosDark: Record<LogoName, (props: SVGAttributes<SVGElement>) => JSX.Elem
   "aws-redshift": AWSRedshift,
   "aws-s3": AWSS3,
   azure: Azure,
+  "azure-blob-storage": AzureBlobStorage,
   "azure-event-hub": AzureEventHub,
   bigquery: BigQuery,
   "c#": Chash,

src/components/Logos/LogosLight.ts

@@ -7,6 +7,7 @@ import AWSRedshift from "./AWSRedshift";
 import AWSMsk from "./AWSMsk";
 import AWSS3 from "./AWS_S3";
 import Azure from "./Azure";
+import AzureBlobStorage from "./AzureBlobStorage";
 import AzureEventHub from "./AzureEventHub";
 import BigQuery from "./BigQuery";
 import Chash from "./Chash";
@@ -62,6 +63,7 @@ const LogosLight: Record<LogoName, (props: SVGAttributes<SVGElement>) => JSX.Ele
   "aws-redshift": AWSRedshift,
   "aws-s3": AWSS3,
   azure: Azure,
+  "azure-blob-storage": AzureBlobStorage,
   "azure-event-hub": AzureEventHub,
   bigquery: BigQuery,
   "c#": Chash,

src/components/Logos/types.ts

@@ -22,6 +22,7 @@ export type LogoName =
   | "gcp"
   | "gcs"
   | "azure"
+  | "azure-blob-storage"
   | "azure-event-hub"
   | "dbeaver"
   | "dbt"