refacto/migrate-turborepo

packages/web/.gitignore

@@ -0,0 +1,3 @@
+node_modules
+dist
+.DS_Store

packages/web/CHANGELOG.md

@@ -0,0 +1,16 @@
+## 0.1.3
+
+- Add automatic session timeout after 1 hour of inactivity
+
+## 0.1.2
+
+- Added support for automatic segregation of Debug/Release events
+
+## 0.1.1
+
+- Refactor on session generator
+
+## 0.1.0
+
+- Move to Rollup 3
+- Output both CJS and ESM modules

packages/web/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2023 Sumbit Labs Ltd.
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

packages/web/README.md

@@ -0,0 +1,54 @@
+![Aptabase](https://aptabase.com/og.png)
+
+# JavaScript SDK for Aptabase
+
+A tiny SDK (1 kB) to instrument your web app with Aptabase, an Open Source, Privacy-First and Simple Analytics for Mobile, Desktop and Web Apps.
+
+> 👉 **IMPORTANT**
+>
+> This SDK is for **Web Applications**, not websites. There's a subtle, but important difference. A web app is often a lot more interactive and does not cause a full page reload when the user interacts with it. It's often called a **Single-Page Application**. A website, on the other hand, is a lot more content-focused like marketing sites, landing pages, blogs, etc. While you can certainly use Aptabase to track events on websites, please be aware that each page reload will be considered a new session.
+
+## Install
+
+Install the SDK using your preferred JavaScript package manager
+
+```bash
+pnpm add @aptabase/web
+# or
+npm add @aptabase/web
+# or
+yarn add @aptabase/web
+```
+
+## Usage
+
+First you need to get your `App Key` from Aptabase, you can find it in the `Instructions` menu on the left side menu.
+
+Initialized the SDK using your `App Key`:
+
+```js
+import { init } from "@aptabase/web";
+
+init("<YOUR_APP_KEY>"); // 👈 this is where you enter your App Key
+```
+
+The init function also supports an optional second parameter, which is an object with the `appVersion` property.
+
+It's up to you to decide what to get the version of your app, but it's generally recommended to use your bundler (like Webpack, Vite, Rollup, etc.) to inject the values at build time.
+
+Afterwards you can start tracking events with `trackEvent`:
+
+```js
+import { trackEvent } from "@aptabase/web";
+
+trackEvent("connect_click"); // An event with no properties
+trackEvent("play_music", { name: "Here comes the sun" }); // An event with a custom property
+```
+
+A few important notes:
+
+1. The SDK will automatically enhance the event with some useful information, like the OS, the app version, and other things.
+2. You're in control of what gets sent to Aptabase. This SDK does not automatically track any events, you need to call `trackEvent` manually.
+   - Because of this, it's generally recommended to at least track an event at startup
+3. You do not need to await the `trackEvent` function, it'll run in the background.
+4. Only strings and numbers values are allowed on custom properties

packages/web/package.json

@@ -0,0 +1,47 @@
+{
+  "name": "@aptabase/web",
+  "version": "0.1.3",
+  "private": false,
+  "type": "module",
+  "description": "JavaScript SDK for Aptabase: Open Source, Privacy-First and Simple Analytics for Mobile, Desktop and Web Apps",
+  "main": "./dist/index.js",
+  "module": "./dist/index.mjs",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    ".": {
+      "require": "./dist/index.js",
+      "import": "./dist/index.mjs",
+      "types": "./dist/index.d.ts"
+    }
+  },
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/aptabase/aptabase-js.git",
+    "directory": "packages/js"
+  },
+  "bugs": {
+    "url": "https://github.com/aptabase/aptabase-js/issues"
+  },
+  "homepage": "https://github.com/aptabase/aptabase-js",
+  "license": "MIT",
+  "scripts": {
+    "build": "rollup -c ./rollup.config.mjs",
+    "watch": "rollup -c ./rollup.config.mjs -w",
+    "prepublishOnly": "yarn build",
+    "pretest": "yarn build"
+  },
+  "files": [
+    "README.md",
+    "LICENSE",
+    "dist",
+    "package.json"
+  ],
+  "devDependencies": {
+    "@rollup/plugin-replace": "5.0.2",
+    "@rollup/plugin-typescript": "11.1.0",
+    "rollup": "3.21.6",
+    "@rollup/plugin-terser": "0.4.1",
+    "tslib": "2.5.0",
+    "typescript": "5.0.4"
+  }
+}

packages/web/rollup.config.mjs

@@ -0,0 +1,37 @@
+import replace from "@rollup/plugin-replace";
+import terser from "@rollup/plugin-terser";
+import typescript from "@rollup/plugin-typescript";
+import pkg from "./package.json" assert { type: "json" };
+
+const plugins = [
+  terser(),
+  replace({
+    "env.PKG_VERSION": pkg.version,
+  }),
+  typescript({
+    tsconfig: "./tsconfig.json",
+    moduleResolution: "node",
+  }),
+];
+
+const cjs = {
+  input: "./src/index.ts",
+  output: {
+    dir: "./dist",
+    entryFileNames: "[name].js",
+    format: "cjs",
+  },
+  plugins,
+};
+
+const es = {
+  input: "./src/index.ts",
+  output: {
+    dir: "./dist",
+    entryFileNames: "[name].mjs",
+    format: "es",
+  },
+  plugins,
+};
+
+export default [cjs, es];

