mdi font icons

packages/web/src/appobj/MacroAppObject.js

@@ -1,14 +1,13 @@
 import _ from 'lodash';
 import { filterName } from '@dbgate/datalib';
-import { MacroIcon, StartIcon } from '../icons';
 
 const macroAppObject = () => ({ name, type, title, group }, { setOpenedTabs }) => {
   const key = name;
-  const Icon = MacroIcon;
+  const icon = 'mdi mdi-hammer-wrench';
   const matcher = (filter) => filterName(filter, name, title);
   const groupTitle = group;
 
-  return { title, key, Icon, groupTitle, matcher };
+  return { title, key, icon, groupTitle, matcher };
 };
 
 export default macroAppObject;

packages/web/src/appobj/archiveFileAppObject.js

@@ -1,16 +1,17 @@
 import React from 'react';
 import _ from 'lodash';
 import moment from 'moment';
-import { DatabaseIcon, getIconImage, ArchiveTableIcon } from '../icons';
 import { DropDownMenuItem } from '../modals/DropDownMenu';
 import { openNewTab } from '../utility/common';
 import { filterName } from '@dbgate/datalib';
 import axios from '../utility/axios';
 
+const archiveTableIcon = 'mdi mdi-table color-yellow-icon';
+
 function openArchive(setOpenedTabs, fileName, folderName) {
   openNewTab(setOpenedTabs, {
     title: fileName,
-    icon: 'archtable.svg',
+    icon: archiveTableIcon,
     tooltip: `${folderName}\n${fileName}`,
     tabComponent: 'ArchiveFileTab',
     props: {
@@ -33,7 +34,7 @@ function Menu({ data, setOpenedTabs }) {
 
     openNewTab(setOpenedTabs, {
       title: data.fileName,
-      icon: 'freetable.svg',
+      icon: archiveTableIcon,
       tabComponent: 'FreeTableTab',
       props: {
         initialData: {
@@ -60,13 +61,13 @@ function Menu({ data, setOpenedTabs }) {
 
 const archiveFileAppObject = () => ({ fileName, folderName }, { setOpenedTabs }) => {
   const key = fileName;
-  const Icon = ArchiveTableIcon;
+  const icon = archiveTableIcon;
   const onClick = () => {
     openArchive(setOpenedTabs, fileName, folderName);
   };
   const matcher = (filter) => filterName(filter, fileName);
 
-  return { title: fileName, key, Icon, Menu, onClick, matcher };
+  return { title: fileName, key, icon, Menu, onClick, matcher };
 };
 
 export default archiveFileAppObject;

packages/web/src/appobj/archiveFolderAppObject.js

@@ -1,7 +1,6 @@
 import React from 'react';
 import _ from 'lodash';
 import moment from 'moment';
-import { LocalDbIcon, getIconImage } from '../icons';
 import { DropDownMenuItem } from '../modals/DropDownMenu';
 import axios from '../utility/axios';
 import { filterName } from '@dbgate/datalib';
@@ -19,11 +18,11 @@ function Menu({ data, setOpenedTabs }) {
 
 const archiveFolderAppObject = () => ({ name }, { setOpenedTabs, currentArchive }) => {
   const key = name;
-  const Icon = LocalDbIcon;
+  const icon = 'mdi mdi-database-outline color-green-icon';
   const isBold = name == currentArchive;
   const matcher = (filter) => filterName(filter, name);
 
-  return { title: name, key, Icon, isBold, Menu, matcher };
+  return { title: name, key, icon, isBold, Menu, matcher };
 };
 
 export default archiveFolderAppObject;

packages/web/src/appobj/closedTabAppObject.js

@@ -1,7 +1,6 @@
 import React from 'react';
 import _ from 'lodash';
 import moment from 'moment';
-import { getIconImage } from '../icons';
 import { DropDownMenuItem } from '../modals/DropDownMenu';
 
 function Menu({ data, setOpenedTabs }) {
@@ -21,7 +20,6 @@ function Menu({ data, setOpenedTabs }) {
 
 const closedTabAppObject = () => ({ tabid, props, selected, icon, title, closedTime, busy }, { setOpenedTabs }) => {
   const key = tabid;
-  const Icon = (props) => getIconImage(icon, props);
   const isBold = !!selected;
 
   const onClick = () => {
@@ -34,7 +32,7 @@ const closedTabAppObject = () => ({ tabid, props, selected, icon, title, closedT
     );
   };
 
-  return { title: `${title} ${moment(closedTime).fromNow()}`, key, Icon, isBold, onClick, isBusy: busy, Menu };
+  return { title: `${title} ${moment(closedTime).fromNow()}`, key, icon, isBold, onClick, isBusy: busy, Menu };
 };
 
 export default closedTabAppObject;

packages/web/src/appobj/columnAppObject.js

@@ -1,17 +1,15 @@
-import { ColumnIcon, SequenceIcon } from '../icons';
-
 /** @param columnProps {import('@dbgate/types').ColumnInfo} */
 function getColumnIcon(columnProps) {
-  if (columnProps.autoIncrement) return SequenceIcon;
-  return ColumnIcon;
+  if (columnProps.autoIncrement) return 'mdi mdi-numeric-1-box-multiple-outline';
+  return 'mdi mdi-table-column';
 }
 
 /** @param columnProps {import('@dbgate/types').ColumnInfo} */
 export default function columnAppObject(columnProps, { setOpenedTabs }) {
   const title = columnProps.columnName;
   const key = title;
-  const Icon = getColumnIcon(columnProps);
+  const icon = getColumnIcon(columnProps);
   const isBold = columnProps.notNull;
 
-  return { title, key, Icon, isBold };
+  return { title, key, icon, isBold };
 }

packages/web/src/appobj/constraintAppObject.js

@@ -1,9 +1,7 @@
-import { PrimaryKeyIcon, ForeignKeyIcon } from '../icons';
-
 /** @param props {import('@dbgate/types').ConstraintInfo} */
 function getConstraintIcon(props) {
-  if (props.constraintType == 'primaryKey') return PrimaryKeyIcon;
-  if (props.constraintType == 'foreignKey') return ForeignKeyIcon;
+  if (props.constraintType == 'primaryKey') return 'mdi mdi-key-star color-yellow-icon';
+  if (props.constraintType == 'foreignKey') return 'mdi mdi-key-link';
   return null;
 }
 
@@ -11,7 +9,7 @@ function getConstraintIcon(props) {
 export default function constraintAppObject(props, { setOpenedTabs }) {
   const title = props.constraintName;
   const key = title;
-  const Icon = getConstraintIcon(props);
+  const icon = getConstraintIcon(props);
 
-  return { title, key, Icon };
+  return { title, key, icon };
 }

packages/web/src/appobj/databaseAppObject.js

@@ -1,6 +1,5 @@
 import React from 'react';
 import _ from 'lodash';
-import { DatabaseIcon } from '../icons';
 import { DropDownMenuItem } from '../modals/DropDownMenu';
 import { openNewTab } from '../utility/common';
 import ImportExportModal from '../modals/ImportExportModal';

packages/web/src/appobj/databaseObjectAppObject.js

@@ -1,6 +1,5 @@
 import _ from 'lodash';
 import React from 'react';
-import { getIconImage } from '../icons';
 import { DropDownMenuItem } from '../modals/DropDownMenu';
 import { openNewTab } from '../utility/common';
 import { getConnectionInfo } from '../utility/metadataLoaders';
@@ -102,7 +101,7 @@ export async function openDatabaseObjectDetail(
   openNewTab(setOpenedTabs, {
     title: pureName,
     tooltip,
-    icon: sqlTemplate ? 'sql.svg' : icons[objectTypeField],
+    icon: sqlTemplate ? 'mdi mdi-file' : icons[objectTypeField],
     tabComponent: sqlTemplate ? 'QueryTab' : tabComponent,
     props: {
       schemaName,
@@ -139,7 +138,7 @@ function Menu({ data, makeAppObj, setOpenedTabs, showModal }) {
               const coninfo = await getConnectionInfo(data);
               openNewTab(setOpenedTabs, {
                 title: data.pureName,
-                icon: 'freetable.svg',
+                icon: 'mdi mdi-table color-green-icon',
                 tabComponent: 'FreeTableTab',
                 props: {
                   initialData: {

packages/web/src/appobj/savedSqlFileAppObject.js

@@ -1,9 +1,6 @@
 import React from 'react';
 import _ from 'lodash';
-import { SqlIcon } from '../icons';
-import { openNewTab } from '../utility/common';
 import { DropDownMenuItem } from '../modals/DropDownMenu';
-import { useSetSavedSqlFiles } from '../utility/globalState';
 
 function Menu({ data, setSavedSqlFiles }) {
   const handleDelete = () => {
@@ -19,7 +16,7 @@ function Menu({ data, setSavedSqlFiles }) {
 const savedSqlFileAppObject = () => ({ name, storageKey }, { setOpenedTabs, newQuery, openedTabs }) => {
   const key = storageKey;
   const title = name;
-  const Icon = SqlIcon;
+  const icon = 'mdi mdi-file';
 
   const onClick = () => {
     const existing = openedTabs.find((x) => x.props && x.props.storageKey == storageKey);
@@ -38,7 +35,7 @@ const savedSqlFileAppObject = () => ({ name, storageKey }, { setOpenedTabs, newQ
     }
   };
 
-  return { title, key, Icon, onClick, Menu };
+  return { title, key, icon, onClick, Menu };
 };
 
 export default savedSqlFileAppObject;