feat: bump SDK to v0.1.21 and add plg_started

manifest.json

@@ -1,5 +1,5 @@
 {
-  "requiredSdkVersion": "~0.0.66",
+  "requiredSdkVersion": "~0.1.14",
   "name": "TourPlugin",
-  "javascriptEntrypointUrl": "https://PLUGIN_HOST/TourPlugin.js"
+  "javascriptEntrypointUrl": "TourPlugin.js"
 }

package.json

@@ -10,7 +10,7 @@
     "@types/react": "^18.2.13",
     "@types/react-dom": "^18.2.6",
     "babel-plugin-syntax-dynamic-import": "^6.18.0",
-    "bigbluebutton-html-plugin-sdk": "0.0.66",
+    "bigbluebutton-html-plugin-sdk": "0.1.21",
     "browser-bunyan": "^1.8.0",
     "path": "^0.12.7",
     "react": "^18.2.0",
@@ -22,7 +22,7 @@
     "build-bundle": "webpack --mode production",
     "start": "webpack serve --mode development",
     "build:watch": "rm -rf dist && tsc -w --module CommonJS",
-    "lint": "eslint ./src/*",
+    "lint": "eslint ./src",
     "lint:fix": "npm run lint -- --fix",
     "lint:watch": "watch 'yarn lint'"
   },
@@ -42,20 +42,16 @@
     "@babel/core": "^7.21.8",
     "@babel/preset-env": "^7.21.5",
     "@babel/preset-react": "^7.18.6",
-    "@types/react-modal": "^3.16.0",
-    "babel-loader": "^9.1.2",
-    "css-loader": "^6.7.4",
-    "style-loader": "^3.3.3",
-    "ts-loader": "^9.4.3",
-    "webpack": "^5.83.1",
-    "webpack-cli": "^5.1.1",
-    "webpack-dev-server": "^4.15.1",
     "@types/node": "^20.4.4",
     "@types/react": "^18.2.15",
     "@types/react-dom": "^18.2.7",
+    "@types/react-modal": "^3.16.0",
     "@types/styled-components": "^5.1.26",
     "@typescript-eslint/eslint-plugin": "^6.2.0",
     "@typescript-eslint/parser": "^6.2.0",
+    "babel-loader": "^9.1.2",
+    "copy-webpack-plugin": "^12.0.2",
+    "css-loader": "^6.7.4",
     "eslint": "^8.45.0",
     "eslint-config-airbnb": "^19.0.4",
     "eslint-config-airbnb-base": "^15.0.0",
@@ -66,7 +62,12 @@
     "eslint-watch": "^8.0.0",
     "lint-staged": "11.2.0",
     "react-dom": "^18.2.0",
+    "style-loader": "^3.3.3",
+    "ts-loader": "^9.4.3",
     "typescript": "^5.1.6",
-    "watch": "^1.0.2"
+    "watch": "^1.0.2",
+    "webpack": "^5.83.1",
+    "webpack-cli": "^5.1.1",
+    "webpack-dev-server": "^4.15.1"
   }
 }

src/index.tsx

@@ -9,10 +9,10 @@ const pluginName = document.currentScript?.getAttribute('pluginName') || 'plugin
 const root = ReactDOM.createRoot(document.getElementById(uuid));
 root.render(
   <React.StrictMode>
-      <TourPlugin {...{
-        pluginUuid: uuid,
-        pluginName,
-      }}
-      />
+    <TourPlugin {...{
+      pluginUuid: uuid,
+      pluginName,
+    }}
+    />
   </React.StrictMode>,
 );

src/tour/component.tsx

@@ -7,7 +7,7 @@
 import {
   BbbPluginSdk, OptionsDropdownOption, PluginApi,
   pluginLogger, IntlLocaleUiDataNames,
-  LayoutPresentatioAreaUiDataNames, UiLayouts,
+  LayoutPresentationAreaUiDataNames, UiLayouts,
 } from 'bigbluebutton-html-plugin-sdk';
 import { TourPluginProps, Settings, ClientSettingsSubscriptionResultType } from './types';
 import getTourFeatures from './getTourFeatures';
@@ -57,14 +57,13 @@
     presentationInitiallyOpened,
   ).forEach((feature) => {
     feature.steps.forEach((step) => {
-      /* @ts-ignore */
       tour.addStep({
         ...step,
         // Only show step if the element is visible
         showOn: () => !!document.querySelector(
           step.attachTo.element,
         ),
-      });
+      } as Parameters<typeof tour.addStep>[0]);
     });
   });
 
@@ -84,10 +83,14 @@
     fallbackLocale: 'en',
   });
 
-  const layoutInformation = pluginApi.useUiData(LayoutPresentatioAreaUiDataNames.CURRENT_ELEMENT, [{
-    isOpen: presentationInitiallyOpened,
-    currentElement: UiLayouts.WHITEBOARD,
-  }]);
+  const layoutInformation = pluginApi.useUiData(
+    LayoutPresentationAreaUiDataNames.CURRENT_ELEMENT,
+    [{
+      isOpen: presentationInitiallyOpened,
+      currentElement: UiLayouts.WHITEBOARD,
+    },
+    ],
+  );
 
   // TODO revisit when fixed
   // const settings = pluginApi.usePluginSettings()?.data;
@@ -133,7 +136,7 @@
         }
       }
       // removes events
       endTourEvents.forEach((event) => Shepherd.off(event, undefined));
     }));
     return () => {
       // removes events
@@ -148,7 +151,9 @@
         icon: 'presentation',
         onClick: async () => {
           setPresentationInitiallyOpened(layoutInformation[0]?.isOpen);
-          pluginLogger.info('Starting Tour');
+          pluginLogger.info({
+            logCode: 'plg_started',
+          }, `Plugin started: ${pluginApi.pluginName}`);
           // ensure only userList is open (to also work on Mobile)
           pluginApi.uiCommands.sidekickOptionsContainer.close();
           pluginApi.uiCommands.sidekickOptionsContainer.open();

tsconfig.json

@@ -8,6 +8,7 @@
         "allowJs": true,
         "moduleResolution": "node",
         "allowSyntheticDefaultImports": true,
+        "skipLibCheck": true,
     },
     "paths": {
         "*": ["node_modules/@types/*", "node_modules/*"]