application insight fixes

src/commands/Article.ts

@@ -1,5 +1,5 @@
 import { isValidFile } from './../helpers/isValidFile';
-import { SETTING_AUTO_UPDATE_DATE, SETTING_MODIFIED_FIELD, SETTING_SLUG_UPDATE_FILE_NAME, SETTING_TEMPLATES_PREFIX, CONFIG_KEY, SETTING_DATE_FORMAT, SETTING_SLUG_PREFIX, SETTING_SLUG_SUFFIX, SETTINGS_CONTENT_PLACEHOLDERS } from './../constants';
+import { SETTING_AUTO_UPDATE_DATE, SETTING_MODIFIED_FIELD, SETTING_SLUG_UPDATE_FILE_NAME, SETTING_TEMPLATES_PREFIX, CONFIG_KEY, SETTING_DATE_FORMAT, SETTING_SLUG_PREFIX, SETTING_SLUG_SUFFIX, SETTINGS_CONTENT_PLACEHOLDERS, TelemetryEvent } from './../constants';
 import * as vscode from 'vscode';
 import { Field, TaxonomyType } from "../models";
 import { format } from "date-fns";
@@ -12,7 +12,7 @@ import { DashboardData } from '../models/DashboardData';
 import { ExplorerView } from '../explorerView/ExplorerView';
 import { DateHelper } from '../helpers/DateHelper';
 import { parseWinPath } from '../helpers/parseWinPath';
-import { Telemetry, TelemetryEvent } from '../helpers/Telemetry';
+import { Telemetry } from '../helpers/Telemetry';
 
 
 export class Article {

src/commands/Dashboard.ts

@@ -10,8 +10,7 @@ import { WebviewHelper } from '@estruyf/vscode';
 import { DashboardData } from '../models/DashboardData';
 import { ExplorerView } from '../explorerView/ExplorerView';
 import { MediaLibrary } from '../helpers/MediaLibrary';
-import { DashboardListener, MediaListener, SettingsListener } from '../listeners';
-import { DataListener } from '../listeners/DataListener';
+import { DashboardListener, MediaListener, SettingsListener, TelemetryListener, DataListener } from '../listeners';
 
 export class Dashboard {
   private static webview: WebviewPanel | null = null;
@@ -146,6 +145,7 @@ export class Dashboard {
       PagesListener.process(msg);
       SettingsListener.process(msg);
       DataListener.process(msg);
+      TelemetryListener.process(msg);
     });
   }
 

src/commands/Folders.ts

@@ -1,5 +1,5 @@
 import { Questions } from './../helpers/Questions';
-import { SETTINGS_CONTENT_PAGE_FOLDERS, SETTINGS_CONTENT_STATIC_FOLDER, SETTINGS_CONTENT_SUPPORTED_FILETYPES } from './../constants';
+import { SETTINGS_CONTENT_PAGE_FOLDERS, SETTINGS_CONTENT_STATIC_FOLDER, SETTINGS_CONTENT_SUPPORTED_FILETYPES, TelemetryEvent } from './../constants';
 import { commands, Uri, workspace, window } from "vscode";
 import { basename, join } from "path";
 import { ContentFolder, FileInfo, FolderInfo } from "../models";
@@ -14,7 +14,7 @@ import { parseWinPath } from '../helpers/parseWinPath';
 import { MediaHelpers } from '../helpers/MediaHelpers';
 import { MediaListener, PagesListener } from '../listeners';
 import { DEFAULT_FILE_TYPES } from '../constants/DefaultFileTypes';
-import { Telemetry, TelemetryEvent } from '../helpers/Telemetry';
+import { Telemetry } from '../helpers/Telemetry';
 
 export const WORKSPACE_PLACEHOLDER = `[[workspace]]`;
 

src/commands/Preview.ts

@@ -1,5 +1,5 @@
-import { Telemetry, TelemetryEvent } from './../helpers/Telemetry';
-import { SETTING_PREVIEW_HOST, SETTING_PREVIEW_PATHNAME, CONTEXT } from './../constants';
+import { Telemetry } from './../helpers/Telemetry';
+import { SETTING_PREVIEW_HOST, SETTING_PREVIEW_PATHNAME, CONTEXT, TelemetryEvent } from './../constants';
 import { ArticleHelper } from './../helpers/ArticleHelper';
 import { join } from "path";
 import { commands, env, Uri, ViewColumn, window } from "vscode";

src/commands/Project.ts

