@marimo-team/frontend 0.14.18-dev4 → 0.14.18-dev40

package/src/components/databases/display.tsx

@@ -0,0 +1,66 @@
+/* Copyright 2024 Marimo. All rights reserved. */
+export function dbDisplayName(name: string) {
+  switch (name) {
+    case "duckdb":
+      return "DuckDB";
+    case "motherduck":
+      return "MotherDuck";
+    case "sqlite":
+      return "SQLite";
+    case "postgres":
+    case "postgresql":
+      return "PostgreSQL";
+    case "mysql":
+      return "MySQL";
+    case "mariadb":
+      return "MariaDB";
+    case "mssql":
+      return "Microsoft SQL Server";
+    case "oracle":
+      return "Oracle";
+    case "redshift":
+      return "Amazon Redshift";
+    case "snowflake":
+      return "Snowflake";
+    case "bigquery":
+      return "Google BigQuery";
+    case "clickhouse":
+      return "ClickHouse";
+    case "timeplus":
+      return "Timeplus";
+    case "databricks":
+      return "Databricks";
+    case "db2":
+      return "IBM Db2";
+    case "hive":
+      return "Apache Hive";
+    case "impala":
+      return "Apache Impala";
+    case "presto":
+      return "Presto";
+    case "trino":
+      return "Trino";
+    case "cockroachdb":
+      return "CockroachDB";
+    case "timescaledb":
+      return "TimescaleDB";
+    case "singlestore":
+      return "SingleStore";
+    case "cassandra":
+      return "Apache Cassandra";
+    case "mongodb":
+      return "MongoDB";
+    case "iceberg":
+      return "Apache Iceberg";
+    default:
+      return name;
+  }
+}
+
+export function transformDisplayName(displayName: string): string {
+  const [dbName, engineName] = displayName.split(" ");
+  if (!engineName) {
+    return dbDisplayName(displayName);
+  }
+  return `${dbDisplayName(dbName)} ${engineName}`;
+}

package/src/components/databases/engine-variable.tsx

@@ -0,0 +1,51 @@
+/* Copyright 2024 Marimo. All rights reserved. */
+import { getCellEditorView } from "@/core/cells/cells";
+import type { CellId } from "@/core/cells/ids";
+import { goToVariableDefinition } from "@/core/codemirror/go-to-definition/commands";
+import { store } from "@/core/state/jotai";
+import { variablesAtom } from "@/core/variables/state";
+import type { VariableName } from "@/core/variables/types";
+import { cn } from "@/utils/cn";
+
+interface Props {
+  variableName: VariableName;
+  className?: string;
+}
+
+export const EngineVariable: React.FC<Props> = ({
+  variableName,
+  className,
+}) => {
+  const onClick = () => {
+    const cellId = findCellId(variableName);
+    if (!cellId) {
+      return;
+    }
+    const editorView = getCellEditorView(cellId);
+    if (editorView) {
+      goToVariableDefinition(editorView, variableName);
+    }
+  };
+
+  return (
+    <button
+      type="button"
+      onClick={onClick}
+      className={cn(
+        "text-link opacity-80 hover:opacity-100 hover:underline",
+        className,
+      )}
+    >
+      {variableName}
+    </button>
+  );
+};
+
+function findCellId(variableName: VariableName): CellId | undefined {
+  const variables = store.get(variablesAtom);
+  const variable = variables[variableName];
+  if (!variable) {
+    return undefined;
+  }
+  return variable.declaredBy[0];
+}

package/src/components/databases/icon.tsx

@@ -0,0 +1,91 @@
+/* Copyright 2024 Marimo. All rights reserved. */
+
+import { DatabaseIcon } from "lucide-react";
+import type { FC } from "react";
+import { cn } from "@/utils/cn";
+import ClickhouseIcon from "./icons/clickhouse.svg";
+import DatabricksIcon from "./icons/databricks.svg";
+import DataFusionIcon from "./icons/datafusion.png";
+import DuckDBIcon from "./icons/duckdb.svg";
+import GoogleBigQueryIcon from "./icons/googlebigquery.svg";
+import IcebergIcon from "./icons/iceberg.png";
+import MotherDuckIcon from "./icons/motherduck.svg";
+import MySQLIcon from "./icons/mysql.svg";
+import PostgresQLIcon from "./icons/postgresql.svg";
+import RedshiftIcon from "./icons/redshift.svg";
+import SnowflakeIcon from "./icons/snowflake.svg";
+import PySparkIcon from "./icons/spark.svg";
+import SQLiteIcon from "./icons/sqlite.svg";
+import TimeplusIcon from "./icons/timeplus.svg";
+import TrinoIcon from "./icons/trino.svg";
+
+export type DBLogoName =
+  | "sqlite"
+  | "duckdb"
+  | "motherduck"
+  | "postgres"
+  | "postgresql"
+  | "mysql"
+  | "snowflake"
+  | "databricks"
+  | "clickhouse"
+  | "timeplus"
+  | "bigquery"
+  | "trino"
+  | "iceberg"
+  | "datafusion"
+  | "pyspark"
+  | "redshift";
+
+/**
+ * Icons are from https://simpleicons.org/
+ */
+
+interface DatabaseLogoProps {
+  name: string;
+  className?: string;
+}
+
+const URLS: Record<DBLogoName, string | undefined> = {
+  sqlite: SQLiteIcon,
+  duckdb: DuckDBIcon,
+  motherduck: MotherDuckIcon,
+  postgres: PostgresQLIcon,
+  postgresql: PostgresQLIcon,
+  mysql: MySQLIcon,
+  snowflake: SnowflakeIcon,
+  databricks: DatabricksIcon,
+  clickhouse: ClickhouseIcon,
+  timeplus: TimeplusIcon,
+  bigquery: GoogleBigQueryIcon,
+  trino: TrinoIcon,
+  iceberg: IcebergIcon,
+  datafusion: DataFusionIcon,
+  pyspark: PySparkIcon,
+  redshift: RedshiftIcon,
+};
+
+export const DatabaseLogo: FC<DatabaseLogoProps> = ({ name, className }) => {
+  const lowerName = name.toLowerCase();
+
+  const url = URLS[lowerName as DBLogoName];
+
+  if (!url) {
+    // Shift the icon down a bit to align with the text
+    return <DatabaseIcon className={cn("mt-0.5", className)} />;
+  }
+
+  return (
+    <img
+      src={url}
+      alt={name}
+      className={cn(
+        "invert-[.5] dark:invert-[.7]",
+        className,
+        // Remove filters for PNG icons
+        url.endsWith(".png") &&
+          "brightness-100 dark:brightness-100 invert-0 dark:invert-0",
+      )}
+    />
+  );
+};

package/src/components/databases/icons/clickhouse.svg

@@ -0,0 +1 @@
+<svg role="img" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><title>ClickHouse</title><path d="M21.333 10H24v4h-2.667ZM16 1.335h2.667v21.33H16Zm-5.333 0h2.666v21.33h-2.666ZM0 22.665V1.335h2.667v21.33zm5.333-21.33H8v21.33H5.333Z"/></svg>

package/src/components/databases/icons/databricks.svg

@@ -0,0 +1 @@
+<svg role="img" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><title>Databricks</title><path d="M.95 14.184L12 20.403l9.919-5.55v2.21L12 22.662l-10.484-5.96-.565.308v.77L12 24l11.05-6.218v-4.317l-.515-.309L12 19.118l-9.867-5.653v-2.21L12 16.805l11.05-6.218V6.32l-.515-.308L12 11.974 2.647 6.681 12 1.388l7.76 4.368.668-.411v-.566L12 0 .95 6.27v.72L12 13.207l9.919-5.55v2.26L12 15.52 1.516 9.56l-.565.308Z"/></svg>

package/src/components/databases/icons/duckdb.svg

