feat: buried point for download (#12423)

website/src/api/index.tsx

@@ -5,4 +5,21 @@ export function getAnswers(question: string) {
   return axios.post(`${askBendUrl}/query`, {
     query: question
   });
+}
+
+interface ICountParames {
+  name: string;
+  osType: string;
+  osTypeDesc: string;
+  id: number;
+  downloadUrl: string;
+  isApple: boolean;
+  version: string;
+  size: number
+  createdAt: string;
+  isUbuntu: boolean;
+}
+export function countDownloads(data: ICountParames) {
+  console.log(data, 'data')
+  return axios.post(`${askBendUrl}/query`, data);
 }

website/src/components/BaseComponents/Card/index.tsx

@@ -8,8 +8,9 @@ interface IProps extends ICommonProps{
   href?: string;
   isDownload?: boolean;
   padding?: number[]; 
+  onClick?: ()=> void;
 }
-const Card: FC<IProps> = ({children, padding, className, href, isDownload, style}): ReactElement=> {
+const Card: FC<IProps> = ({children, padding, className, href, isDownload, style, onClick}): ReactElement=> {
   const props = {
     style:{padding: `${padding[0]}px ${padding[1]}px`, ...style},
     className: clsx(styles.wrap, className)
@@ -18,8 +19,8 @@ const Card: FC<IProps> = ({children, padding, className, href, isDownload, style
     <>
       {
         href
-        ? <a download={isDownload} href={href} {...props}>{children}</a>
-        : <div {...props}>{children}</div>
+        ? <a onClick={onClick} download={isDownload} href={href} {...props}>{children}</a>
+        : <div onClick={onClick} {...props}>{children}</div>
       }
     </>
   );

website/src/pages/download/index.tsx

@@ -11,6 +11,7 @@ import Card from '@site/src/components/BaseComponents/Card';
 import Tag from '@site/src/components/BaseComponents/Tag';
 import { Apple, Linux } from '@site/src/components/Icons';
 import Ubuntu from '@site/src/components/Icons/Ubuntu';
+import { IAssets } from '@site/src/types/download';
 
 const Releases: FC = (): ReactElement => {
   const { 
@@ -35,6 +36,18 @@ const Releases: FC = (): ReactElement => {
       </>
     )
   }
+  const buriedPointForDownload = (asset: IAssets)=> {
+    const { name, osType, osTypeDesc, id, browser_download_url, created_at, size, isApple, isUbuntu, tag_name   } = asset;
+    // @ts-ignore
+    if (window?.gtag) {
+      // @ts-ignore
+      window.gtag('event', 'click', {
+        'event_category': 'DownloadPackages',
+        'event_label': tag_name + "_" + osTypeDesc,
+        'package_download_info': JSON.stringify({ name, osType, osTypeDesc, id, browser_download_url, created_at, size, isApple, isUbuntu, tag_name})
+      });
+    }
+  }
   return (
     <Layout
       title={`Databend - Activate your Object Storage for real-time analytics`}
@@ -55,6 +68,7 @@ const Releases: FC = (): ReactElement => {
                   const { isApple, browser_download_url, osTypeDesc, formatSize, isUbuntu } = asset;
                   return (
                     <Card 
+                      onClick={()=> buriedPointForDownload(asset)}
                       href={browser_download_url}
                       isDownload 
                       key={index} 
@@ -99,6 +113,7 @@ const Releases: FC = (): ReactElement => {
                           const { isApple, browser_download_url, osType, isUbuntu} =  asset;
                           return (
                             <Card  
+                              onClick={()=> buriedPointForDownload(asset)}
                               key={ind}
                               href={browser_download_url}
                               className={clsx(styles.button, !isApple && styles.buttonLinux, isUbuntu && styles.buttonLinuxUbuntu)} 

website/src/plugins/fetch-databend-releases.js

@@ -49,7 +49,8 @@ module.exports = function fetchDatabendReleasesPlugin() {
                 ...asset,
                 isApple,
                 isUbuntu,
-                osTypeDesc
+                osTypeDesc,
+                tag_name: release?.tag_name,
               }
             })
             .sort((systemLinux, systemMac) => systemMac.isUbuntu - systemLinux.isUbuntu)
@@ -67,6 +68,7 @@ module.exports = function fetchDatabendReleasesPlugin() {
             });
         return {
           ...release,
+          tag_name: release?.tag_name,
           originAssets: release.assets,
           assets: afterProcessedAssets,
           filterBody: release.body

website/src/types/download.ts

@@ -1,4 +1,5 @@
 export interface IAssets {
+  id?: number;
   size: number;
   formatSize?: string;
   browser_download_url: string;
@@ -7,6 +8,8 @@ export interface IAssets {
   osType: string;
   isApple?: boolean;
   isUbuntu?: boolean;
+  created_at?: string;
+  tag_name?: string;
 }
 
 export interface IRepoResource {