@sleeperhq/mini-core 1.0.4 → 1.0.5

package/bin/build_mini.js

@@ -3,24 +3,66 @@
 const { spawn } = require('child_process');
 const os = require('os');
 const path = require('path');
+const readLine = require('readline');
+const fs = require('fs');
 
 const isWindows = os.platform() === 'win32';
 
-const outputFile = 'mini-app';
-const zipFile = `${outputFile}.zip`;
-const assetsDestPath = {
-  ios: path.join(outputFile, 'ios'),
-  android: path.join(outputFile, 'android'),
-};
-const bundleOutputPath = {
-  ios: path.join(assetsDestPath["ios"], 'index.bundle'),
-  android: path.join(assetsDestPath["android"], 'index.bundle'),
-};
-const sourcemapOutputPath = {
-  ios: path.join(assetsDestPath["ios"], 'index.bundle.map'),
-  android: path.join(assetsDestPath["android"], 'index.bundle.map'),
-};
-const reactNativeCliPath = path.join('node_modules', 'react-native', 'cli.js');
+const getCommands = (projectName) => {
+  // Pathing
+  const distPath = path.join('dist', projectName);
+  const zipFilePath = `${distPath}.zip`;
+  const assetsDestPath = {
+    ios: path.join(distPath, 'ios'),
+    android: path.join(distPath, 'android'),
+  };
+  const bundleOutputPath = {
+    ios: path.join(assetsDestPath["ios"], 'index.bundle'),
+    android: path.join(assetsDestPath["android"], 'index.bundle'),
+  };
+  const sourcemapOutputPath = {
+    ios: path.join(assetsDestPath["ios"], 'index.bundle.map'),
+    android: path.join(assetsDestPath["android"], 'index.bundle.map'),
+  };
+  const reactNativeCliPath = path.join('node_modules', 'react-native', 'cli.js');
+  
+  // Commands
+  const removeDir = (isWindows ? 'rmdir /s /q ' : 'rm -rf ');
+  // TODO (Windows): double check this zip command.
+  const zip = isWindows ?
+    `powershell Compress-Archive -Path "${distPath}" -DestinationPath "${zipFilePath}"` :
+    `cd dist && zip -r "${projectName}.zip" * && cd -`;
+  const openFile = isWindows ? `start .` : `open .`;
+  const cleanIndex = `${removeDir} "${bundleOutputPath["ios"]}" "${bundleOutputPath["android"]}" "${sourcemapOutputPath["ios"]}" "${sourcemapOutputPath["android"]}"`;
+  const cleanAll = `${removeDir} dist node_modules`;
+  const cleanBuild = `${removeDir} "${distPath}" "${assetsDestPath["ios"]}" "${assetsDestPath["android"]}"`;
+  const install = `yarn install && cd ios && pod install && cd -`;
+
+  const getBundleCommand = (platform) => {
+    return `node "${reactNativeCliPath}" webpack-bundle \
+    --entry-file index.tsx \
+    --platform ${platform} \
+    --dev false \
+    --reset-cache \
+    --bundle-output "${bundleOutputPath[platform]}" \
+    --sourcemap-output "${sourcemapOutputPath[platform]}" \
+    --minify false \
+    --assets-dest "${assetsDestPath[platform]}"`;
+  };
+  
+  // Exposed
+  return {
+    bundleIOS: getBundleCommand('ios'),
+    bundleAndroid: getBundleCommand('android'),
+    zip,
+    openFile,
+    cleanIndex,
+    cleanAll,
+    cleanBuild,
+    zipFilePath,
+    install,
+  }
+}
 
 const spawnProcess = (command, errorMessage) => {
   return new Promise((resolve) => {
@@ -58,52 +100,85 @@ const printComplete = (message) => {
   console.log("\033[92m" + message + "\033[0m");
 };
 
-const getBundleCommand = (platform) => {
-  return `node ${reactNativeCliPath} webpack-bundle \
-  --entry-file index.tsx \
-  --platform ${platform} \
-  --dev false \
-  --reset-cache \
-  --bundle-output ${bundleOutputPath[platform]} \
-  --sourcemap-output ${sourcemapOutputPath[platform]} \
-  --minify false \
-  --assets-dest ${assetsDestPath[platform]}`;
+const getInput = (message, fallback) => {
+  const interface = readLine.createInterface({
+    input: process.stdin,
+    output: process.stdout
+  });
+  
+  return new Promise((resolve) => {
+    interface.question("\n\033[96m[current: " + fallback + "]\033[0m " + message, (name) => {
+      const result = name.trim();
+      if (!result) {
+        resolve(fallback);
+      }
+      resolve(name.trim());
+    });
+  });
 };
 
-const deleteCommand = (isWindows ? 'rmdir /s /q ' : 'rm -rf ');
-const zipCommand = isWindows ?
-  `powershell Compress-Archive -Path ${outputFile} -DestinationPath ${zipFile}` :
-  `zip -r ${zipFile} ${outputFile}`;
-const openCommand = isWindows ? `start .` : `open .`;
-const cleanIndexCommand = `${deleteCommand} ${bundleOutputPath["ios"]} ${bundleOutputPath["android"]} ${sourcemapOutputPath["ios"]} ${sourcemapOutputPath["android"]}`;
-const cleanAllCommand = `${deleteCommand} ${outputFile} ${zipFile}`;
-const cleanBuildCommand = `${deleteCommand} ${outputFile}`;
+const getProjectName = () => {
+  const appJsonPath = 'app.json';
+  const appJson = JSON.parse(fs.readFileSync(appJsonPath));
+  return appJson.name;
+}
+
+const setProjectName = (name) => {
+  const podfilePath = path.join('ios', 'Podfile');
+  const podfileString = fs.readFileSync(podfilePath).toString();
+  const newPodfileString = podfileString.replace(/target '.*'/, `target '${name}'`);
+  fs.writeFileSync(podfilePath, newPodfileString);
+}
+
+const validateProjectName = (name) => {
+  const regex = /^[a-zA-Z0-9_]+$/;
+  return regex.test(name);
+}
 
 const main = async () => {
+  // Enter project name.
+  const fallback = getProjectName();
+  const projectName = await getInput("Enter project name: ", fallback);
+  if (!validateProjectName(projectName)) {
+    printError("Invalid project name. Only alphanumeric characters and underscores are allowed.");
+    process.exit(1);
+  }
+  
+  if (projectName !== fallback) {
+    await spawnProcess(`yarn react-native-rename "${projectName}" --skipGitStatusCheck`, "rename command exited with non-zero code");
+    setProjectName(projectName);
+  }
+
+  const commands = getCommands(projectName);
+
   // Clean build folders
-  await spawnProcess(cleanAllCommand, "clean command exited with non-zero code");
+  await spawnProcess(commands.cleanAll, "clean command exited with non-zero code");
+
+  // Run yarn + pod install
+  await spawnProcess(commands.install, "clean command exited with non-zero code");
 
   // Build iOS
   printInfo("Building iOS...");
-  await spawnProcess(getBundleCommand("ios"), "webpack-bundle ios command exited with non-zero code");
+  await spawnProcess(commands.bundleIOS, "webpack-bundle ios command exited with non-zero code");
   printComplete("iOS build complete.");
 
   // Build Android
   printInfo("Building Android...");
-  await spawnProcess(getBundleCommand("android"), "webpack-bundle android command exited with non-zero code");
+  await spawnProcess(commands.bundleAndroid, "webpack-bundle android command exited with non-zero code");
   printComplete("Android build complete.");
 
   // Create Zip Archive
   printInfo("Creating zip archive...");
-  await spawnProcess(cleanIndexCommand, "clean command exited with non-zero code");
-  await spawnProcess(zipCommand, "zip command exited with non-zero code");
-  printComplete("Zip archive created successfully at mini-app.zip.");
+  await spawnProcess(commands.cleanIndex, "clean command exited with non-zero code");
+  await spawnProcess(commands.zip, "zip command exited with non-zero code");
+  printComplete(`Zip archive created successfully at ${commands.zipFilePath}`);
 
   // Clean build folders
-  await spawnProcess(cleanBuildCommand, "clean command exited with non-zero code");
+  await spawnProcess(commands.cleanBuild, "clean command exited with non-zero code");
 
   // Open output folder
-  spawnProcess(openCommand);
+  await spawnProcess(commands.openFile);
+  process.exit(0);
 };
 
 main();

package/declarations/sleeper_context.d.ts

@@ -1,13 +1,5 @@
-import { User, Navigation, League, LeaguesMap, RostersInLeagueMap } from './types';
+import { User, Navigation, League, LeaguesMap, RostersInLeagueMap, UserMap, MatchupsInLeagueMap } from './types';
 import SleeperActions from './sleeper_actions';
-type SleeperContextConfig = {
-    user: User;
-    navigation: Navigation;
-    league: League;
-    userLeagueList: string[];
-    leaguesMap: LeaguesMap;
-    rostersInLeagueMap: RostersInLeagueMap;
-};
 declare class SleeperContext {
     user: User;
     navigation: Navigation;
@@ -15,7 +7,9 @@ declare class SleeperContext {
     leaguesMap: LeaguesMap;
     userLeagueList: string[];
     rostersInLeagueMap: RostersInLeagueMap;
+    userMap: UserMap;
+    matchupsInLeagueMap: MatchupsInLeagueMap;
     actions: SleeperActions;
-    constructor(config: SleeperContextConfig);
+    constructor();
 }
 export default SleeperContext;

package/declarations/sleeper_message.d.ts

@@ -1,5 +1,6 @@
 type SocketMessage = {
     _ip?: string;
+    _name?: string;
     _webpack?: string;
     _contextGet?: string;
 };

package/declarations/types/index.d.ts

@@ -1,8 +1,8 @@
 import { NAVIGATION_ID, NAVIGATION_TYPE } from './redux/native_nav/constants.d';
-import { League, Roster } from './shared/graphql.d';
-export * from './shared/graphql.d';
+import { League, Roster, User, MatchupLeg } from './shared/graphql.d';
 export type NavigationType = typeof NAVIGATION_TYPE[keyof typeof NAVIGATION_TYPE];
 export type NavigationTypeId = typeof NAVIGATION_ID[keyof typeof NAVIGATION_ID];
+export * from './shared/graphql.d';
 export type Navigation = {
     selectedNavType: NavigationType;
     selectedNavTypeId: NavigationTypeId;
@@ -10,6 +10,11 @@ export type Navigation = {
 };
 export type LeagueId = string;
 export type RosterId = string;
+export type UserId = string;
+export type MatchupWeek = number;
 export type LeaguesMap = Record<LeagueId, League>;
 export type RostersMap = Record<RosterId, Roster>;
 export type RostersInLeagueMap = Record<LeagueId, RostersMap>;
+export type UserMap = Record<UserId, User>;
+export type MathchupWeekMap = Record<MatchupWeek, MatchupLeg>;
+export type MatchupsInLeagueMap = Record<LeagueId, MathchupWeekMap>;

package/declarations/types/shared/graphql.d.ts

@@ -71,6 +71,24 @@ export type League = {
     status?: Maybe<Scalars['String']>;
     total_rosters?: Maybe<Scalars['Int']>;
 };
+export type MatchupLeg = {
+    __typename?: 'MatchupLeg';
+    bans?: Maybe<Scalars['Map']>;
+    custom_points?: Maybe<Scalars['Float']>;
+    league_id?: Maybe<Scalars['Snowflake']>;
+    leg?: Maybe<Scalars['Int']>;
+    matchup_id?: Maybe<Scalars['Int']>;
+    max_points?: Maybe<Scalars['Float']>;
+    picks?: Maybe<Scalars['Map']>;
+    player_map?: Maybe<Scalars['Map']>;
+    players?: Maybe<Scalars['Set']>;
+    points?: Maybe<Scalars['Float']>;
+    proj_points?: Maybe<Scalars['Float']>;
+    roster_id?: Maybe<Scalars['Int']>;
+    round?: Maybe<Scalars['Int']>;
+    starters?: Maybe<Scalars['List']>;
+    starters_games?: Maybe<Scalars['Map']>;
+};
 export type Roster = {
     __typename?: 'Roster';
     co_owners?: Maybe<Scalars['SnowflakeSet']>;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sleeperhq/mini-core",
-  "version": "1.0.4",
+  "version": "1.0.5",
   "description": "Core library frameworks for developing Sleeper Mini Apps.",
   "main": "index.ts",
   "types": "index.d.ts",
@@ -40,6 +40,7 @@
     "react": "17.0.2",
     "react-native": "0.66.5",
     "react-native-linear-gradient": "2.5.6",
+    "react-native-rename": "^3.2.12",
     "react-native-svg": "13.7.0",
     "react-native-tcp-socket": "^6.0.6"
   },

package/src/dev_server/index.tsx

@@ -1,10 +1,10 @@
 import React, {useEffect, useRef, useState} from 'react';
 import {Platform} from 'react-native';
 import {Config, SocketMessage} from '../types';
-import {ScriptManager, Federated} from '@callstack/repack/client';
+import { ScriptLocatorResolver, ScriptManager, Federated } from '@callstack/repack/client';
 import NetInfo from '@react-native-community/netinfo';
 import TcpSocket from 'react-native-tcp-socket';
-import axios from 'axios';
+import { fetchMainVersionMap, getMainUrl } from './url_resolver';
 
 let config: Config;
 const RETRY_TIMER = 5000;
@@ -14,6 +14,15 @@ const DevServer = props => {
   const partialMessage = useRef('');
   const _retryTimer = useRef<NodeJS.Timeout>();
 
+  const [data, setData] = useState({
+    platform: '',
+    binaryVersion: '',
+    dist: '',
+    isStaging: false,
+  });
+  const _dataRef = useRef<typeof data>();
+  const _versionMap = useRef<Record<string, string>>();
+
   const _onConnected = async (value: boolean) => {
     props.onConnected(value);
   };
@@ -21,7 +30,7 @@ const DevServer = props => {
   const onSocket = (handler) => msg => {
     let json;
     try {
-      json = JSON.parse(msg);
+      json = JSON.parse(msg); 
     } catch(e) {
       partialMessage.current += msg;
     }
@@ -35,6 +44,17 @@ const DevServer = props => {
       }
     }
 
+    // Set connection data
+    if (json._platform || json._binaryVersion || json._dist || json._isStaging) {
+      console.log("[Sleeper] Received context data:", json._platform, json._binaryVersion, json._dist, json._isStaging);
+      setData({
+        platform: json._platform,
+        binaryVersion: json._binaryVersion,
+        dist: json._dist,
+        isStaging: json._isStaging,
+      });
+    }
+
     // We should have a context object now
     const context = new Proxy(json, handler);
     props.onContextChanged(context);
@@ -44,7 +64,7 @@ const DevServer = props => {
     const message: SocketMessage = {_contextGet: propertyPath};
     const json = JSON.stringify(message);
     try {
-      socket?.write(json);
+      socket?.write(json + '\n');
     } catch (e) {
       console.log("[Sleeper] Failed to send context request: ", e);
     }
@@ -53,40 +73,53 @@ const DevServer = props => {
   const proxyHandler = (socket) => {
     return {
       get: (target, property) => {
-        if (property in target && target[property] !== null) {
-          const value = target[property];
-
-          if (typeof value !== 'object' || value._isProxy) {
-            return value;
-          }
+        let value = Reflect.get(target, property);
 
+        // Check if we need to add a proxy to this object
+        if (!!value && typeof value === 'object' && !value._isProxy && value._isProxyInternal) {
+          const isLeaf = !value._continueProxy;
           // Adding proxies to objects
-          // Intentionally only going 1 level deep
-          const handler = proxyHandlerLeaf(socket, property);
-          target[property] = new Proxy(value, handler);
-          target[property]._isProxy = true;
-
-          return target[property];
+          const handler = proxyHandlerChild(socket, property, isLeaf);
+          const proxiedValue = new Proxy(value, handler);
+          Reflect.set(target, property, proxiedValue);
+          value = proxiedValue;
         }
 
-        // This property is not in the context object yet
-        sendContextRequest(socket, property);
-        return null;
+        return value;
       }
     };
   }
 
-  // This handler is for leaf nodes only
-  const proxyHandlerLeaf = (socket, path) => {
+  const proxyHandlerChild = (socket, path, isLeaf) => {
     return {
       get: (target, property) => {
-        if (target[property] !== undefined) { // Only checking undefined properites for leaves
-          return target[property];
+        // Check if a proxy was already added to this object
+        if (property === '_isProxy') {
+          return true;
+        }
+
+        const value = Reflect.get(target, property);
+        const fullPropertyPath = `${path}.${property}`;
+
+        // If the value is undefined, we need to request it from the server
+        if (value === undefined && isLeaf) {
+          sendContextRequest(socket, fullPropertyPath);
         }
 
-        const fullProp = path + '.' + property;
-        sendContextRequest(socket, fullProp);
-        return null;
+        // Check if we need to add a second layer proxy to this object
+        if (!isLeaf && !value?._isProxy) {
+          const nextLeaf = true; // Currently we only support 2 layers of proxies
+          // Adding proxies to objects
+          // These proxies aren't stored in the context object so we will regenerate them every time
+          const handler = proxyHandlerChild(socket, fullPropertyPath, nextLeaf);
+          if (value === undefined) {
+            return new Proxy({}, handler);
+          } else {
+            return new Proxy(value, handler);
+          }
+        }
+
+        return value;
       }
     };
   }
@@ -102,16 +135,20 @@ const DevServer = props => {
     }
 
     connection.current = TcpSocket.createConnection({
-      port: config.remoteSocketPort,
+      port: config.remoteSocketPort || 9092,
       host: config.remoteIP,
       localAddress: ipAddress,
       reuseAddress: true,
     }, () => {
       // When we establish a connection, send the IP address to the server
-      const message: SocketMessage = { _ip: ipAddress };
+      const message: SocketMessage = { 
+        _ip: ipAddress, 
+        _name: config.name, 
+      };
       const json = JSON.stringify(message);
+      console.log('[Sleeper] Send IP address: ', ipAddress, config.name);
       try {
-        connection.current?.write(json, undefined, (error) => {
+        connection.current?.write(json + '\n', "utf8", (error) => {
           if (error) {
             return stopSocket();
           }
@@ -154,12 +191,61 @@ const DevServer = props => {
     }
   }
 
+  const _waitForInitialization = () => {
+    return new Promise<void>((resolve) => {
+      (function checkData() {
+        let isInitialized = !!_dataRef.current?.dist;
+
+        // Non-staging builds also require a version map to be defined.
+        if (!_dataRef.current?.isStaging) {
+          isInitialized = !!_versionMap.current;
+        }
+
+        if (isInitialized) return resolve();
+        setTimeout(checkData, 1000);
+      })();
+    });
+  };
+
+  const _resolveRemoteChunk: ScriptLocatorResolver = async (scriptId: string, caller: string) => {
+    await _waitForInitialization();
+
+    const bundleName = !caller ? `${scriptId}.container.bundle` : `${scriptId}.chunk.bundle`;
+    
+    // Try to resolve URL based on scriptId and caller
+    const url = getMainUrl(scriptId, caller, {
+      platform: _dataRef.current?.platform,
+      bundleVersion: _versionMap.current?.[bundleName],
+      binaryVersion: _dataRef.current?.binaryVersion,
+      dist: _dataRef.current?.dist,
+      isStaging: _dataRef.current?.isStaging,
+      remoteIP: config.remoteIP,
+      dev: config.dev,
+    });
+    const query = config.dev ? {platform: Platform.OS} : undefined;
+
+    console.log('[Sleeper] load script:', scriptId, caller, url);
+    return {url, query};
+  }
+
+  const _fetchVersionMap = async (platform, binaryVersion, dist) => {
+    _versionMap.current = await fetchMainVersionMap(platform, binaryVersion, dist);
+  }
+
+  useEffect(() => {
+    _dataRef.current = data;
+    if (!data.platform || !data.binaryVersion || !data.dist) return;
+    
+    _fetchVersionMap(data.platform, data.binaryVersion, data.dist);
+  }, [data.platform, data.binaryVersion, data.dist, data.isStaging]);
+
   useEffect(() => {
     if (!config) {
       console.error('[Sleeper] No config file specified. Please make sure you call DevServer.init() early in the app lifecycle.');
       return;
     }
 
+    ScriptManager.shared.addResolver(_resolveRemoteChunk.bind(this));
     startSocket();
 
     return () => {
@@ -172,34 +258,6 @@ const DevServer = props => {
 
 DevServer.init = (_config: Config) => {
   config = _config;
-
-  const remoteBundleHost = config.release ? config.remoteIP : 'localhost';
-  const remoteBundlePort = config.release ? config.remoteBundlePort : 8081;
-
-  ScriptManager.shared.addResolver(async (scriptId, caller) => {
-    const extension =
-      scriptId === 'sleeper' ? '.container.bundle' : '.chunk.bundle';
-    const resolveURL = Federated.createURLResolver({
-      containers: {
-        sleeper: `http://${remoteBundleHost}:${remoteBundlePort}/[name]${extension}`,
-      },
-    });
-  
-    // Try to resolve URL based on scriptId and caller
-    const url = resolveURL(scriptId, caller);
-    const query = config.release ? undefined : {platform: Platform.OS};
-  
-    const response = await axios
-      .get(url + '?' + new URLSearchParams(query), {method: 'HEAD'})
-      .catch(() => ({
-        status: 404,
-      }));
-  
-    console.log('[Sleeper] load script:', scriptId, caller);
-    if (response?.status === 200) {
-      return {url, query};
-    }
-  });
-};
+}
 
 export default DevServer;

package/src/dev_server/url_resolver.tsx

@@ -0,0 +1,71 @@
+import axios, { AxiosPromise, AxiosRequestConfig } from 'axios';
+import { 
+  getWebpackContext,
+  Federated,
+} from '@callstack/repack/client';
+import { Platform } from 'react-native';
+
+export type MainPlatformData = {
+  // Received from socket
+  platform?: string,
+  bundleVersion?: string,
+  binaryVersion?: string,
+  dist?: string,
+  isStaging?: boolean,
+
+  // From app.json
+  remoteIP: string,
+  dev?: boolean,
+}
+
+const PROD_CDN = "https://sleepercdn.com/bundles/";
+const TEST_CDN = "https://test.sleepercdn.com/bundles/";
+
+// Query a list of urls, and grab the first one that returns a 200 response.
+const _fetchFirstAvailable = (config: AxiosRequestConfig, ...urls: string[]) => {
+  return new Promise<any>((resolve) => {
+    (async function fetchMap() {
+      const promises = urls.map((url) => axios.get(url, config).catch(() => null));
+      const responses = await Promise.all<AxiosPromise>(promises);
+      
+      const successfulResponse = responses.find((response) => response?.status === 200);
+      if (config?.method === 'HEAD') {
+        successfulResponse ? resolve({ url: successfulResponse.config.url }) : setTimeout(fetchMap, 5000);
+      } else {
+        successfulResponse ? resolve(successfulResponse.data) : setTimeout(fetchMap, 5000);
+      }
+    })();
+  });
+}
+
+export const fetchMainVersionMap = (platform: string, binaryVersion: string, dist: string) => {
+  const baseUrl = `${PROD_CDN}/version_maps/${platform}/${binaryVersion}/${dist}.json`;
+  const codepushUrl = `${PROD_CDN}/version_maps/${platform}/codepush/${dist}.json`;
+
+  return _fetchFirstAvailable({}, baseUrl, codepushUrl);
+}
+
+export const getMainUrl = (scriptId: string, caller: string, config: MainPlatformData) => {
+  let sleeper: string;
+
+  if (config.dev) {
+    sleeper = `http://${config.remoteIP}:8081/`;
+  } else if (config.isStaging) {
+    if (config.dist === '0') {
+      sleeper = `${TEST_CDN}/${config.platform}/${config.binaryVersion}/${config.dist}/`;
+    } else {
+      sleeper = `${TEST_CDN}/${config.platform}/codepush/${config.dist}/`;
+    }
+  } else {
+    sleeper = `${PROD_CDN}/data/${Platform.OS}/${config.bundleVersion}/`;
+  }
+
+  const resolveURL = Federated.createURLResolver({
+    containers: {
+      sleeper: `${sleeper}[name][ext]`,
+    } 
+  });
+  const bundleLocation = resolveURL(scriptId, caller);
+
+  return bundleLocation;
+}

package/src/types/index.ts

@@ -6,8 +6,6 @@ export type Config = {
   name: string,
   displayName: string,
   remoteIP: string,
-  localSocketPort: number,
-  remoteSocketPort: number,
-  remoteBundlePort: number,
-  release: boolean,
+  remoteSocketPort?: number,
+  dev?: boolean,
 };