chore: update templates to use inline ext (#1058)

* chore: update templates to use inline ext

* chore: update script template

commands/create/templates/sn/none/_package.json

@@ -18,7 +18,7 @@
     "build": "nebula build",
     "lint": "eslint src",
     "start": "nebula serve",
-    "sense": "nebula sense --ext src/ext.js --meta src/meta.json",
+    "sense": "nebula sense --meta src/meta.json",
     "test:e2e": "playwright test",
     "test:e2e:report": "playwright show-report test/integration/test-report"
   },

commands/create/templates/sn/none/src/ext.js

@@ -1,4 +1,5 @@
-export default {
+export default function ext(/* galaxy */) {
+  return {
     support: {
       snapshot: false,
       export: true,
@@ -6,4 +7,5 @@ export default {
       exportData: true,
       viewData: true,
     },
-};
+  };
+}

commands/create/templates/sn/none/src/index.js

@@ -1,13 +1,22 @@
 import { useElement } from '@nebula.js/stardust';
 import properties from './object-properties';
 import data from './data';
-
-export default function supernova() {
+import ext from './ext';
+/**
+ * Entrypoint for your sense visualization
+ * @param {object} galaxy Contains global settings from the environment.
+ * Useful for cases when stardust hooks are unavailable (ie: outside the component function)
+ * @param {object} galaxy.anything Extra environment dependent options
+ * @param {object=} galaxy.anything.sense Optional object only present within Sense,
+ * see: https://qlik.dev/libraries-and-tools/nebulajs/in-qlik-sense
+ */
+export default function supernova(galaxy) {
   return {
     qae: {
       properties,
       data,
     },
+    ext: ext(galaxy),
     component() {
       const element = useElement();
       element.innerHTML = '<div>Hello!</div>'; // eslint-disable-line

commands/create/templates/sn/picasso/barchart/src/ext.js

@@ -1,4 +1,5 @@
-export default {
+export default function ext(/* galaxy */) {
+  return {
     support: {
       snapshot: false,
       export: true,
@@ -6,4 +7,5 @@ export default {
       exportData: true,
       viewData: true,
     },
-};
+  };
+}

commands/create/templates/sn/picasso/common/src/index.js

@@ -14,8 +14,17 @@ import properties from './object-properties';
 import data from './data';
 import picSelections from './pic-selections';
 import definition from './pic-definition';
+import ext from './ext';
 
-export default function supernova(/* env */) {
+/**
+ * Entrypoint for your sense visualization
+ * @param {object} galaxy Contains global settings from the environment.
+ * Useful for cases when stardust hooks are unavailable (ie: outside the component function)
+ * @param {object} galaxy.anything Extra environment dependent options
+ * @param {object=} galaxy.anything.sense Optional object only present within Sense,
+ * see: https://qlik.dev/libraries-and-tools/nebulajs/in-qlik-sense
+ */
+export default function supernova(galaxy) {
   const picasso = picassojs();
   picasso.use(picassoQ);
 
@@ -24,6 +33,7 @@ export default function supernova(/* env */) {
       properties,
       data,
     },
+    ext: ext(galaxy),
     component() {
       const element = useElement();
       const selections = useSelections();

commands/create/templates/sn/picasso/minimal/src/ext.js

@@ -1,4 +1,5 @@
-export default {
+export default function ext(/* galaxy */) {
+  return {
     support: {
       snapshot: false,
       export: true,
@@ -6,4 +7,5 @@ export default {
       exportData: true,
       viewData: true,
     },
-};
+  };
+}

examples/sn-hello-react/src/ext.js

@@ -0,0 +1,11 @@
+export default function ext(/* galaxy */) {
+  return {
+    support: {
+      snapshot: false,
+      export: true,
+      sharing: false,
+      exportData: true,
+      viewData: true,
+    },
+  };
+}

examples/sn-hello-react/src/index.js

@@ -2,15 +2,24 @@ import { useElement, useLayout, useEffect } from '@nebula.js/stardust';
 
 import properties from './object-properties';
 import data from './data';
+import ext from './ext';
 
 import { render, teardown } from './components/root';
-
-export default function supernova(/* env */) {
+/**
+ * Entrypoint for your sense visualization
+ * @param {object} galaxy Contains global settings from the environment.
+ * Useful for cases when stardust hooks are unavailable (ie: outside the component function)
+ * @param {object} galaxy.anything Extra environment dependent options
+ * @param {object=} galaxy.anything.sense Optional object only present within Sense,
+ * see: https://qlik.dev/libraries-and-tools/nebulajs/in-qlik-sense
+ */
+export default function supernova(galaxy) {
   return {
     qae: {
       properties,
       data,
     },
+    ext: ext(galaxy),
     component() {
       const el = useElement();
       const layout = useLayout();