@@ -0,0 +1 @@
+<svg role="img" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><title>DuckDB</title><path d="M12 0C5.363 0 0 5.363 0 12s5.363 12 12 12 12-5.363 12-12S18.637 0 12 0zM9.502 7.03a4.974 4.974 0 0 1 4.97 4.97 4.974 4.974 0 0 1-4.97 4.97A4.974 4.974 0 0 1 4.532 12a4.974 4.974 0 0 1 4.97-4.97zm6.563 3.183h2.351c.98 0 1.787.782 1.787 1.762s-.807 1.789-1.787 1.789h-2.351v-3.551z"/></svg>

package/src/components/databases/icons/googlebigquery.svg

@@ -0,0 +1 @@
+<svg role="img" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><title>Google BigQuery</title><path d="M5.676 10.595h2.052v5.244a5.892 5.892 0 0 1-2.052-2.088v-3.156zm18.179 10.836a.504.504 0 0 1 0 .708l-1.716 1.716a.504.504 0 0 1-.708 0l-4.248-4.248a.206.206 0 0 1-.007-.007c-.02-.02-.028-.045-.043-.066a10.736 10.736 0 0 1-6.334 2.065C4.835 21.599 0 16.764 0 10.799S4.835 0 10.8 0s10.799 4.835 10.799 10.8c0 2.369-.772 4.553-2.066 6.333.025.017.052.028.074.05l4.248 4.248zm-5.028-10.632a8.015 8.015 0 1 0-8.028 8.028h.024a8.016 8.016 0 0 0 8.004-8.028zm-4.86 4.98a6.002 6.002 0 0 0 2.04-2.184v-1.764h-2.04v3.948zm-4.5.948c.442.057.887.08 1.332.072.4.025.8.025 1.2 0V7.692H9.468v9.035z"/></svg>

package/src/components/databases/icons/motherduck.svg

@@ -0,0 +1,9 @@
+<svg role="img" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
+  <title>MotherDuck</title>
+  <g transform="scale(0.85) translate(0, 2)">
+    <path fill="#ff9538"
+      d="M1.71 15.86s7.45 5.32 7.89 5.59c.44.27 1.08.33 1.64.11.56-.22.98-.71 1.11-1.21s1.85-9.49 1.85-9.49c.02-.12.07-.48-.13-.83-.27-.47-.86-.71-1.38-.57-.42.12-.64.44-.7.55-.09.17-.26.45-.57.7-.24.19-.47.3-.58.34-.96.38-2.02.06-2.61-.72-.38-.48-1.04-.67-1.64-.43-.6.24-.94.84-.89 1.45.11.98-.44 1.94-1.4 2.32-.51.21-1.06.21-1.54.05-.12-.03-.51-.12-.89.09-.48.26-.74.84-.61 1.37.09.39.38.62.48.69z" />
+    <path fill="#ff9538"
+      d="M14.12 4.21s2.65 8.76 2.83 9.24c.19.48.66.92 1.23 1.09.58.16 1.21.03 1.62-.28.41-.31 7.25-6.39 7.25-6.39.09-.08.35-.34.4-.74.07-.53-.25-1.09-.75-1.29-.4-.16-.78-.04-.89 0-.18.08-.48.2-.88.2-.3.01-.55-.05-.67-.08-.99-.28-1.64-1.18-1.63-2.16-.01-.61-.42-1.17-1.04-1.35-.62-.18-1.26.09-1.59.6-.51.84-1.53 1.27-2.52.99-.53-.15-.96-.48-1.25-.91-.07-.09-.33-.4-.76-.48-.54-.09-1.1.22-1.32.71-.16.37-.08.72-.04.84z" />
+  </g>
+</svg>

package/src/components/databases/icons/mysql.svg

@@ -0,0 +1 @@
+<svg role="img" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><title>MySQL</title><path d="M16.405 5.501c-.115 0-.193.014-.274.033v.013h.014c.054.104.146.18.214.273.054.107.1.214.154.32l.014-.015c.094-.066.14-.172.14-.333-.04-.047-.046-.094-.08-.14-.04-.067-.126-.1-.18-.153zM5.77 18.695h-.927a50.854 50.854 0 00-.27-4.41h-.008l-1.41 4.41H2.45l-1.4-4.41h-.01a72.892 72.892 0 00-.195 4.41H0c.055-1.966.192-3.81.41-5.53h1.15l1.335 4.064h.008l1.347-4.064h1.095c.242 2.015.384 3.86.428 5.53zm4.017-4.08c-.378 2.045-.876 3.533-1.492 4.46-.482.716-1.01 1.073-1.583 1.073-.153 0-.34-.046-.566-.138v-.494c.11.017.24.026.386.026.268 0 .483-.075.647-.222.197-.18.295-.382.295-.605 0-.155-.077-.47-.23-.944L6.23 14.615h.91l.727 2.36c.164.536.233.91.205 1.123.4-1.064.678-2.227.835-3.483zm12.325 4.08h-2.63v-5.53h.885v4.85h1.745zm-3.32.135l-1.016-.5c.09-.076.177-.158.255-.25.433-.506.648-1.258.648-2.253 0-1.83-.718-2.746-2.155-2.746-.704 0-1.254.232-1.65.697-.43.508-.646 1.256-.646 2.245 0 .972.19 1.686.574 2.14.35.41.877.615 1.583.615.264 0 .506-.033.725-.098l1.325.772.36-.622zM15.5 17.588c-.225-.36-.337-.94-.337-1.736 0-1.393.424-2.09 1.27-2.09.443 0 .77.167.977.5.224.362.336.936.336 1.723 0 1.404-.424 2.108-1.27 2.108-.445 0-.77-.167-.978-.5zm-1.658-.425c0 .47-.172.856-.516 1.156-.344.3-.803.45-1.384.45-.543 0-1.064-.172-1.573-.515l.237-.476c.438.22.833.328 1.19.328.332 0 .593-.073.783-.22a.754.754 0 00.3-.615c0-.33-.23-.61-.648-.845-.388-.213-1.163-.657-1.163-.657-.422-.307-.632-.636-.632-1.177 0-.45.157-.81.47-1.085.315-.278.72-.415 1.22-.415.512 0 .98.136 1.4.41l-.213.476a2.726 2.726 0 00-1.064-.23c-.283 0-.502.068-.654.206a.685.685 0 00-.248.524c0 .328.234.61.666.85.393.215 1.187.67 1.187.67.433.305.648.63.648 1.168zm9.382-5.852c-.535-.014-.95.04-1.297.188-.1.04-.26.04-.274.167.055.053.063.14.11.214.08.134.218.313.346.407.14.11.28.216.427.31.26.16.555.255.81.416.145.094.293.213.44.313.073.05.12.14.214.172v-.02c-.046-.06-.06-.147-.105-.214-.067-.067-.134-.127-.2-.193a3.223 3.223 0 00-.695-.675c-.214-.146-.682-.35-.77-.595l-.013-.014c.146-.013.32-.066.46-.106.227-.06.435-.047.67-.106.106-.027.213-.06.32-.094v-.06c-.12-.12-.21-.283-.334-.395a8.867 8.867 0 00-1.104-.823c-.21-.134-.476-.22-.697-.334-.08-.04-.214-.06-.26-.127-.12-.146-.19-.34-.275-.514a17.69 17.69 0 01-.547-1.163c-.12-.262-.193-.523-.34-.763-.69-1.137-1.437-1.826-2.586-2.5-.247-.14-.543-.2-.856-.274-.167-.008-.334-.02-.5-.027-.11-.047-.216-.174-.31-.235-.38-.24-1.364-.76-1.644-.072-.18.434.267.862.422 1.082.115.153.26.328.34.5.047.116.06.235.107.356.106.294.207.622.347.897.073.14.153.287.247.413.054.073.146.107.167.227-.094.136-.1.334-.154.5-.24.757-.146 1.693.194 2.25.107.166.362.534.703.393.3-.12.234-.5.32-.835.02-.08.007-.133.048-.187v.015c.094.188.188.367.274.555.206.328.566.668.867.895.16.12.287.328.487.402v-.02h-.015c-.043-.058-.1-.086-.154-.133a3.445 3.445 0 01-.35-.4 8.76 8.76 0 01-.747-1.218c-.11-.21-.202-.436-.29-.643-.04-.08-.04-.2-.107-.24-.1.146-.247.273-.32.453-.127.288-.14.642-.188 1.01-.027.007-.014 0-.027.014-.214-.052-.287-.274-.367-.46-.2-.475-.233-1.238-.06-1.785.047-.14.247-.582.167-.716-.042-.127-.174-.2-.247-.303a2.478 2.478 0 01-.24-.427c-.16-.374-.24-.788-.414-1.162-.08-.173-.22-.354-.334-.513-.127-.18-.267-.307-.368-.52-.033-.073-.08-.194-.027-.274.014-.054.042-.075.094-.09.088-.072.335.022.422.062.247.1.455.194.662.334.094.066.195.193.315.226h.14c.214.047.455.014.655.073.355.114.675.28.962.46a5.953 5.953 0 012.085 2.286c.08.154.115.295.188.455.14.33.313.663.455.982.14.315.275.636.476.897.1.14.502.213.682.286.133.06.34.115.46.188.23.14.454.3.67.454.11.076.443.243.463.378z"/></svg>

