diff --git a/packages/nc-gui/assets/nc-icons/whatsapp-solid.svg b/packages/nc-gui/assets/nc-icons/whatsapp-solid.svg
new file mode 100644
index 0000000000..ca7ed8caa9
--- /dev/null
+++ b/packages/nc-gui/assets/nc-icons/whatsapp-solid.svg
@@ -0,0 +1,11 @@
+
\ No newline at end of file
diff --git a/packages/nc-gui/components/workspace/integrations/IntegrationsTab.vue b/packages/nc-gui/components/workspace/integrations/IntegrationsTab.vue
index 1a08548b8f..5a8487518d 100644
--- a/packages/nc-gui/components/workspace/integrations/IntegrationsTab.vue
+++ b/packages/nc-gui/components/workspace/integrations/IntegrationsTab.vue
@@ -485,11 +485,11 @@ const handleOpenRequestIntegration = () => {
.integration-icon-wrapper {
// @apply bg-gray-50;
- .integration-icon {
- @apply !grayscale;
+ // .integration-icon {
+ // @apply !grayscale;
- filter: grayscale(100%) brightness(115%);
- }
+ // filter: grayscale(100%) brightness(115%);
+ // }
}
.name {
diff --git a/packages/nc-gui/utils/iconUtils.ts b/packages/nc-gui/utils/iconUtils.ts
index b11fd42356..67889583d7 100644
--- a/packages/nc-gui/utils/iconUtils.ts
+++ b/packages/nc-gui/utils/iconUtils.ts
@@ -249,6 +249,7 @@ import NcMicrosoftTeams from '~icons/nc-icons/microsoft-teams'
import NcMattermost from '~icons/nc-icons/mattermost'
import NcTwilio from '~icons/nc-icons/twilio'
import NcWhatsapp from '~icons/nc-icons/whatsapp'
+import NcWhatsappSolid from '~icons/nc-icons/whatsapp-solid'
// View icons
import NcViewGantt from '~icons/nc-icons/view-gantt'
@@ -751,6 +752,7 @@ export const iconMap = {
mattermost: NcMattermost,
twilio: NcTwilio,
whatsapp: NcWhatsapp,
+ whatsappSolid: NcWhatsappSolid,
viewGannt: NcViewGantt,
dollerSign: NcDollerSign,
multiFile: NcMultiFile,
diff --git a/packages/nc-gui/utils/syncDataUtils.ts b/packages/nc-gui/utils/syncDataUtils.ts
index 68b723b820..711faf3d76 100644
--- a/packages/nc-gui/utils/syncDataUtils.ts
+++ b/packages/nc-gui/utils/syncDataUtils.ts
@@ -17,6 +17,7 @@ export interface IntegrationCategoryItemType {
icon: FunctionalComponent
iconBgColor?: string
iconStyle?: CSSProperties
+ isAvailable?: boolean
}
export const integrationCategories: IntegrationCategoryItemType[] = [
@@ -29,6 +30,7 @@ export const integrationCategories: IntegrationCategoryItemType[] = [
iconStyle: {
color: '#17803D',
},
+ isAvailable: true
},
{
title: 'objects.integrationCategories.communication',
@@ -252,7 +254,7 @@ export const allIntegrations: IntegrationItemType[] = [
{
title: 'objects.syncData.whatsapp',
value: SyncDataType.WHATSAPP,
- icon: iconMap.whatsapp,
+ icon: iconMap.whatsappSolid,
categories: [IntegrationCategoryType.COMMUNICATION],
iconStyle: {
width: '32px',