Skip to content

Commit 3bbc0bf

Browse files
jankucajankuca
committed
add svg logos of integrations
1 parent 81e3e7c commit 3bbc0bf

File tree

21 files changed

+591
-22
lines changed

21 files changed

+591
-22
lines changed

‎src/notebooks/deepnote/integrations/integrationWebview.ts‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -625,7 +625,7 @@ export class IntegrationWebviewProvider implements IIntegrationWebviewProvider {
625625
<head>
626626
<meta charset="UTF-8">
627627
<meta name="viewport" content="width=device-width, initial-scale=1.0">
628-
<meta http-equiv="Content-Security-Policy" content="default-src 'none'; style-src ${webview.cspSource} 'unsafe-inline'; script-src 'nonce-${nonce}'; font-src ${webview.cspSource};">
628+
<meta http-equiv="Content-Security-Policy" content="default-src 'none'; img-src ${webview.cspSource} https: data:; style-src ${webview.cspSource} 'unsafe-inline'; script-src 'nonce-${nonce}'; font-src ${webview.cspSource};">
629629
<link rel="stylesheet" href="${codiconUri}">
630630
<title>Deepnote Integrations</title>
631631
</head>

‎src/webviews/webview-side/integrations/IntegrationTypeSelector.tsx‎

Lines changed: 41 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,27 @@ import * as React from 'react';
22
import { getLocString } from '../react-common/locReactSide';
33
import { ConfigurableDatabaseIntegrationType } from './types';
44

5+
// Import integration logos
6+
/* eslint-disable @typescript-eslint/no-require-imports */
7+
const postgresqlLogo: string = require('./icons/postgresql.svg');
8+
const mysqlLogo: string = require('./icons/mysql.svg');
9+
const mariadbLogo: string = require('./icons/mariadb.svg');
10+
const mongodbLogo: string = require('./icons/mongodb.svg');
11+
const sqlServerLogo: string = require('./icons/sql-server.svg');
12+
const bigqueryLogo: string = require('./icons/bigquery.svg');
13+
const snowflakeLogo: string = require('./icons/snowflake.svg');
14+
const alloydbLogo: string = require('./icons/alloydb.svg');
15+
const spannerLogo: string = require('./icons/spanner.svg');
16+
const materializeLogo: string = require('./icons/materialize.svg');
17+
const clickhouseLogo: string = require('./icons/clickhouse.svg');
18+
const athenaLogo: string = require('./icons/athena.svg');
19+
const redshiftLogo: string = require('./icons/redshift.svg');
20+
const databricksLogo: string = require('./icons/databricks.svg');
21+
const dremioLogo: string = require('./icons/dremio.svg');
22+
const mindsdbLogo: string = require('./icons/mindsdb.svg');
23+
const trinoLogo: string = require('./icons/trino.svg');
24+
/* eslint-enable @typescript-eslint/no-require-imports */
25+
526
export interface IIntegrationTypeSelectorProps {
627
onSelectType: (type: ConfigurableDatabaseIntegrationType) => void;
728
}
@@ -16,87 +37,87 @@ const INTEGRATION_TYPES: IntegrationTypeInfo[] = [
1637
{
1738
type: 'pgsql',
1839
label: 'PostgreSQL',
19-
icon: '🐘'
40+
icon: postgresqlLogo
2041
},
2142
{
2243
type: 'mysql',
2344
label: 'MySQL',
24-
icon: '🐬'
45+
icon: mysqlLogo
2546
},
2647
{
2748
type: 'mariadb',
2849
label: 'MariaDB',
29-
icon: '🦭'
50+
icon: mariadbLogo
3051
},
3152
{
3253
type: 'mongodb',
3354
label: 'MongoDB',
34-
icon: '🍃'
55+
icon: mongodbLogo
3556
},
3657
{
3758
type: 'sql-server',
3859
label: 'Microsoft SQL Server',
39-
icon: '🗄️'
60+
icon: sqlServerLogo
4061
},
4162
{
4263
type: 'big-query',
4364
label: 'Google BigQuery',
44-
icon: '📊'
65+
icon: bigqueryLogo
4566
},
4667
{
4768
type: 'snowflake',
4869
label: 'Snowflake',
49-
icon: '❄️'
70+
icon: snowflakeLogo
5071
},
5172
{
5273
type: 'alloydb',
5374
label: 'Google AlloyDB',
54-
icon: '🔷'
75+
icon: alloydbLogo
5576
},
5677
{
5778
type: 'spanner',
5879
label: 'Google Cloud Spanner',
59-
icon: '🔧'
80+
icon: spannerLogo
6081
},
6182
{
6283
type: 'materialize',
6384
label: 'Materialize',
64-
icon: '⚡'
85+
icon: materializeLogo
6586
},
6687
{
6788
type: 'clickhouse',
6889
label: 'ClickHouse',
69-
icon: '🏠'
90+
icon: clickhouseLogo
7091
},
7192
{
7293
type: 'athena',
7394
label: 'Amazon Athena',
74-
icon: '🏛️'
95+
icon: athenaLogo
7596
},
7697
{
7798
type: 'redshift',
7899
label: 'Amazon Redshift',
79-
icon: '🔴'
100+
icon: redshiftLogo
80101
},
81102
{
82103
type: 'databricks',
83104
label: 'Databricks',
84-
icon: '🧱'
105+
icon: databricksLogo
85106
},
86107
{
87108
type: 'dremio',
88109
label: 'Dremio',
89-
icon: '🚀'
110+
icon: dremioLogo
90111
},
91112
{
92113
type: 'mindsdb',
93114
label: 'MindsDB',
94-
icon: '🧠'
115+
icon: mindsdbLogo
95116
},
96117
{
97118
type: 'trino',
98119
label: 'Trino',
99-
icon: '⚙️'
120+
icon: trinoLogo
100121
}
101122
];
102123

@@ -112,7 +133,9 @@ export const IntegrationTypeSelector: React.FC<IIntegrationTypeSelectorProps> =
112133
className="integration-type-card"
113134
onClick={() => onSelectType(integrationInfo.type)}
114135
>
115-
<div className="integration-type-icon">{integrationInfo.icon}</div>
136+
<div className="integration-type-icon">
137+
<img src={integrationInfo.icon} alt={integrationInfo.label} />
138+
</div>
116139
<div className="integration-type-label">{integrationInfo.label}</div>
117140
<div className="integration-type-category">
118141
{getLocString('integrationsDatabase', 'Database')}
@@ -123,4 +146,3 @@ export const IntegrationTypeSelector: React.FC<IIntegrationTypeSelectorProps> =
123146
</div>
124147
);
125148
};
126-

‎src/webviews/webview-side/integrations/icons/alloydb.svg‎

Lines changed: 14 additions & 0 deletions
Loading

‎src/webviews/webview-side/integrations/icons/athena.svg‎

Lines changed: 82 additions & 0 deletions
Loading

‎src/webviews/webview-side/integrations/icons/bigquery.svg‎

Lines changed: 14 additions & 0 deletions
Loading

‎src/webviews/webview-side/integrations/icons/clickhouse.svg‎

Lines changed: 7 additions & 0 deletions
Loading

‎src/webviews/webview-side/integrations/icons/databricks.svg‎

Lines changed: 6 additions & 0 deletions
Loading

‎src/webviews/webview-side/integrations/icons/dremio.svg‎

Lines changed: 86 additions & 0 deletions
Loading

‎src/webviews/webview-side/integrations/icons/mariadb.svg‎

Lines changed: 11 additions & 0 deletions
Loading

0 commit comments

Comments
 (0)