package/src/components/databases/icons/postgresql.svg

@@ -0,0 +1 @@
+<svg role="img" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><title>PostgreSQL</title><path d="M23.5594 14.7228a.5269.5269 0 0 0-.0563-.1191c-.139-.2632-.4768-.3418-1.0074-.2321-1.6533.3411-2.2935.1312-2.5256-.0191 1.342-2.0482 2.445-4.522 3.0411-6.8297.2714-1.0507.7982-3.5237.1222-4.7316a1.5641 1.5641 0 0 0-.1509-.235C21.6931.9086 19.8007.0248 17.5099.0005c-1.4947-.0158-2.7705.3461-3.1161.4794a9.449 9.449 0 0 0-.5159-.0816 8.044 8.044 0 0 0-1.3114-.1278c-1.1822-.0184-2.2038.2642-3.0498.8406-.8573-.3211-4.7888-1.645-7.2219.0788C.9359 2.1526.3086 3.8733.4302 6.3043c.0409.818.5069 3.334 1.2423 5.7436.4598 1.5065.9387 2.7019 1.4334 3.582.553.9942 1.1259 1.5933 1.7143 1.7895.4474.1491 1.1327.1441 1.8581-.7279.8012-.9635 1.5903-1.8258 1.9446-2.2069.4351.2355.9064.3625 1.39.3772a.0569.0569 0 0 0 .0004.0041 11.0312 11.0312 0 0 0-.2472.3054c-.3389.4302-.4094.5197-1.5002.7443-.3102.064-1.1344.2339-1.1464.8115-.0025.1224.0329.2309.0919.3268.2269.4231.9216.6097 1.015.6331 1.3345.3335 2.5044.092 3.3714-.6787-.017 2.231.0775 4.4174.3454 5.0874.2212.5529.7618 1.9045 2.4692 1.9043.2505 0 .5263-.0291.8296-.0941 1.7819-.3821 2.5557-1.1696 2.855-2.9059.1503-.8707.4016-2.8753.5388-4.1012.0169-.0703.0357-.1207.057-.1362.0007-.0005.0697-.0471.4272.0307a.3673.3673 0 0 0 .0443.0068l.2539.0223.0149.001c.8468.0384 1.9114-.1426 2.5312-.4308.6438-.2988 1.8057-1.0323 1.5951-1.6698zM2.371 11.8765c-.7435-2.4358-1.1779-4.8851-1.2123-5.5719-.1086-2.1714.4171-3.6829 1.5623-4.4927 1.8367-1.2986 4.8398-.5408 6.108-.13-.0032.0032-.0066.0061-.0098.0094-2.0238 2.044-1.9758 5.536-1.9708 5.7495-.0002.0823.0066.1989.0162.3593.0348.5873.0996 1.6804-.0735 2.9184-.1609 1.1504.1937 2.2764.9728 3.0892.0806.0841.1648.1631.2518.2374-.3468.3714-1.1004 1.1926-1.9025 2.1576-.5677.6825-.9597.5517-1.0886.5087-.3919-.1307-.813-.5871-1.2381-1.3223-.4796-.839-.9635-2.0317-1.4155-3.5126zm6.0072 5.0871c-.1711-.0428-.3271-.1132-.4322-.1772.0889-.0394.2374-.0902.4833-.1409 1.2833-.2641 1.4815-.4506 1.9143-1.0002.0992-.126.2116-.2687.3673-.4426a.3549.3549 0 0 0 .0737-.1298c.1708-.1513.2724-.1099.4369-.0417.156.0646.3078.26.3695.4752.0291.1016.0619.2945-.0452.4444-.9043 1.2658-2.2216 1.2494-3.1676 1.0128zm2.094-3.988-.0525.141c-.133.3566-.2567.6881-.3334 1.003-.6674-.0021-1.3168-.2872-1.8105-.8024-.6279-.6551-.9131-1.5664-.7825-2.5004.1828-1.3079.1153-2.4468.079-3.0586-.005-.0857-.0095-.1607-.0122-.2199.2957-.2621 1.6659-.9962 2.6429-.7724.4459.1022.7176.4057.8305.928.5846 2.7038.0774 3.8307-.3302 4.7363-.084.1866-.1633.3629-.2311.5454zm7.3637 4.5725c-.0169.1768-.0358.376-.0618.5959l-.146.4383a.3547.3547 0 0 0-.0182.1077c-.0059.4747-.054.6489-.115.8693-.0634.2292-.1353.4891-.1794 1.0575-.11 1.4143-.8782 2.2267-2.4172 2.5565-1.5155.3251-1.7843-.4968-2.0212-1.2217a6.5824 6.5824 0 0 0-.0769-.2266c-.2154-.5858-.1911-1.4119-.1574-2.5551.0165-.5612-.0249-1.9013-.3302-2.6462.0044-.2932.0106-.5909.019-.8918a.3529.3529 0 0 0-.0153-.1126 1.4927 1.4927 0 0 0-.0439-.208c-.1226-.4283-.4213-.7866-.7797-.9351-.1424-.059-.4038-.1672-.7178-.0869.067-.276.1831-.5875.309-.9249l.0529-.142c.0595-.16.134-.3257.213-.5012.4265-.9476 1.0106-2.2453.3766-5.1772-.2374-1.0981-1.0304-1.6343-2.2324-1.5098-.7207.0746-1.3799.3654-1.7088.5321a5.6716 5.6716 0 0 0-.1958.1041c.0918-1.1064.4386-3.1741 1.7357-4.4823a4.0306 4.0306 0 0 1 .3033-.276.3532.3532 0 0 0 .1447-.0644c.7524-.5706 1.6945-.8506 2.802-.8325.4091.0067.8017.0339 1.1742.081 1.939.3544 3.2439 1.4468 4.0359 2.3827.8143.9623 1.2552 1.9315 1.4312 2.4543-1.3232-.1346-2.2234.1268-2.6797.779-.9926 1.4189.543 4.1729 1.2811 5.4964.1353.2426.2522.4522.2889.5413.2403.5825.5515.9713.7787 1.2552.0696.087.1372.1714.1885.245-.4008.1155-1.1208.3825-1.0552 1.717-.0123.1563-.0423.4469-.0834.8148-.0461.2077-.0702.4603-.0994.7662zm.8905-1.6211c-.0405-.8316.2691-.9185.5967-1.0105a2.8566 2.8566 0 0 0 .135-.0406 1.202 1.202 0 0 0 .1342.103c.5703.3765 1.5823.4213 3.0068.1344-.2016.1769-.5189.3994-.9533.6011-.4098.1903-1.0957.333-1.7473.3636-.7197.0336-1.0859-.0807-1.1721-.151zm.5695-9.2712c-.0059.3508-.0542.6692-.1054 1.0017-.055.3576-.112.7274-.1264 1.1762-.0142.4368.0404.8909.0932 1.3301.1066.887.216 1.8003-.2075 2.7014a3.5272 3.5272 0 0 1-.1876-.3856c-.0527-.1276-.1669-.3326-.3251-.6162-.6156-1.1041-2.0574-3.6896-1.3193-4.7446.3795-.5427 1.3408-.5661 2.1781-.463zm.2284 7.0137a12.3762 12.3762 0 0 0-.0853-.1074l-.0355-.0444c.7262-1.1995.5842-2.3862.4578-3.4385-.0519-.4318-.1009-.8396-.0885-1.2226.0129-.4061.0666-.7543.1185-1.0911.0639-.415.1288-.8443.1109-1.3505.0134-.0531.0188-.1158.0118-.1902-.0457-.4855-.5999-1.938-1.7294-3.253-.6076-.7073-1.4896-1.4972-2.6889-2.0395.5251-.1066 1.2328-.2035 2.0244-.1859 2.0515.0456 3.6746.8135 4.8242 2.2824a.908.908 0 0 1 .0667.1002c.7231 1.3556-.2762 6.2751-2.9867 10.5405zm-8.8166-6.1162c-.025.1794-.3089.4225-.6211.4225a.5821.5821 0 0 1-.0809-.0056c-.1873-.026-.3765-.144-.5059-.3156-.0458-.0605-.1203-.178-.1055-.2844.0055-.0401.0261-.0985.0925-.1488.1182-.0894.3518-.1226.6096-.0867.3163.0441.6426.1938.6113.4186zm7.9305-.4114c.0111.0792-.049.201-.1531.3102-.0683.0717-.212.1961-.4079.2232a.5456.5456 0 0 1-.075.0052c-.2935 0-.5414-.2344-.5607-.3717-.024-.1765.2641-.3106.5611-.352.297-.0414.6111.0088.6356.1851z"/></svg>