@@ -1,4 +1,4 @@
-import { Telemetry, TelemetryEvent } from './../helpers/Telemetry';
+import { Telemetry } from './../helpers/Telemetry';
 import { workspace, Uri } from "vscode";
 import { join } from "path";
 import * as fs from "fs";
@@ -6,7 +6,7 @@ import { Notifications } from "../helpers/Notifications";
 import { Template } from "./Template";
 import { Folders } from "./Folders";
 import { Settings } from "../helpers";
-import { SETTINGS_CONTENT_DEFAULT_FILETYPE } from "../constants";
+import { SETTINGS_CONTENT_DEFAULT_FILETYPE, TelemetryEvent } from "../constants";
 
 export class Project {
 

src/commands/Template.ts

@@ -2,7 +2,7 @@ import { Questions } from './../helpers/Questions';
 import * as vscode from 'vscode';
 import * as path from 'path';
 import * as fs from 'fs';
-import { SETTINGS_CONTENT_DEFAULT_FILETYPE, SETTING_TEMPLATES_FOLDER, SETTING_TEMPLATES_PREFIX } from '../constants';
+import { SETTINGS_CONTENT_DEFAULT_FILETYPE, SETTING_TEMPLATES_FOLDER, TelemetryEvent } from '../constants';
 import { ArticleHelper, Settings } from '../helpers';
 import { Article } from '.';
 import { Notifications } from '../helpers/Notifications';
@@ -13,7 +13,7 @@ import { ContentType } from '../helpers/ContentType';
 import { ContentType as IContentType } from '../models';
 import { PagesListener } from '../listeners';
 import { extname } from 'path';
-import { Telemetry, TelemetryEvent } from '../helpers/Telemetry';
+import { Telemetry } from '../helpers/Telemetry';
 
 export class Template {
 

src/constants/TelemetryEvent.ts

@@ -0,0 +1,28 @@
+export const TelemetryEvent = {
+  activate: 'activate',
+  initialization: 'initialization',
+  openContentDashboard: 'openContentDashboard',
+  openMediaDashboard: 'openMediaDashboard',
+  openDataDashboard: 'openDataDashboard',
+  closeDashboard: 'closeDashboard',
+  generateSlug: 'generateSlug',
+  createContentFromTemplate: 'createContentFromTemplate',
+  createContentFromContentType: 'createContentFromContentType',
+  registerFolder: 'registerFolder',
+  unregisterFolder: 'unregisterFolder',
+  addMediaFolder: 'addMediaFolder',
+  promoteSettings: 'promoteSettings',
+  openPreview: 'openPreview',
+  uploadMedia: 'uploadMedia',
+  refreshMedia: 'refreshMedia',
+  deleteMedia: 'deleteMedia',
+  insertMediaToContent: 'insertMediaToContent',
+  updateMediaMetadata: 'updateMediaMetadata',
+  openExplorerView: 'openExplorerView',
+
+  // Webviews
+  webviewWelcomeScreen: 'webviewWelcomeScreen',
+  webviewMediaView: 'webviewMediaView',
+  webviewDataView: 'webviewDataView',
+  webviewContentsView: 'webviewContentsView',
+};

src/constants/index.ts

@@ -1,10 +1,13 @@
 export * from './ContentType';
 export * from './DefaultFields';
+export * from './DefaultFileTypes';
 export * from './Extension';
 export * from './ExtensionState';
+export * from './FrameworkDetectors';
 export * from './Links';
 export * from './LocalStore';
 export * from './Navigation';
+export * from './TelemetryEvent';
 export * from './charMap';
 export * from './context';
 export * from './settings';

src/dashboardWebView/DashboardMessage.ts

@@ -24,4 +24,5 @@ export enum DashboardMessage {
   runCustomScript = 'runCustomScript',
   getDataEntries = 'getDataEntries',
   putDataEntries = 'putDataEntries',
+  sendTelemetry = 'sendTelemetry',
 }

src/dashboardWebView/components/Contents/Contents.tsx

@@ -7,6 +7,10 @@ import { Overview } from './Overview';
 import { Spinner } from '../Spinner';
 import { SponsorMsg } from '../SponsorMsg';
 import usePages from '../../hooks/usePages';
+import { useEffect } from 'react';
+import { Messenger } from '@estruyf/vscode/dist/client';
+import { DashboardMessage } from '../../DashboardMessage';
+import { TelemetryEvent } from '../../../constants';
 
 export interface IContentsProps {
   pages: Page[];
@@ -19,6 +23,12 @@ export const Contents: React.FunctionComponent<IContentsProps> = ({pages, loadin
 
   const pageFolders = [...new Set(pageItems.map(page => page.fmFolder))];
 
+  useEffect(() => {
+    Messenger.send(DashboardMessage.sendTelemetry, {
+      event: TelemetryEvent.webviewContentsView
+    });
+  }, []);
+
   return (
     <div className="flex flex-col h-full overflow-auto">
       <Header 

src/dashboardWebView/components/DataView/DataView.tsx

@@ -19,6 +19,7 @@ import { ChevronRightIcon } from '@heroicons/react/outline';
 import { ToastContainer, toast, Slide } from 'react-toastify';
 import 'react-toastify/dist/ReactToastify.css';
 import { DataType } from '../../../models/DataType';
+import { TelemetryEvent } from '../../../constants';
 
 export interface IDataViewProps {}
 
@@ -102,6 +103,10 @@ export const DataView: React.FunctionComponent<IDataViewProps> = (props: React.P
 
   useEffect(() => {
     Messenger.listen(messageListener);
+    
+    Messenger.send(DashboardMessage.sendTelemetry, {
+      event: TelemetryEvent.webviewDataView
+    });
 
     return () => {
       Messenger.unlisten(messageListener);

src/dashboardWebView/components/Media/Media.tsx

@@ -13,11 +13,12 @@ import { Item } from './Item';
 import { Lightbox } from './Lightbox';
 import { List } from './List';
 import { useDropzone } from 'react-dropzone'
-import { useCallback } from 'react';
+import { useCallback, useEffect } from 'react';
 import { DashboardMessage } from '../../DashboardMessage';
 import { FrontMatterIcon } from '../../../panelWebView/components/Icons/FrontMatterIcon';
 import { FolderItem } from './FolderItem';
 import useMedia from '../../hooks/useMedia';
+import { TelemetryEvent } from '../../../constants';
 
 export interface IMediaProps {}
 
@@ -46,6 +47,12 @@ export const Media: React.FunctionComponent<IMediaProps> = (props: React.PropsWi
     });
   }, [selectedFolder]);
 
+  useEffect(() => {
+    Messenger.send(DashboardMessage.sendTelemetry, {
+      event: TelemetryEvent.webviewMediaView
+    });
+  }, []);
+
   const {getRootProps, isDragActive} = useDropzone({
     onDrop,
     accept: 'image/*'

src/dashboardWebView/components/WelcomeScreen.tsx

@@ -1,6 +1,6 @@
 import {HeartIcon, StarIcon} from '@heroicons/react/outline';
 import * as React from 'react';
-import { GITHUB_LINK, REVIEW_LINK, SPONSOR_LINK } from '../../constants';
+import { GITHUB_LINK, REVIEW_LINK, SPONSOR_LINK, TelemetryEvent } from '../../constants';
 import { Messenger } from '@estruyf/vscode/dist/client';
 import { FrontMatterIcon } from '../../panelWebView/components/Icons/FrontMatterIcon';
 import { GitHubIcon } from '../../panelWebView/components/Icons/GitHubIcon';
@@ -15,10 +15,15 @@ export interface IWelcomeScreenProps {
 export const WelcomeScreen: React.FunctionComponent<IWelcomeScreenProps> = ({settings}: React.PropsWithChildren<IWelcomeScreenProps>) => {
 
   React.useEffect(() => {
+
+    Messenger.send(DashboardMessage.sendTelemetry, {
+      event: TelemetryEvent.webviewWelcomeScreen
+    });
+
     return () => {
       Messenger.send(DashboardMessage.reload)
     };
-  }, ['']);
+  }, []);
   
   return (
     <div className={`h-full overflow-auto py-24`}>

src/explorerView/ExplorerView.ts

@@ -1,6 +1,6 @@
 import { DashboardData } from '../models/DashboardData';
 import { Template } from '../commands/Template';
-import { DefaultFields, SETTINGS_CONTENT_FRONTMATTER_HIGHLIGHT, SETTING_AUTO_UPDATE_DATE, SETTING_CUSTOM_SCRIPTS, SETTING_SEO_CONTENT_MIN_LENGTH, SETTING_SEO_DESCRIPTION_FIELD, SETTING_SLUG_UPDATE_FILE_NAME, SETTING_PREVIEW_HOST, SETTING_DATE_FORMAT, SETTING_COMMA_SEPARATED_FIELDS, SETTING_TAXONOMY_CONTENT_TYPES, SETTING_PANEL_FREEFORM, SETTING_SEO_DESCRIPTION_LENGTH, SETTING_SEO_TITLE_LENGTH, SETTING_SLUG_PREFIX, SETTING_SLUG_SUFFIX, SETTING_TAXONOMY_CATEGORIES, SETTING_TAXONOMY_TAGS, SETTINGS_CONTENT_DRAFT_FIELD, SETTING_SEO_SLUG_LENGTH, SETTING_SITE_BASEURL, SETTING_TAXONOMY_CUSTOM, CONTEXT, SETTINGS_FRAMEWORK_ID, SETTINGS_FRAMEWORK_START } from '../constants';
+import { DefaultFields, SETTINGS_CONTENT_FRONTMATTER_HIGHLIGHT, SETTING_AUTO_UPDATE_DATE, SETTING_CUSTOM_SCRIPTS, SETTING_SEO_CONTENT_MIN_LENGTH, SETTING_SEO_DESCRIPTION_FIELD, SETTING_SLUG_UPDATE_FILE_NAME, SETTING_PREVIEW_HOST, SETTING_DATE_FORMAT, SETTING_COMMA_SEPARATED_FIELDS, SETTING_TAXONOMY_CONTENT_TYPES, SETTING_PANEL_FREEFORM, SETTING_SEO_DESCRIPTION_LENGTH, SETTING_SEO_TITLE_LENGTH, SETTING_SLUG_PREFIX, SETTING_SLUG_SUFFIX, SETTING_TAXONOMY_CATEGORIES, SETTING_TAXONOMY_TAGS, SETTINGS_CONTENT_DRAFT_FIELD, SETTING_SEO_SLUG_LENGTH, SETTING_SITE_BASEURL, SETTING_TAXONOMY_CUSTOM, CONTEXT, SETTINGS_FRAMEWORK_ID, SETTINGS_FRAMEWORK_START, TelemetryEvent } from '../constants';
 import * as os from 'os';
 import { PanelSettings, CustomScript as ICustomScript } from '../models/PanelSettings';
 import { CancellationToken, Disposable, Uri, Webview, WebviewView, WebviewViewProvider, WebviewViewResolveContext, window, workspace, commands, env as vscodeEnv, ThemeIcon } from "vscode";
@@ -23,7 +23,7 @@ import { Dashboard } from '../commands/Dashboard';
 import { ImageHelper } from '../helpers/ImageHelper';
 import { CustomScript } from '../helpers/CustomScript';
 import { Link, Parent } from 'mdast-util-from-markdown/lib';
-import { Telemetry, TelemetryEvent } from '../helpers/Telemetry';
+import { Telemetry } from '../helpers/Telemetry';
 
 const FILE_LIMIT = 10;
 

src/extension.ts

@@ -1,4 +1,4 @@
-import { Telemetry, TelemetryEvent } from './helpers/Telemetry';
+import { Telemetry } from './helpers/Telemetry';
 import { ContentType } from './helpers/ContentType';
 import { Dashboard } from './commands/Dashboard';
 import * as vscode from 'vscode';
@@ -7,7 +7,7 @@ import { Folders } from './commands/Folders';
 import { Preview } from './commands/Preview';
 import { Project } from './commands/Project';
 import { Template } from './commands/Template';
-import { COMMAND_NAME } from './constants';
+import { COMMAND_NAME, TelemetryEvent } from './constants';
 import { TaxonomyType } from './models';
 import { MarkdownFoldingProvider } from './providers/MarkdownFoldingProvider';
 import { TagType } from './panelWebView/TagType';

src/helpers/ContentType.ts

@@ -1,14 +1,14 @@
 import { PagesListener } from './../listeners/PagesListener';
 import { ArticleHelper, Settings } from ".";
-import { SETTINGS_CONTENT_DRAFT_FIELD, SETTING_TAXONOMY_CONTENT_TYPES } from "../constants";
+import { SETTINGS_CONTENT_DRAFT_FIELD, SETTING_TAXONOMY_CONTENT_TYPES, TelemetryEvent } from "../constants";
 import { ContentType as IContentType, DraftField, Field } from '../models';
-import { Uri, workspace, window, commands } from 'vscode'; 
+import { Uri, commands } from 'vscode'; 
 import { Folders } from "../commands/Folders";
 import { Questions } from "./Questions";
 import { writeFileSync } from "fs";
 import { Notifications } from "./Notifications";
 import { DEFAULT_CONTENT_TYPE_NAME } from "../constants/ContentType";
-import { Telemetry, TelemetryEvent } from './Telemetry';
+import { Telemetry } from './Telemetry';
 
 
 export class ContentType {

src/helpers/SettingsHelper.ts

@@ -1,9 +1,9 @@
-import { Telemetry, TelemetryEvent } from './Telemetry';
+import { Telemetry } from './Telemetry';
 import { Notifications } from './Notifications';
 import { commands, Uri, workspace, window } from 'vscode';
 import * as vscode from 'vscode';
 import { ContentType, CustomTaxonomy, TaxonomyType } from '../models';
-import { SETTING_TAXONOMY_TAGS, SETTING_TAXONOMY_CATEGORIES, CONFIG_KEY, CONTEXT, ExtensionState, SETTING_TAXONOMY_CUSTOM } from '../constants';
+import { SETTING_TAXONOMY_TAGS, SETTING_TAXONOMY_CATEGORIES, CONFIG_KEY, CONTEXT, ExtensionState, SETTING_TAXONOMY_CUSTOM, TelemetryEvent } from '../constants';
 import { Folders } from '../commands/Folders';
 import { join, basename } from 'path';
 import { existsSync, readFileSync, watch, writeFileSync } from 'fs';

src/helpers/Telemetry.ts

@@ -2,29 +2,6 @@ import TelemetryReporter, { TelemetryEventMeasurements, TelemetryEventProperties
 import { Extension } from '.';
 import { EXTENSION_BETA_ID, EXTENSION_ID } from '../constants';
 
-export const TelemetryEvent = {
-  activate: 'activate',
-  initialization: 'initialization',
-  openContentDashboard: 'openContentDashboard',
-  openMediaDashboard: 'openMediaDashboard',
-  openDataDashboard: 'openDataDashboard',
-  closeDashboard: 'closeDashboard',
-  generateSlug: 'generateSlug',
-  createContentFromTemplate: 'createContentFromTemplate',
-  createContentFromContentType: 'createContentFromContentType',
-  registerFolder: 'registerFolder',
-  unregisterFolder: 'unregisterFolder',
-  addMediaFolder: 'addMediaFolder',
-  promoteSettings: 'promoteSettings',
-  openPreview: 'openPreview',
-  uploadMedia: 'uploadMedia',
-  refreshMedia: 'refreshMedia',
-  deleteMedia: 'deleteMedia',
-  insertMediaToContent: 'insertMediaToContent',
-  updateMediaMetadata: 'updateMediaMetadata',
-  openExplorerView: 'openExplorerView',
-};
-
 export class Telemetry {
   private static instance: Telemetry;
   private static reporter: TelemetryReporter | null = null;

src/listeners/MediaListener.ts

@@ -1,11 +1,11 @@
-import { Telemetry, TelemetryEvent } from './../helpers/Telemetry';
+import { Telemetry } from './../helpers/Telemetry';
 import { MediaHelpers } from './../helpers/MediaHelpers';
 import { DashboardMessage } from "../dashboardWebView/DashboardMessage";
 import { BaseListener } from "./BaseListener";
 import { DashboardCommand } from '../dashboardWebView/DashboardCommand';
 import { SortingOption } from '../dashboardWebView/models';
 import { commands, env, Uri } from 'vscode';
-import { COMMAND_NAME } from '../constants';
+import { COMMAND_NAME, TelemetryEvent } from '../constants';
 import * as os from 'os';
 
 

src/listeners/TelemetryListener.ts

@@ -0,0 +1,21 @@
+import { DashboardMessage } from "../dashboardWebView/DashboardMessage";
+import { Telemetry } from "../helpers/Telemetry";
+import { BaseListener } from "./BaseListener";
+
+
+export class TelemetryListener extends BaseListener {
+
+  /**
+   * Process the messages for the dashboard views
+   * @param msg 
+   */
+  public static process(msg: { command: DashboardMessage, data: any }) {
+    super.process(msg);
+
+    switch(msg.command) {
+      case DashboardMessage.sendTelemetry:
+        Telemetry.send(msg.data.event, msg.data.properties, msg.data.metrics);
+        break;
+    }
+  }
+}

src/listeners/index.ts

@@ -1,5 +1,8 @@
+export * from './BaseListener';
 export * from './DashboardListener';
+export * from './DataListener';
 export * from './ExtensionListener';
 export * from './MediaListener';
 export * from './PagesListener';
 export * from './SettingsListener';
+export * from './TelemetryListener';

webpack/extension.config.js

@@ -18,7 +18,8 @@ const config = [
     },
     devtool: 'nosources-source-map',
     externals: {
-      vscode: 'commonjs vscode'
+      vscode: 'commonjs vscode',
+      'applicationinsights-native-metrics': 'commonjs applicationinsights-native-metrics'
     },
     resolve: {
       extensions: ['.ts', '.js']