packages/web/src/index.ts

@@ -0,0 +1,117 @@
+import { newSessionId } from "./session";
+
+// env.PKG_VERSION is replaced by rollup during build phase
+const sdkVersion = "aptabase-web@env.PKG_VERSION";
+
+export type AptabaseOptions = {
+  host?: string;
+  appVersion?: string;
+};
+
+// Session expires after 1 hour of inactivity
+const SESSION_TIMEOUT = 1 * 60 * 60;
+let _sessionId = newSessionId();
+let _lastTouched = new Date();
+let _appKey = "";
+let _apiUrl = "";
+let _locale = "";
+let _isDebug = false;
+let _options: AptabaseOptions | undefined;
+
+const _hosts: { [region: string]: string } = {
+  US: "https://us.aptabase.com",
+  EU: "https://eu.aptabase.com",
+  DEV: "http://localhost:3000",
+  SH: "",
+};
+
+function getBaseUrl(
+  region: string,
+  options?: AptabaseOptions
+): string | undefined {
+  if (region === "SH") {
+    if (!options?.host) {
+      console.warn(
+        `Host parameter must be defined when using Self-Hosted App Key. Tracking will be disabled.`
+      );
+      return;
+    }
+    return options.host;
+  }
+
+  return _hosts[region];
+}
+
+export function init(appKey: string, options?: AptabaseOptions) {
+  _appKey = appKey;
+  _options = options;
+
+  const parts = appKey.split("-");
+  if (parts.length !== 3 || _hosts[parts[1]] === undefined) {
+    console.warn(
+      `The Aptabase App Key "${appKey}" is invalid. Tracking will be disabled.`
+    );
+    return;
+  }
+
+  const baseUrl = getBaseUrl(parts[1], options);
+  _apiUrl = `${baseUrl}/api/v0/event`;
+
+  if (typeof location !== "undefined") {
+    _isDebug = location.hostname === "localhost";
+  }
+
+  if (typeof navigator !== "undefined") {
+    _locale =
+      navigator.languages && navigator.languages.length
+        ? navigator.languages[0]
+        : navigator.language;
+  }
+}
+
+export function trackEvent(
+  eventName: string,
+  props?: Record<string, string | number | boolean>
+) {
+  if (!_appKey || typeof window === "undefined" || !window.fetch) return;
+
+  let now = new Date();
+  const diffInMs = now.getTime() - _lastTouched.getTime();
+  const diffInSec = Math.floor(diffInMs / 1000);
+  if (diffInSec > SESSION_TIMEOUT) {
+    _sessionId = newSessionId();
+  }
+  _lastTouched = now;
+
+  const body = JSON.stringify({
+    timestamp: new Date().toISOString(),
+    sessionId: _sessionId,
+    eventName: eventName,
+    systemProps: {
+      isDebug: _isDebug,
+      locale: _locale,
+      appVersion: _options?.appVersion ?? "",
+      sdkVersion,
+    },
+    props: props,
+  });
+
+  window
+    .fetch(_apiUrl, {
+      method: "POST",
+      headers: {
+        "Content-Type": "application/json",
+        "App-Key": _appKey,
+      },
+      credentials: "omit",
+      body,
+    })
+    .then((response) => {
+      if (response.status >= 300) {
+        console.warn(
+          `Failed to send event "${eventName}": ${response.status} ${response.statusText}`
+        );
+      }
+    })
+    .catch(console.error);
+}

packages/web/src/session.ts

@@ -0,0 +1,23 @@
+export function newSessionId() {
+  if (typeof crypto !== "undefined" && crypto && crypto.randomUUID) {
+    return crypto.randomUUID();
+  }
+
+  return [
+    randomStr(8),
+    randomStr(4),
+    randomStr(4),
+    randomStr(4),
+    randomStr(12),
+  ].join("-");
+}
+
+const characters = "abcdefghijklmnopqrstuvwxyz0123456789";
+const charactersLength = characters.length;
+function randomStr(len: number) {
+  let result = "";
+  for (let i = 0; i < len; i++) {
+    result += characters.charAt(Math.floor(Math.random() * charactersLength));
+  }
+  return result;
+}

packages/web/tsconfig.json

@@ -0,0 +1,16 @@
+{
+  "compilerOptions": {
+    "target": "ES5",
+    "strict": true,
+    "allowJs": true,
+    "esModuleInterop": true,
+    "baseUrl": ".",
+    "paths": {
+      "types": ["@types"]
+    },
+    "declaration": true,
+    "declarationDir": "./dist",
+    "rootDir": "./src"
+  },
+  "include": ["./"]
+}