package/src/components/databases/icons/redshift.svg

@@ -0,0 +1 @@
+<svg role="img" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><title>Amazon Redshift</title><path d="M16.639 9.932a.822.822 0 0 1-.822-.82.823.823 0 0 1 1.645 0c0 .452-.37.82-.823.82m-2.086 4.994a.823.823 0 0 1-.822-.822.822.822 0 0 1 1.645 0 .822.822 0 0 1-.823.822m-5.004-.833a.822.822 0 1 1 .002-1.644.822.822 0 0 1-.002 1.644m-2.083 4.578a.823.823 0 0 1-.823-.82.823.823 0 0 1 1.645 0c0 .452-.37.82-.822.82m9.173-11.236a1.68 1.68 0 0 0-1.68 1.676c0 .566.285 1.066.718 1.37l-.782 1.982a1.674 1.674 0 0 0-1.923 1.104l-1.753-.398a1.675 1.675 0 0 0-3.348.103c0 .432.169.823.438 1.12l-.764 1.79c-.028-.001-.053-.008-.08-.008a1.68 1.68 0 0 0-1.68 1.676 1.68 1.68 0 0 0 3.36 0c0-.593-.312-1.112-.778-1.41l.674-1.579c.161.052.33.088.508.088.661 0 1.228-.386 1.502-.94l1.856.42a1.68 1.68 0 0 0 3.327-.325c0-.5-.224-.943-.574-1.25l.822-2.083c.053.005.104.016.157.016a1.68 1.68 0 0 0 1.68-1.676 1.68 1.68 0 0 0-1.68-1.676M12 23.145c-4.17 0-7.286-1.252-7.286-2.37V4.79C6.14 5.938 9.131 6.547 12 6.547c2.869 0 5.86-.609 7.286-1.756v15.983c0 1.12-3.116 2.37-7.286 2.37M12 .856c4.293 0 7.286 1.274 7.286 2.419 0 1.143-2.993 2.418-7.286 2.418-4.293 0-7.286-1.275-7.286-2.418C4.714 2.129 7.707.855 12 .855m8.143 2.419C20.143 1.147 15.947 0 12 0 8.052 0 3.857 1.147 3.857 3.274l.002.01h-.002v17.49C3.857 22.87 8.052 24 12 24c3.947 0 8.143-1.13 8.143-3.226V3.284h-.002l.002-.01"/></svg>

package/src/components/databases/icons/snowflake.svg

@@ -0,0 +1 @@
+<svg role="img" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><title>Snowflake</title><path d="M24 3.459c0 .646-.418 1.18-1.141 1.18-.723 0-1.142-.534-1.142-1.18 0-.647.419-1.18 1.142-1.18.723 0 1.141.533 1.141 1.18zm-.228 0c0-.533-.38-.951-.913-.951s-.913.38-.913.95c0 .533.38.952.913.952.57 0 .913-.419.913-.951zm-1.37-.533h.495c.266 0 .456.152.456.38 0 .153-.076.229-.19.305l.19.266v.038h-.266l-.19-.266h-.229v.266h-.266zm.495.228h-.229v.267h.229c.114 0 .152-.038.152-.114.038-.077-.038-.153-.152-.153zM7.602 12.4c.038-.151.076-.304.076-.456 0-.114-.038-.228-.038-.342-.114-.343-.304-.647-.646-.838l-4.87-2.777c-.685-.38-1.56-.152-1.94.533-.381.685-.153 1.56.532 1.94l2.701 1.56-2.701 1.56c-.685.38-.913 1.256-.533 1.94.38.685 1.256.914 1.94.533l4.832-2.777c.343-.267.571-.533.647-.876zm1.332 2.626c-.266-.038-.57.038-.837.19l-4.832 2.777c-.685.38-.913 1.256-.532 1.94.38.686 1.255.914 1.94.533l2.701-1.56v3.12c0 .8.647 1.408 1.446 1.408.799 0 1.407-.647 1.407-1.408v-5.592c0-.761-.57-1.37-1.293-1.408zm4.946-6.088c.266.038.57-.038.837-.19l4.832-2.777c.685-.38.913-1.256.532-1.94-.38-.686-1.255-.914-1.94-.533l-2.701 1.56V1.975c0-.799-.647-1.408-1.446-1.408-.799 0-1.446.609-1.446 1.408V7.53c0 .76.609 1.37 1.332 1.407zM3.265 5.97l4.832 2.777c.266.152.533.19.837.19.723-.038 1.331-.684 1.331-1.407V1.975c0-.799-.646-1.408-1.407-1.408-.799 0-1.446.647-1.446 1.408v3.12l-2.701-1.56c-.685-.38-1.56-.152-1.94.533-.419.646-.19 1.521.494 1.902zm9.093 6.011a.412.412 0 00-.114-.266l-.57-.571a.346.346 0 00-.267-.114.412.412 0 00-.266.114l-.571.57a.411.411 0 00-.114.267c0 .076.038.19.114.267l.57.57a.345.345 0 00.267.114c.076 0 .19-.038.266-.114l.571-.57a.412.412 0 00.114-.267zm1.598.533L11.94 14.53c-.039.038-.153.114-.229.114h-.608a.411.411 0 01-.267-.114L8.82 12.514a.408.408 0 01-.076-.229v-.608c0-.076.038-.19.114-.267l2.016-2.016a.41.41 0 01.267-.114h.608a.41.41 0 01.267.114l2.016 2.016a.347.347 0 01.114.267v.608c-.076.077-.114.19-.19.229zm5.593 5.44l-4.832-2.777c-.266-.152-.57-.19-.837-.152-.723.038-1.332.684-1.332 1.408v5.554c0 .8.647 1.408 1.408 1.408.799 0 1.446-.647 1.446-1.408v-3.12l2.7 1.56c.686.38 1.561.152 1.941-.533.419-.646.19-1.521-.494-1.94zm2.549-7.533l-2.701 1.56 2.7 1.56c.686.38.914 1.256.533 1.94-.38.685-1.255.913-1.94.533l-4.832-2.778a1.644 1.644 0 01-.647-.798c-.037-.153-.076-.305-.076-.457 0-.114.039-.228.039-.342.114-.343.342-.647.646-.837l4.832-2.778c.685-.38 1.56-.152 1.94.533.457.609.19 1.484-.494 1.864"/></svg>

