style: [sdk-1556] convert example to ts

Author: joker23

packages/sdk/shopify-oxygen/example/app.js renamed to packages/sdk/shopify-oxygen/example/app.ts

@@ -1,13 +1,15 @@
-import {createMiniOxygen} from '@shopify/mini-oxygen';
+import { createMiniOxygen } from '@shopify/mini-oxygen';
+
+/* eslint-disable no-console */
 
 /**
  * This is script is a simple runner for our example app. This script will run
  * the compiled example on a local worker implementation to emulate a Oxygen worker runtime.
- * 
+ *
  * For the actual example implementation, see the src/index.ts file.
  */
 
-const printValueAndBanner = (flagKey, flagValue) => {
+const printValueAndBanner = (flagKey: string, flagValue: string) => {
   console.log(`*** The '${flagKey}' feature flag evaluates to ${flagValue}.`);
 
   if (flagValue) {
@@ -24,7 +26,7 @@ const printValueAndBanner = (flagKey, flagValue) => {
   `,
     );
   }
-}
+};
 
 const main = async () => {
   // NOTE: you will see logging coming from mini-oxygen's default request hook.
@@ -35,44 +37,46 @@ const main = async () => {
       {
         name: 'main',
         modules: true,
-        scriptPath: 'dist/index.js'
+        scriptPath: 'dist/index.js',
       },
     ],
   });
 
   miniOxygen.ready.then(() => {
     console.log('Oxygen worker is started...');
     console.log('Press "q" or Ctrl+C to quit...');
-    
+
     // Dispatch fetch every 5 seconds
     const interval = setInterval(() => {
       // NOTE: This is a bogus URL and will not be used in the actual fetch handler.
       // please see the src/index.ts file for the actual fetch handler.
-      miniOxygen.dispatchFetch('https://localhost:8000')
-        .then(d => d.json())
-        .then(({flagValue, flagKey}) => {
+      miniOxygen
+        .dispatchFetch('https://localhost:8000' as any)
+        .then((d) => d.json() as Promise<any>)
+        .then(({ flagValue, flagKey }) => {
           console.clear();
           printValueAndBanner(flagKey, flagValue);
-          console.log('Press "q" or Ctrl+C to quit...')
-        }).catch((err) => {
+          console.log('Press "q" or Ctrl+C to quit...');
+        })
+        .catch((err) => {
           console.log('Error dispatching fetch:', err.message);
-          console.log('Press "q" or Ctrl+C to quit...')
+          console.log('Press "q" or Ctrl+C to quit...');
         });
     }, 1000);
-    
+
     // Handle keypresses for cleanup
     process.stdin.setRawMode(true);
     process.stdin.resume();
     process.stdin.setEncoding('utf8');
-    
-    process.stdin.on('data', async (key) => {
+
+    process.stdin.on('data', async (key: string) => {
       // Handle Ctrl+C
       if (key === '\u0003') {
         clearInterval(interval);
         await miniOxygen.dispose();
         process.exit();
       }
-      
+
       // Handle 'q' key
       if (key === 'q' || key === 'Q') {
         clearInterval(interval);
@@ -81,6 +85,6 @@ const main = async () => {
       }
     });
   });
-}
+};
 
 main().catch(console.error);

packages/sdk/shopify-oxygen/example/package.json

@@ -4,12 +4,14 @@
   "scripts": {
     "build": "tsup",
     "clean": "rm -rf dist",
-    "start": "yarn clean && yarn build && yarn node app.js"
+    "start": "yarn clean && yarn build && ts-node app.ts"
   },
   "type": "module",
   "dependencies": {
     "@launchdarkly/shopify-oxygen-sdk": "latest",
-    "@shopify/mini-oxygen": "^4.0.0"
+    "@shopify/mini-oxygen": "^4.0.0",
+    "ts-node": "^10.9.2",
+    "typescript": "^5.9.3"
   },
   "devDependencies": {
     "tsup": "^8.5.1"