Feat: Add Asana data source integration and configuration options (#12239)

### What problem does this PR solve?

change: Add Asana data source integration and configuration options

### Type of change

- [x] New Feature (non-breaking change which adds functionality)

---------

Co-authored-by: Kevin Hu <kevinhu.sh@gmail.com>

web/src/assets/svg/data-source/asana.svg

@@ -0,0 +1,5 @@
+<svg fill="none" xmlns="http://www.w3.org/2000/svg" viewBox="8 16 20 17">
+    <path fill-rule="evenodd" clip-rule="evenodd"
+        d="M23.3789 24.9999C21.1719 24.9999 19.3826 26.7908 19.3826 29.0001C19.3826 31.2091 21.1719 33 23.3789 33C25.586 33 27.3752 31.2091 27.3752 29.0001C27.3752 26.7908 25.586 24.9999 23.3789 24.9999ZM12.9963 25.0003C10.7892 25.0003 9 26.7908 9 29C9 31.2091 10.7892 33 12.9963 33C15.2034 33 16.9927 31.2091 16.9927 29C16.9927 26.7908 15.2034 25.0003 12.9963 25.0003ZM22.1838 19.9999C22.1838 22.2091 20.3947 24.0002 18.1876 24.0002C15.9805 24.0002 14.1913 22.2091 14.1913 19.9999C14.1913 17.791 15.9805 16 18.1876 16C20.3947 16 22.1838 17.791 22.1838 19.9999Z"
+        fill="#FF584A"></path>
+</svg>

web/src/locales/en.ts

@@ -933,6 +933,8 @@ Example: Virtual Hosted Style`,
       boxDescription: 'Connect your Box drive to sync files and folders.',
       airtableDescription:
         'Connect to Airtable and synchronize files from a specified table within a designated workspace.',
+      asanaDescription:
+        'Connect to Asana and synchronize files from a specified workspace.',
       dropboxAccessTokenTip:
         'Generate a long-lived access token in the Dropbox App Console with files.metadata.read, files.content.read, and sharing.read scopes.',
       moodleDescription:

web/src/locales/ru.ts

@@ -749,6 +749,8 @@ export default {
         'Подключите ваш диск Box для синхронизации файлов и папок.',
       airtableDescription:
         'Подключите Airtable и синхронизируйте файлы из указанной таблицы в заданном рабочем пространстве.',
+      asanaDescription:
+        'Подключите Asana и синхронизируйте файлы из рабочего пространства.',
       google_driveDescription:
         'Подключите ваш Google Drive через OAuth и синхронизируйте определенные папки или диски.',
       gmailDescription:

web/src/locales/zh.ts

@@ -862,6 +862,7 @@ General：实体和关系提取提示来自 GitHub - microsoft/graphrag：基于
       dropboxDescription: '连接 Dropbox，同步指定账号下的文件与文件夹。',
       boxDescription: '连接你的 Box 云盘以同步文件和文件夹。',
       airtableDescription: '连接 Airtable，同步指定工作区下指定表格中的文件。',
+      asanaDescription: '连接 Asana，同步工作区中的文件。',
       r2Description: '连接你的 Cloudflare R2 存储桶以导入和同步文件。',
       dropboxAccessTokenTip:
         '请在 Dropbox App Console 生成 Access Token，并勾选 files.metadata.read、files.content.read、sharing.read 等必要权限。',

web/src/pages/user-setting/data-source/constant/index.tsx

@@ -25,6 +25,7 @@ export enum DataSourceKey {
   OCI_STORAGE = 'oci_storage',
   GOOGLE_CLOUD_STORAGE = 'google_cloud_storage',
   AIRTABLE = 'airtable',
+  ASANA = 'asana',
   //   SHAREPOINT = 'sharepoint',
   //   SLACK = 'slack',
   //   TEAMS = 'teams',
@@ -109,6 +110,11 @@ export const generateDataSourceInfo = (t: TFunction) => {
       description: t(`setting.${DataSourceKey.AIRTABLE}Description`),
       icon: <SvgIcon name={'data-source/airtable'} width={38} />,
     },
+    [DataSourceKey.ASANA]: {
+      name: 'Asana',
+      description: t(`setting.${DataSourceKey.ASANA}Description`),
+      icon: <SvgIcon name={'data-source/asana'} width={38} />,
+    },
   };
 };
 
@@ -652,6 +658,32 @@ export const DataSourceFormFields = {
       required: true,
     },
   ],
+  [DataSourceKey.ASANA]: [
+    {
+      label: 'API Token',
+      name: 'config.credentials.asana_api_token_secret',
+      type: FormFieldType.Text,
+      required: true,
+    },
+    {
+      label: 'Workspace ID',
+      name: 'config.asana_workspace_id',
+      type: FormFieldType.Text,
+      required: true,
+    },
+    {
+      label: 'Project IDs',
+      name: 'config.asana_project_ids',
+      type: FormFieldType.Text,
+      required: false,
+    },
+    {
+      label: 'Team ID',
+      name: 'config.asana_team_id',
+      type: FormFieldType.Text,
+      required: false,
+    },
+  ],
 };
 
 export const DataSourceFormDefaultValues = {
@@ -851,4 +883,17 @@ export const DataSourceFormDefaultValues = {
       },
     },
   },
+  [DataSourceKey.ASANA]: {
+    name: '',
+    source: DataSourceKey.ASANA,
+    config: {
+      name: '',
+      asana_workspace_id: '',
+      asana_project_ids: '',
+      asana_team_id: '',
+      credentials: {
+        asana_api_token_secret: '',
+      },
+    },
+  },
 };