package/src/components/databases/icons/spark.svg

@@ -0,0 +1 @@
+<svg role="img" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><title>Apache Spark</title><path d="M10.812 0c-.425.013-.845.215-1.196.605a3.593 3.593 0 00-.493.722c-.355.667-.425 1.415-.556 2.143a551.9 551.9 0 00-.726 4.087c-.027.16-.096.227-.244.273C5.83 8.386 4.06 8.94 2.3 9.514c-.387.125-.773.289-1.114.506-1.042.665-1.196 1.753-.415 2.71.346.422.79.715 1.284.936 1.1.49 2.202.976 3.3 1.47.019.01.036.013.053.019h-.004l1.306.535c0 .023.002.045 0 .073-.2 2.03-.39 4.063-.58 6.095-.04.419-.012.831.134 1.23.317.87 1.065 1.148 1.881.701.372-.204.666-.497.937-.818 1.372-1.623 2.746-3.244 4.113-4.872.111-.133.205-.15.363-.098.349.117.697.231 1.045.347h.001c.02.012.045.02.073.03l.142.042c1.248.416 2.68.775 3.929 1.19.4.132.622.164 1.045.098.311-.048.592-.062.828-.236.602-.33.995-.957.988-1.682-.005-.427-.154-.813-.35-1.186-.82-1.556-1.637-3.113-2.461-4.666-.078-.148-.076-.243.037-.375 1.381-1.615 2.756-3.236 4.133-4.855.272-.32.513-.658.653-1.058.308-.878-.09-1.57-1-1.741a2.783 2.783 0 00-1.235.069c-1.974.521-3.947 1.041-5.918 1.57-.175.047-.26.015-.355-.144a353.08 353.08 0 00-2.421-4.018 4.61 4.61 0 00-.652-.849c-.371-.37-.802-.549-1.227-.536zm.172 3.703a.592.592 0 01.189.211c.87 1.446 1.742 2.89 2.609 4.338.07.118.135.16.277.121 1.525-.41 3.052-.813 4.579-1.217.367-.098.735-.193 1.103-.289a.399.399 0 01-.1.2c-1.259 1.48-2.516 2.962-3.779 4.438-.11.13-.12.22-.04.37.937 1.803 1.768 3.309 2.498 4.76l-3.696-1.019c-.538-.18-1.077-.358-1.615-.539-.163-.055-.25-.03-.36.1-1.248 1.488-2.504 2.97-3.759 4.454a.398.398 0 01-.18.132c.035-.378.068-.757.104-1.136.149-1.572.297-3.144.451-4.716-.03-.318.117-.405-.322-.545-1.493-.593-3.346-1.321-4.816-1.905a.595.595 0 01.24-.134c1.797-.57 3.595-1.14 5.394-1.705.127-.04.199-.092.211-.233.013-.148.05-.294.076-.441.241-1.363.483-2.726.726-4.088.068-.386.14-.771.21-1.157z"/></svg>

package/src/components/databases/icons/sqlalchemy.svg

@@ -0,0 +1 @@
+<svg role="img" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><title>SQLAlchemy</title><path d="M11.8 15.955a44.068 44.068 0 0 1-1.673-.691c-1.736-.757-1.981-.772-2.499-.143-.119.146-.25.236-.287.2-.111-.111.219-.644.617-.993.325-.285.433-.325.791-.285.228.025.985.29 1.682.586 1.573.669 2.034.811 2.635.811.731 0 1.106-.512.876-1.192-.057-.171-.04-.228.074-.228.213 0 .322.797.168 1.255a1.617 1.617 0 0 1-.424.614c-.251.211-.41.257-.879.254a3.853 3.853 0 0 1-1.082-.188h.001Zm.301-2.225c0-.048.179-.134.401-.188l.401-.099.086-1.446c.094-1.599.025-3.172-.148-3.383-.063-.074-.253-.165-.427-.205-.705-.156-.236-.264 1.133-.264 1.368 0 1.803.099 1.152.264-.561.14-.564.148-.564 2.43 0 1.266.046 2.22.111 2.342.092.171.228.207.752.207 1.081 0 1.453-.255 1.747-1.203.088-.284.315-.233.236.054-.037.134-.097.54-.134.91l-.068.669H14.44c-1.286 0-2.339-.04-2.339-.088Zm5.312-.068c0-.086.083-.171.219-.236.183-.086.302-.265.734-1.11.686-1.337 1.767-3.634 1.87-3.978.079-.262.097-.276.392-.31.171-.02.313-.031.316-.025l.527 1.152c.284.628.856 1.824 1.271 2.654.695 1.397.772 1.523 1.005 1.636.142.069.253.174.253.237 0 .099-.122.111-1.175.111-1.056 0-1.175-.012-1.175-.114 0-.068.091-.142.236-.191.134-.043.236-.122.236-.182 0-.057-.139-.432-.31-.834l-.31-.731h-2.35l-.225.495c-.421.928-.43 1.147-.037 1.252.196.054.25.097.227.185-.025.103-.127.117-.867.117-.794.006-.837 0-.837-.128Zm-15.652.025a10.933 10.933 0 0 1-.808-.196l-.549-.154.282-.518.281-.518-.227-.281c-.322-.399-.737-1.272-.74-1.554-.003-.657.851-1.61 1.898-2.122.72-.353 1.291-.362 2.009-.026l.54.253.157-.224c.085-.123.156-.285.156-.356 0-.071.071-.134.157-.134.085 0 .156.023.156.048 0 .063-.629 1.651-.669 1.691-.017.016-.187-.063-.381-.177-.546-.321-1.232-.535-1.764-.549-1.238-.031-1.667 1.178-.794 2.236l.308.373.839-.68c.942-.76 1.05-.777 1.784-.27.825.569.839 1.434.042 2.339-.705.805-1.431 1.027-2.677.819Zm5.984-.165c-.646-.301-1.229-.876-1.565-1.547-.538-1.076-.373-1.765.646-2.695.856-.782 1.556-1.087 2.498-1.087.68 0 .825.037 1.266.307 1.044.646 1.303 1.878.675 3.221-.737 1.577-2.294 2.37-3.52 1.801Zm-3.872-.702c.409-.322.381-.917-.063-1.389-.558-.592-.731-.566-1.713.253-.976.814-.982.783.185 1.155.771.251 1.255.242 1.591-.019Zm6.034-.046c.484-.239.817-1.343.68-2.259-.17-1.13-1.698-1.901-2.819-1.423-1.153.493-1.17 1.804-.037 2.985.791.828 1.471 1.044 2.176.697Zm11.359-1.414c.04-.071-.845-2.003-.928-2.023-.06-.017-.976 1.872-.976 2.014 0 .072 1.861.08 1.904.009Z"/></svg>

package/src/components/databases/icons/sqlite.svg

