Release 7.0.0 (#134)

## What's changed

* fix: switch to storybook config from visyn_scripts
(#127)
* test: add data-testid to proxy view iframe
(#128)
* Add possibility to specify which vis types to show in the sidebar
(#129)
* Use correct workflow branches
(#133)

.github/workflows/publish.yml

@@ -4,5 +4,5 @@ on: workflow_dispatch
 
 jobs:
   publish:
-    uses: datavisyn/github-workflows/.github/workflows/publish-node-python.yml@main
+    uses: datavisyn/github-workflows/.github/workflows/publish-node-python.yml@new_deployment
     secrets: inherit

.github/workflows/release.yml

@@ -4,5 +4,5 @@ on: workflow_dispatch
 
 jobs:
   release:
-    uses: datavisyn/github-workflows/.github/workflows/release-source.yml@main
+    uses: datavisyn/github-workflows/.github/workflows/release-source.yml@new_deployment
     secrets: inherit      

.storybook/main.js

@@ -1,41 +1 @@
-const path = require('path');
-module.exports = {
-  stories: ['../src/**/*.stories.mdx', '../src/**/*.stories.@(js|jsx|ts|tsx)'],
-  addons: [
-    '@storybook/addon-links',
-    '@storybook/addon-essentials',
-    '@storybook/addon-interactions',
-    '@storybook/preset-scss',
-    'storybook-addon-swc',
-    '@storybook/addon-mdx-gfm',
-  ],
-  framework: {
-    name: '@storybook/react-webpack5',
-    options: {},
-  },
-  webpackFinal: async (config) => {
-    // TODO:: Setting minimize here because storybook fails on prod otherwise. Specifically, we get arquero errors along the lines of "Invalid variable reference: "a"".
-    // This same problem does not occur on our prod builds, only for this storybook webpack compiler
-    config.optimization.minimize = false;
-    // This is required to enable TS moduleResolution: node16, as there we have to add .js extensions which are actually .ts files.
-    (config.resolve.extensionAlias = {
-      ...(config.resolve.extensionAlias || {}),
-      '.js': ['.tsx', '.ts', '.js'],
-      '.cjs': ['.cts', '.cjs'],
-      '.mjs': ['.mts', '.mjs'],
-    }),
-      (config.resolve.alias = {
-        ...(config.resolve.alias || {}),
-        // I have no clue why this is required, but if this is missing we get a "Can't resolve '../../assets/icons/datavisyn_logo.svg' in '.../src/scss'""
-        '../../assets': path.resolve(__dirname, '../src/assets'),
-        // Add visyn_core/dist as alias, as we have scss/code imports like visyn_core/dist/assets/...
-        'visyn_core/dist': path.resolve(__dirname, '../src'),
-        'visyn_core/src': path.resolve(__dirname, '../src'),
-        visyn_core: path.resolve(__dirname, '../src'),
-      });
-    return config;
-  },
-  docs: {
-    autodocs: true,
-  },
-};
+module.exports = require('visyn_scripts/config/storybook.main.template')({ name: 'visyn_core', dirname: __dirname });

package.json

@@ -1,7 +1,7 @@
 {
   "name": "visyn_core",
   "description": "Core repository for datavisyn applications.",
-  "version": "6.0.0",
+  "version": "7.0.0",
   "author": {
     "name": "datavisyn GmbH",
     "email": "[email protected]",
@@ -309,7 +309,7 @@
     "react-plotly.js": "^2.5.1",
     "react-spring": "^9.7.1",
     "use-deep-compare-effect": "^1.8.0",
-    "visyn_scripts": "^6.0.0"
+    "visyn_scripts": "^7.0.1"
   },
   "devDependencies": {
     "@babel/core": "^7.17.7",

src/views/visyn/proxy/ProxyViewComponent.tsx

@@ -36,7 +36,7 @@ export function ProxyViewComponent({ site }: IProxyViewProps) {
 
   return (
     <div className={`w-100 h-100 ${websiteLoading ? 'tdp-busy' : ''}`}>
-      <iframe ref={loadingFrame} className="w-100 h-100" src={site} />
+      <iframe ref={loadingFrame} className="w-100 h-100" src={site} data-testid={`proxy-view-iframe`} />
     </div>
   );
 }

src/vis/EagerVis.tsx

@@ -55,7 +55,7 @@ import { IViolinConfig } from './violin/interfaces';
 
 const DEFAULT_SHAPES = ['circle', 'square', 'triangle-up', 'star'];
 
-function registerAllVis() {
+function registerAllVis(visTypes?: string[]) {
   return [
     createVis({
       type: ESupportedPlotlyVis.SCATTER,
@@ -113,15 +113,15 @@ function registerAllVis() {
       mergeConfig: correlationMergeDefaultConfig,
       description: 'Visualizes statistical relationships between pairs of numerical variables',
     }),
-  ];
+  ].filter((v) => !visTypes || visTypes.includes(v.type));
 }
 
-export function useRegisterDefaultVis() {
+export function useRegisterDefaultVis(visTypes?: string[]) {
   const { registerVisType } = useVisProvider();
 
   React.useEffect(() => {
-    registerVisType(...registerAllVis());
-  }, [registerVisType]);
+    registerVisType(...registerAllVis(visTypes));
+  }, [registerVisType, visTypes]);
 }
 
 export function EagerVis({
@@ -141,6 +141,7 @@ export function EagerVis({
   setShowSidebar: internalSetShowSidebar,
   showSidebarDefault = false,
   scrollZoom = true,
+  visTypes,
 }: {
   /**
    * Required data columns which are displayed.
@@ -185,6 +186,10 @@ export function EagerVis({
   setShowSidebar?(show: boolean): void;
   showSidebarDefault?: boolean;
   scrollZoom?: boolean;
+  /**
+   * Optional property which enables the user to specify which vis types to show as options in the sidebar. If not specified, all vis types will be used.
+   */
+  visTypes?: string[];
 }) {
   const [showSidebar, setShowSidebar] = useUncontrolled<boolean>({
     value: internalShowSidebar,
@@ -195,7 +200,7 @@ export function EagerVis({
 
   const [ref, dimensions] = useResizeObserver();
 
-  useRegisterDefaultVis();
+  useRegisterDefaultVis(visTypes);
 
   const { getVisByType } = useVisProvider();