@@ -0,0 +1 @@
+<svg role="img" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><title>SQLite</title><path d="M21.678.521c-1.032-.92-2.28-.55-3.513.544a8.71 8.71 0 0 0-.547.535c-2.109 2.237-4.066 6.38-4.674 9.544.237.48.422 1.093.544 1.561a13.044 13.044 0 0 1 .164.703s-.019-.071-.096-.296l-.05-.146a1.689 1.689 0 0 0-.033-.08c-.138-.32-.518-.995-.686-1.289-.143.423-.27.818-.376 1.176.484.884.778 2.4.778 2.4s-.025-.099-.147-.442c-.107-.303-.644-1.244-.772-1.464-.217.804-.304 1.346-.226 1.478.152.256.296.698.422 1.186.286 1.1.485 2.44.485 2.44l.017.224a22.41 22.41 0 0 0 .056 2.748c.095 1.146.273 2.13.5 2.657l.155-.084c-.334-1.038-.47-2.399-.41-3.967.09-2.398.642-5.29 1.661-8.304 1.723-4.55 4.113-8.201 6.3-9.945-1.993 1.8-4.692 7.63-5.5 9.788-.904 2.416-1.545 4.684-1.931 6.857.666-2.037 2.821-2.912 2.821-2.912s1.057-1.304 2.292-3.166c-.74.169-1.955.458-2.362.629-.6.251-.762.337-.762.337s1.945-1.184 3.613-1.72C21.695 7.9 24.195 2.767 21.678.521m-18.573.543A1.842 1.842 0 0 0 1.27 2.9v16.608a1.84 1.84 0 0 0 1.835 1.834h9.418a22.953 22.953 0 0 1-.052-2.707c-.006-.062-.011-.141-.016-.2a27.01 27.01 0 0 0-.473-2.378c-.121-.47-.275-.898-.369-1.057-.116-.197-.098-.31-.097-.432 0-.12.015-.245.037-.386a9.98 9.98 0 0 1 .234-1.045l.217-.028c-.017-.035-.014-.065-.031-.097l-.041-.381a32.8 32.8 0 0 1 .382-1.194l.2-.019c-.008-.016-.01-.038-.018-.053l-.043-.316c.63-3.28 2.587-7.443 4.8-9.791.066-.069.133-.128.198-.194Z"/></svg>

package/src/components/databases/icons/timeplus.svg

@@ -0,0 +1,17 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<!-- Generated by Pixelmator Pro 3.6.17 -->
+<svg width="24" height="24" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
+    <g id="Option2SymbolB">
+        <g id="Layer1-2">
+            <g id="Group" opacity="0.4">
+                <path id="Path" fill="#d53c97" stroke="none" d="M 17.016802 12.188573 C 17.016802 9.607646 15.86018 7.293022 14.039526 5.731081 C 13.942595 5.70038 13.844628 5.671406 13.745972 5.645189 C 13.131133 5.809095 12.54265 6.059378 11.998103 6.388559 C 13.964327 7.575191 15.281006 9.730104 15.281006 12.188573 C 15.279476 14.563734 14.033739 16.764488 11.998103 17.988243 C 12.542634 18.317537 13.131119 18.567936 13.745972 18.731958 C 13.844628 18.705742 13.942595 18.67642 14.039526 18.645721 C 15.86018 17.084126 17.016802 14.769501 17.016802 12.188573 Z"/>
+                <path id="path1" fill="#d53c97" stroke="none" d="M 13.897406 5.609659 L 13.894991 5.60759 C 13.844973 5.619663 13.7953 5.631737 13.745972 5.645189 C 13.79599 5.631737 13.847043 5.622078 13.897406 5.609659 Z"/>
+                <path id="path2" fill="#d53c97" stroke="none" d="M 1.735796 12.188573 C 1.735796 9.164728 3.728925 6.59622 6.470945 5.729357 C 7.554634 4.797861 8.856011 4.155121 10.254373 3.860756 C 9.680216 3.740549 9.095179 3.679977 8.508574 3.68 C 3.816888 3.68 -0 7.496887 -0 12.188573 C -0 16.880259 3.816888 20.697147 8.508574 20.697147 C 9.0952 20.697229 9.680255 20.636539 10.254373 20.516048 C 8.855971 20.221794 7.554568 19.579041 6.470945 18.647446 C 3.728925 17.780582 1.735796 15.213453 1.735796 12.188573 Z"/>
+                <path id="path3" fill="#d53c97" stroke="none" d="M 13.745972 18.731958 C 13.7953 18.745068 13.844973 18.757484 13.894991 18.769558 C 13.894991 18.769558 13.896715 18.769558 13.897406 18.767488 C 13.847043 18.754379 13.79599 18.745411 13.745972 18.731958 Z"/>
+            </g>
+            <path id="path4" fill="#ff3b65" stroke="none" d="M 20.508402 12.188573 C 20.508402 9.606611 19.351088 7.290262 17.5294 5.729357 C 16.301817 5.342468 14.989366 5.313629 13.745972 5.646223 C 16.636665 6.418224 18.772606 9.058484 18.772606 12.189609 C 18.772606 15.320732 16.636665 17.960991 13.745972 18.731958 C 14.98947 19.064316 16.301983 19.034998 17.5294 18.647446 C 19.419907 17.034296 20.508638 14.673781 20.508402 12.188573 Z"/>
+            <path id="path5" fill="#ff3b65" stroke="none" d="M 9.962543 18.647446 C 7.220525 17.780582 5.227395 15.213453 5.227395 12.188573 C 5.227395 9.163693 7.220525 6.59622 9.962543 5.729357 C 11.046233 4.797861 12.34761 4.155121 13.745972 3.860756 C 13.171818 3.74053 12.586779 3.679956 12.000173 3.68 C 7.308832 3.68 3.491599 7.496887 3.491599 12.188573 C 3.491599 16.880259 7.308487 20.697147 12.000173 20.697147 C 12.586799 20.697247 13.171857 20.636557 13.745972 20.516048 C 12.34757 20.221794 11.046167 19.579041 9.962543 18.647446 Z"/>
+            <path id="path6" fill="#383838" stroke="none" d="M 15.491772 3.68 C 10.800431 3.68 6.983198 7.496887 6.983198 12.188573 C 6.983198 16.880259 10.800086 20.697147 15.491772 20.697147 C 20.183456 20.697147 24 16.880259 24 12.188573 C 24 7.496887 20.183456 3.68 15.491772 3.68 Z M 22.264549 12.188573 C 22.264549 15.923018 19.226215 18.961351 15.491772 18.961351 C 11.757326 18.961351 8.718994 15.923018 8.718994 12.188573 C 8.718994 8.454128 11.757326 5.415796 15.491772 5.415796 C 19.226215 5.415796 22.264549 8.454128 22.264549 12.188573 Z"/>
+        </g>
+    </g>
+</svg>

package/src/components/databases/icons/trino.svg

@@ -0,0 +1 @@
+<svg role="img" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><title>Trino</title><path d="M14.124 16.8529a.1615.1615 0 1 1 .1576.1614.1577.1577 0 0 1-.1576-.1614zm-5.607-.1576a.1614.1614 0 1 0 0 .3228.1614.1614 0 0 0 0-.3228zm10.1341-.6648v1.9869c-.031.5788-.524 1.0237-1.1029.9954h-.3843a5.0596 5.0596 0 0 1-1.1298 1.7178.3192.3192 0 0 0 0 .465l.2382.2191a.3036.3036 0 0 1 .0385.4304c-1.126 1.3835-2.9669 2.1521-5.0498 2.1521a6.575 6.575 0 0 1-4.8192-1.8985c-.0029-.0032-.0059-.0063-.0087-.0096a.6302.6302 0 0 1 .0548-.8896c.137-.1265.1371-.3462 0-.4727a4.944 4.944 0 0 1-1.126-1.714h-.3497c-.5797.0284-1.0737-.416-1.1068-.9954v-1.9869c.0351-.5779.5286-1.02 1.1068-.9915h.2728a5.7648 5.7648 0 0 1 2.0791-3.0936c-.4227-1.0991-1.1529-3.2551-1.226-5.0075C6.0229 4.4705 6.2189.078 7.8253.001c1.6064-.0768 1.3719 4.0275 1.0991 6.6946a32.732 32.732 0 0 0-.123 4.4503 6.994 6.994 0 0 1 2.4826-.4304 7.2414 7.2414 0 0 1 1.7371.2075c.2614-1.2682.8762-3.574 2.0292-5.1958 1.6717-2.352 3.4357-4.7808 4.6116-4.1006 1.176.6802-.3074 3.1398-1.3297 4.4272-1.0222 1.2874-2.7862 3.2089-3.3742 4.2274-.2114.3843-.4304.8032-.5956 1.1529a5.7375 5.7375 0 0 1 2.9169 3.6125h.073v-2.3058a.3075.3075 0 0 0-.1806-.2844.9148.9148 0 0 1-.5573-.8148 1.0184 1.0184 0 0 1 .9045-.9044c.5593-.0598 1.061.3452 1.1208.9044a.9187.9187 0 0 1-.5534.8148.3074.3074 0 0 0-.1691.2844v2.1522a.3113.3113 0 0 0 .1691.2805.9724.9724 0 0 1 .5648.857zm-1.0222-3.9737a.4345.4345 0 0 0 .4612-.4151.4151.4151 0 1 0-.4612.4151zm-.4227 3.4779c.0978.4794.148.9672.1498 1.4565v.3651h.4113a.3228.3228 0 0 0 .3228-.319v-1.0069c-.0111-.2967-.2733-.5256-.5688-.4957h-.3151zm-3.7278-4.481.611.2383a36.6046 36.6046 0 0 1 2.3828-3.8661c1.2874-1.7255 2.3365-3.5817 1.8715-3.8699-.465-.2883-1.6179 1.2297-2.7708 3.109a34.8978 34.8978 0 0 0-2.0945 4.3887zm-4.0544.6726.0154 1.3335c-.0039.2007.1881.3587.3843.3152a6.4317 6.4317 0 0 1 1.4565-.1653 5.995 5.995 0 0 1 1.4527.1729c.1956.0398.3853-.1153.3843-.3151v-1.3412a.319.319 0 0 0-.2421-.3113 6.664 6.664 0 0 0-1.6026-.1845 6.7093 6.7093 0 0 0-1.6025.1845.3188.3188 0 0 0-.246.3113zm1.7063 6.8637v.3843a.6878.6878 0 0 1-.4996.269c-.3074 0-.538-.4189-.538-.4189a.073.073 0 0 0-.1-.0307l-.0024.0013a.0693.0693 0 0 0-.0245.0947c.0115.0231.2806.4957.6649.4957a.7144.7144 0 0 0 .3843-.1268.3267.3267 0 0 1 .3612 0 .8332.8332 0 0 0 .4727.1345.957.957 0 0 0 .6572-.4803.0692.0692 0 0 0-.0269-.0961.0692.0692 0 0 0-.0999.0269c0 .0231-.2191.3843-.5419.4074a.8036.8036 0 0 1-.5765-.269v-.3843a.3154.3154 0 0 1 .1268-.2537c.196-.1499.415-.3958.415-.4919a.538.538 0 0 0-.5764-.4189c-.3766 0-.6533.2498-.6533.4573 0 .1345.2536.3382.4227.4612a.3226.3226 0 0 1 .1346.2383zM7.783 11.6455l.5765-.3074c-.0192-1.126-.0346-3.1436 0-4.5425.0538-2.0368.1537-4.5732-.5226-4.5463S6.6877 4.2285 6.949 7.007a33.0562 33.0562 0 0 0 .834 4.6385zm-3.305 5.3919a.319.319 0 0 0 .319.319h.3997a3.046 3.046 0 0 1 0-.3651 7.546 7.546 0 0 1 .1461-1.4565c-.0493.0002-.34.0005-.3866-.0021a.4881.4881 0 0 0-.4781.4979v1.0068zm.9184 1.4718a5.3254 5.3254 0 0 1-.123-.5573.3228.3228 0 0 0-.319-.2728h-.4957c.0007.0163-.0015.34.0009.355a.5188.5188 0 0 0 .5526.4827l.3842-.0076zm10.1265 2.917-.0884-.0807a.3229.3229 0 0 0-.3843-.0269 6.9823 6.9823 0 0 1-3.8046 1.0068 6.995 6.995 0 0 1-3.7932-1.0068.3228.3228 0 0 0-.3843.0269l-.0884.0807a.3154.3154 0 0 0 0 .4573 6.0305 6.0305 0 0 0 4.2927 1.5988 6.0453 6.0453 0 0 0 4.2889-1.5988.315.315 0 0 0-.0384-.4573zm1.4488-4.4158c0-2.4557-1.1529-4.3273-3.0245-5.2266-.2081-.1022-.4673.0594-.465.2921v1.3297a.3269.3269 0 0 0 .2037.296c1.7332.7109 2.9284 2.1866 2.9284 3.8776 0 2.2712-2.1559 3.8085-5.3419 3.8085-3.1859 0-5.3419-1.5411-5.3419-3.8085 0-1.691 1.1952-3.1667 2.9284-3.8776a.319.319 0 0 0 .2037-.296v-1.322c.0048-.2315-.2536-.3963-.4612-.2921-1.887.8839-3.0399 2.767-3.0399 5.2073 0 2.9899 2.2866 4.996 5.7108 4.996 3.4282.0001 5.6994-2.0098 5.6994-4.9844zm-8.6084-.538h-.0038a.5842.5842 0 1 0 .0038 0zm5.1614.5919c.0063.3226.2615.5789.584.5725a.5842.5842 0 1 0-.584-.5725zm4.5692.6225h-.4996a.3227.3227 0 0 0-.3151.2728c-.0346.173-.0768.3766-.1268.5573.0163.0007.3861-.0014.4012.0009a.5188.5188 0 0 0 .5366-.5004l.0037-.3306z"/></svg>

package/src/components/datasets/icons.tsx

@@ -0,0 +1,55 @@
+/* Copyright 2024 Marimo. All rights reserved. */
+
+import {
+  CalendarClockIcon,
+  CalendarIcon,
+  ClockIcon,
+  CurlyBracesIcon,
+  HashIcon,
+  type LucideIcon,
+  ToggleLeftIcon,
+  TypeIcon,
+} from "lucide-react";
+import type { DataType } from "@/core/kernel/messages";
+import { logNever } from "@/utils/assertNever";
+import type { SelectableDataType } from "../data-table/charts/types";
+
+/**
+ * Maps a data type to an icon.
+ */
+export const DATA_TYPE_ICON: Record<DataType | SelectableDataType, LucideIcon> =
+  {
+    boolean: ToggleLeftIcon,
+    date: CalendarIcon,
+    time: ClockIcon,
+    datetime: CalendarClockIcon,
+    temporal: CalendarClockIcon,
+    number: HashIcon,
+    string: TypeIcon,
+    integer: HashIcon,
+    unknown: CurlyBracesIcon,
+  };
+
+export function getDataTypeColor(
+  dataType: DataType | SelectableDataType,
+): string {
+  switch (dataType) {
+    case "boolean":
+      return "bg-(--orange-4)";
+    case "date":
+    case "time":
+    case "datetime":
+    case "temporal":
+      return "bg-(--grass-4) dark:bg-(--grass-5)";
+    case "number":
+    case "integer":
+      return "bg-(--purple-4)";
+    case "string":
+      return "bg-(--blue-4)";
+    case "unknown":
+      return "bg-(--slate-4) dark:bg-(--slate-6)";
+    default:
+      logNever(dataType);
+      return "bg-(--slate-4) dark:bg-(--slate-6)";
+  }
+}

package/src/components/datasources/__tests__/install-package-button.test.tsx

@@ -0,0 +1,85 @@
+/* Copyright 2024 Marimo. All rights reserved. */
+
+import { render, screen } from "@testing-library/react";
+import { Provider } from "jotai";
+import React from "react";
+import { beforeEach, describe, expect, it, vi } from "vitest";
+import { MockRequestClient } from "@/__mocks__/requests";
+import { requestClientAtom } from "@/core/network/requests";
+import { store } from "@/core/state/jotai";
+import { InstallPackageButton } from "../install-package-button";
+
+const mockOpenApplication = vi.fn();
+vi.mock("@/components/editor/chrome/state", () => ({
+  useChromeActions: () => ({
+    openApplication: mockOpenApplication,
+  }),
+}));
+
+vi.mock("@/components/editor/chrome/panels/packages-state", () => ({
+  packagesToInstallAtom: {},
+}));
+
+const mockRequestAnimationFrame = vi.fn((callback) => {
+  callback();
+  return 1;
+});
+vi.stubGlobal("requestAnimationFrame", mockRequestAnimationFrame);
+
+const mockInput = {
+  focus: vi.fn(),
+  value: "",
+  dispatchEvent: vi.fn(),
+};
+vi.spyOn(document, "getElementById").mockReturnValue(
+  mockInput as unknown as HTMLInputElement,
+);
+
+function createTestWrapper() {
+  const wrapper = ({ children }: { children: React.ReactNode }) => (
+    <Provider store={store}>{children}</Provider>
+  );
+  return { wrapper };
+}
+
+describe("InstallPackageButton", () => {
+  const { wrapper } = createTestWrapper();
+
+  beforeEach(() => {
+    vi.clearAllMocks();
+    store.set(requestClientAtom, MockRequestClient.create());
+  });
+
+  it("should not render when packages is undefined", () => {
+    const { container } = render(
+      <InstallPackageButton packages={undefined} />,
+      { wrapper },
+    );
+    expect(container.firstChild).toBeNull();
+  });
+
+  it("should not render when packages is empty", () => {
+    const { container } = render(<InstallPackageButton packages={[]} />, {
+      wrapper,
+    });
+    expect(container.firstChild).toBeNull();
+  });
+
+  it("should render with the correct package names", () => {
+    render(<InstallPackageButton packages={["altair", "pandas"]} />, {
+      wrapper,
+    });
+    expect(screen.getByText("Install altair, pandas")).toBeInTheDocument();
+  });
+
+  it("should render correct package names when showMaxPackages is set", () => {
+    render(
+      <InstallPackageButton
+        packages={["altair", "pandas"]}
+        showMaxPackages={1}
+      />,
+      { wrapper },
+    );
+    expect(screen.getByText("Install altair")).toBeInTheDocument();
+  });
+});

package/src/components/datasources/__tests__/utils.test.ts

@@ -0,0 +1,171 @@
+/* Copyright 2024 Marimo. All rights reserved. */
+
+import { describe, expect, it } from "vitest";
+import type { SQLTableContext } from "@/core/datasets/data-source-connections";
+import { DUCKDB_ENGINE } from "@/core/datasets/engines";
+import type { DataTable, DataTableColumn } from "@/core/kernel/messages";
+import { sqlCode } from "../utils";
+
+describe("sqlCode", () => {
+  const mockTable: DataTable = {
+    name: "users" as const,
+    columns: [],
+    source: "local",
+    source_type: "local",
+    type: "table",
+  };
+  const mockColumn = {
+    name: "email" as const,
+  } as DataTableColumn;
+
+  it("should generate basic SQL without sqlTableContext", () => {
+    const result = sqlCode({ table: mockTable, columnName: mockColumn.name });
+    expect(result).toBe(
+      "_df = mo.sql(f'SELECT \"email\" FROM users LIMIT 100')",
+    );
+  });
+
+  it("should generate SQL with default schema", () => {
+    const sqlTableContext: SQLTableContext = {
+      engine: DUCKDB_ENGINE,
+      schema: "public",
+      defaultSchema: "public",
+      defaultDatabase: "mydb",
+      database: "mydb",
+    };
+
+    const result = sqlCode({
+      table: mockTable,
+      columnName: mockColumn.name,
+      sqlTableContext,
+    });
+    expect(result).toBe('_df = mo.sql(f"SELECT email FROM users LIMIT 100")');
+  });
+
+  it("should generate SQL with non-default schema", () => {
+    const sqlTableContext: SQLTableContext = {
+      engine: DUCKDB_ENGINE,
+      schema: "analytics",
+      defaultSchema: "public",
+      defaultDatabase: "mydb",
+      database: "mydb",
+    };
+
+    const result = sqlCode({
+      table: mockTable,
+      columnName: mockColumn.name,
+      sqlTableContext,
+    });
+    expect(result).toBe(
+      '_df = mo.sql(f"SELECT email FROM analytics.users LIMIT 100")',
+    );
+  });
+
+  it("should generate SQL with non-default engine", () => {
+    const sqlTableContext: SQLTableContext = {
+      engine: "snowflake",
+      schema: "public",
+      defaultSchema: "public",
+      defaultDatabase: "mydb",
+      database: "mydb",
+    };
+
+    const result = sqlCode({
+      table: mockTable,
+      columnName: mockColumn.name,
+      sqlTableContext,
+    });
+    expect(result).toBe(
+      '_df = mo.sql(f"SELECT email FROM users LIMIT 100", engine=snowflake)',
+    );
+  });
+
+  it("should generate SQL with non-default schema and non-default engine", () => {
+    const sqlTableContext: SQLTableContext = {
+      engine: "bigquery",
+      schema: "sales",
+      defaultSchema: "public",
+      defaultDatabase: "mydb",
+      database: "mydb",
+    };
+
+    const result = sqlCode({
+      table: mockTable,
+      columnName: mockColumn.name,
+      sqlTableContext,
+    });
+    expect(result).toBe(
+      '_df = mo.sql(f"SELECT email FROM sales.users LIMIT 100", engine=bigquery)',
+    );
+  });
+
+  it("should generate SQL with non-default database", () => {
+    const sqlTableContext: SQLTableContext = {
+      engine: DUCKDB_ENGINE,
+      schema: "public",
+      defaultSchema: "public",
+      defaultDatabase: "memory",
+      database: "remote",
+    };
+
+    const result = sqlCode({
+      table: mockTable,
+      columnName: mockColumn.name,
+      sqlTableContext,
+    });
+    expect(result).toBe(
+      '_df = mo.sql(f"SELECT email FROM remote.users LIMIT 100")',
+    );
+  });
+
+  it("should generate SQL with non-default database and non-default schema", () => {
+    const sqlTableContext: SQLTableContext = {
+      engine: "bigquery",
+      schema: "sales",
+      defaultSchema: "public",
+      defaultDatabase: "mydb",
+      database: "remote",
+    };
+
+    const result = sqlCode({
+      table: mockTable,
+      columnName: mockColumn.name,
+      sqlTableContext,
+    });
+    expect(result).toBe(
+      '_df = mo.sql(f"SELECT email FROM remote.sales.users LIMIT 100", engine=bigquery)',
+    );
+  });
+
+  it("should generate SQL for schemaless tables", () => {
+    const sqlTableContext: SQLTableContext = {
+      engine: DUCKDB_ENGINE,
+      schema: "",
+      defaultDatabase: "mydb",
+      database: "mydb",
+    };
+
+    const result = sqlCode({
+      table: mockTable,
+      columnName: mockColumn.name,
+      sqlTableContext,
+    });
+    expect(result).toBe('_df = mo.sql(f"SELECT email FROM users LIMIT 100")');
+
+    const sqlTableContext2: SQLTableContext = {
+      engine: DUCKDB_ENGINE,
+      schema: "",
+      defaultDatabase: "remote",
+      database: "another_db",
+    };
+
+    const result2 = sqlCode({
+      table: mockTable,
+      columnName: mockColumn.name,
+      sqlTableContext: sqlTableContext2,
+    });
+    expect(result2).toBe(
+      '_df = mo.sql(f"SELECT email FROM another_db.users LIMIT 100")',
+    );
+  });
+});