create-unisphere-project 1.0.0

package/README.md

@@ -0,0 +1,56 @@
+# 🪐 create-unisphere-project
+
+Scaffold a new Unisphere-powered project in seconds.
+
+This CLI helps you quickly set up a Unisphere project with a working structure, preconfigured settings, and best practices built-in.
+
+## ✨ Features
+
+- Initializes a new Unisphere-compatible project
+- Supports different Unisphere element types (runtime, packages, applications)
+- Built-in prompts for configuration
+
+## 🚀 Quick Start
+
+Using **npm**:
+
+```bash
+npm create unisphere-project@latest
+```
+
+You’ll be guided through a series of prompts to configure your new project.
+
+⸻
+
+## ✨ What is Unisphere?
+
+**Unisphere** is a framework developed by [Kaltura](https://www.kaltura.com) for building dynamic, composable frontend experiences at scale.
+
+Learn more: [Unisphere Documentation](https://unisphere.kaltura.com)
+
+⸻
+
+## 🛠 Local Development (for maintainers)
+
+To test this CLI locally:
+
+Clone the repository:
+
+```bash
+git clone https://github.com/kaltura/unisphere-cli.git
+cd create-unisphere
+```
+
+Then run in the root directory:
+
+```bash
+npm run create-unisphere-project
+```
+
+⸻
+
+### 📦 Publishing
+
+After doing changes to the code, create a commit following the semantic versioning rules. And push it to the remote repository.
+
+Note that the commit must contain changes under the folder `packages/create-unisphere-project` to signal the ci to publish the package to npm.

package/_templates/unisphere-project/.changeset/README.md

@@ -0,0 +1,8 @@
+# Changesets
+
+Hello and welcome! This folder has been automatically generated by `@changesets/cli`, a build tool that works
+with multi-package repos, or single-package repos to help you version and publish your code. You can
+find the full documentation for it [in our repository](https://github.com/changesets/changesets)
+
+We have a quick list of common questions to get you started engaging with this project in
+[our documentation](https://github.com/changesets/changesets/blob/main/docs/common-questions.md)

package/_templates/unisphere-project/.changeset/config.json

@@ -0,0 +1,12 @@
+{
+  "$schema": "https://unpkg.com/@changesets/config@2.3.1/schema.json",
+  "changelog": "@changesets/cli/changelog",
+  "commit": false,
+  "fixed": [],
+  "linked": [],
+  "access": "restricted",
+  "baseBranch": "main",
+  "updateInternalDependencies": "patch",
+  "ignore": [],
+  "privatePackages": { "version": false, "tag": false }
+}

package/_templates/unisphere-project/.editorconfig

@@ -0,0 +1,13 @@
+# Editor configuration, see http://editorconfig.org
+root = true
+
+[*]
+charset = utf-8
+indent_style = space
+indent_size = 2
+insert_final_newline = true
+trim_trailing_whitespace = true
+
+[*.md]
+max_line_length = off
+trim_trailing_whitespace = false

package/_templates/unisphere-project/.eslintignore

@@ -0,0 +1 @@
+node_modules

package/_templates/unisphere-project/.eslintrc.json

@@ -0,0 +1,46 @@
+{
+  "root": true,
+  "ignorePatterns": ["**/*"],
+  "plugins": ["@nx"],
+  "overrides": [
+    {
+      "files": ["*.ts", "*.tsx", "*.js", "*.jsx"],
+      "rules": {
+        "@nx/enforce-module-boundaries": [
+          "error",
+          {
+            "enforceBuildableLibDependency": true,
+            "allow": [],
+            "depConstraints": [
+              {
+                "sourceTag": "*",
+                "onlyDependOnLibsWithTags": ["*"]
+              }
+            ]
+          }
+        ]
+      }
+    },
+    {
+      "files": ["*.ts", "*.tsx"],
+      "extends": ["plugin:@nx/typescript"],
+      "rules": {
+        "@typescript-eslint/no-empty-function": "off"
+      }
+    },
+    {
+      "files": ["*.js", "*.jsx"],
+      "extends": ["plugin:@nx/javascript"],
+      "rules": {}
+    },
+    {
+      "files": ["*.json"],
+      "parser": "jsonc-eslint-parser",
+      "rules": {
+        "@nx/dependency-checks": ["error", {
+          "ignoredFiles": ["**/vite.config.ts", "**/rollup.config.js"]
+        }]
+      }
+    }
+  ]
+}

package/_templates/unisphere-project/.github/workflows/_publish-artifacts.yml

@@ -0,0 +1,195 @@
+name: Shared Deployment Jobs
+
+on:
+  workflow_call:
+
+jobs:
+  prepare-runtimes:
+    runs-on: codebuild-ovp-unisphere-runner-${{ github.run_id }}-${{ github.attempt }}
+
+    outputs:
+      unisphereElementsArtifactsFolder: ${{ steps.prepare-runtimes.outputs.artifactsRootFolder }}
+      hasArtifacts: ${{ steps.prepare-runtimes.outputs.hasArtifacts }}
+      commit_sha: ${{ steps.capture_commit_sha.outputs.commit_sha }}
+    steps:
+      - name: Checkout Repo
+        uses: actions/checkout@v3
+        with:
+          ref: ${{ github.event_name == 'pull_request' && github.head_ref || github.ref }}
+          fetch-tags: true
+      - name: Setup Node.js
+        uses: actions/setup-node@v4
+        with:
+          node-version-file: '.nvmrc'
+      - name: Clean workspace
+        run: git reset --hard HEAD
+      - name: Clean npm cache
+        run: npm cache clean --force
+      - name: Install dependencies
+        run: npm ci --include=optional
+        env:
+          GIT_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+      - name: Prepare Unisphere Elements
+        id: prepare-runtimes
+        run: npx unisphere runtime publish prepare --verbose
+      - name: Capture Commit SHA
+        id: capture_commit_sha
+        run: echo "commit_sha=$(git rev-parse HEAD)" >> $GITHUB_ENV
+      - name: Set commit_sha as output
+        id: set_commit_sha
+        run: echo "commit_sha=${{ env.commit_sha }}" >> $GITHUB_OUTPUT
+      - uses: actions/upload-artifact@v4
+        id: upload-unisphere-elements-artifacts
+        with:
+          name: unisphere-elements
+          path: ${{ steps.prepare-runtimes.outputs.artifactsRootFolder }}
+          retention-days: 1
+
+  deploy-packages:
+    runs-on: codebuild-ovp-unisphere-runner-${{ github.run_id }}-${{ github.attempt }}
+    steps:
+      - name: Checkout Repo
+        uses: actions/checkout@v3
+        with:
+          ref: ${{ github.event_name == 'pull_request' && github.head_ref || github.ref }}
+          fetch-tags: true
+      - name: Setup Node.js
+        uses: actions/setup-node@v4
+        with:
+          node-version: 20
+      - name: Install dependencies
+        run: npm ci --include=optional
+        env:
+          GIT_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+      - name: Get NPM Token from AWS Secrets Manager
+        id: get-npm-token
+        run: |
+          NPM_TOKEN=$(aws secretsmanager get-secret-value --secret-id arn:aws:secretsmanager:eu-central-1:785328604905:secret:unisphere-secrets-um86Cs --query SecretString --output text | jq -r '."NPM_UNISPHERE_TOKEN"')
+          echo "NPM_TOKEN=$NPM_TOKEN" >> $GITHUB_ENV
+          # Debug token existence (safely)
+          echo "::debug::Token exists: $([ ! -z "$NPM_TOKEN" ] && echo 'true' || echo 'false')"
+      - name: Deploy to registry
+        run: npx unisphere package publish --verbose --githubToken ${{ secrets.GITHUB_TOKEN }} --npmToken ${{ env.NPM_TOKEN }} --branch "${{ github.event_name == 'pull_request' && github.head_ref || github.ref }}"
+
+  deploy-runtimes:
+    if: needs.prepare-runtimes.outputs.hasArtifacts == 'true'
+    needs: prepare-runtimes
+    runs-on: codebuild-ovp-unisphere-runner-${{ github.run_id }}-${{ github.attempt }}
+    strategy:
+      matrix:
+        envs_regions:
+          - { env: 'nvp1', region: 'us-east-1', accountid: '583352821080' }
+          - { env: 'frp2', region: 'eu-central-1', accountid: '082111255551' }
+          - { env: 'irp2', region: 'eu-west-1', accountid: '137576761235' }
+          - { env: 'nvq2', region: 'us-east-1', accountid: '383697330906' }
+      fail-fast: false
+
+    steps:
+      - name: Checkout Repo at specific commit
+        uses: actions/checkout@v3
+        with:
+          ref: ${{ needs.prepare-runtimes.outputs.commit_sha }}
+          fetch-tags: true
+      - name: Setup Node.js
+        uses: actions/setup-node@v4
+        with:
+          node-version: 20
+      - name: Install dependencies
+        run: npm ci --include=optional
+        env:
+          GIT_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+      - name: Download artifacts folder
+        uses: actions/download-artifact@v4
+        with:
+          name: unisphere-elements
+          path: ${{ needs.prepare-runtimes.outputs.unisphereElementsArtifactsFolder }}
+      - name: Sync S3 bucket
+        run: |
+          npx unisphere runtime publish execute \
+          --env ${{ matrix.envs_regions.env }} \
+          --aws-region '${{ matrix.envs_regions.region }}' \
+          --aws-arn 'arn:aws:iam::${{matrix.envs_regions.accountid }}:role/${{ matrix.envs_regions.env }}-unisphere-content-role' \
+          --artifacts-folder '${{ needs.prepare-runtimes.outputs.unisphereElementsArtifactsFolder }}' \
+          --verbose
+
+  prepare-applications:
+    runs-on: codebuild-ovp-unisphere-runner-${{ github.run_id }}-${{ github.attempt }}
+
+    outputs:
+      unisphereApplicationsArtifactsFolder: ${{ steps.prepare-applications.outputs.artifactsRootFolder }}
+      hasArtifacts: ${{ steps.prepare-applications.outputs.hasArtifacts }}
+      commit_sha: ${{ steps.capture_commit_sha.outputs.commit_sha }}
+    steps:
+      - name: Checkout Repo
+        uses: actions/checkout@v3
+        with:
+          ref: ${{ github.event_name == 'pull_request' && github.head_ref || github.ref }}
+          fetch-tags: true
+      - name: Setup Node.js
+        uses: actions/setup-node@v4
+        with:
+          node-version-file: '.nvmrc'
+      - name: Clean workspace
+        run: git reset --hard HEAD
+      - name: Clean npm cache
+        run: npm cache clean --force
+      - name: Install dependencies
+        run: npm ci --include=optional
+        env:
+          GIT_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+      - name: Prepare Unisphere Applications
+        id: prepare-applications
+        run: npx unisphere application publish prepare --verbose
+      - name: Capture Commit SHA
+        id: capture_commit_sha
+        run: echo "commit_sha=$(git rev-parse HEAD)" >> $GITHUB_ENV
+      - name: Set commit_sha as output
+        id: set_commit_sha
+        run: echo "commit_sha=${{ env.commit_sha }}" >> $GITHUB_OUTPUT
+      - uses: actions/upload-artifact@v4
+        id: upload-unisphere-applications-artifacts
+        with:
+          name: unisphere-applications
+          path: ${{ steps.prepare-applications.outputs.artifactsRootFolder }}
+          retention-days: 1
+
+  deploy-applications:
+    if: needs.prepare-applications.outputs.hasArtifacts == 'true'
+    needs: prepare-applications
+    runs-on: codebuild-ovp-unisphere-runner-${{ github.run_id }}-${{ github.attempt }}
+    strategy:
+      matrix:
+        envs_regions:
+          - { env: 'nvp1', region: 'us-east-1', accountid: '583352821080' }
+          - { env: 'frp2', region: 'eu-central-1', accountid: '082111255551' }
+          - { env: 'irp2', region: 'eu-west-1', accountid: '137576761235' }
+          - { env: 'nvq2', region: 'us-east-1', accountid: '383697330906' }
+      fail-fast: false
+
+    steps:
+      - name: Checkout Repo at specific commit
+        uses: actions/checkout@v3
+        with:
+          ref: ${{ needs.prepare-applications.outputs.commit_sha }}
+          fetch-tags: true
+      - name: Setup Node.js
+        uses: actions/setup-node@v4
+        with:
+          node-version: 20
+      - name: Install dependencies
+        run: npm ci --include=optional
+        env:
+          GIT_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+      - name: Download artifacts folder
+        uses: actions/download-artifact@v4
+        with:
+          name: unisphere-applications
+          path: ${{ needs.prepare-applications.outputs.unisphereApplicationsArtifactsFolder }}
+      - name: Sync S3 bucket
+        run: |
+          npx unisphere application publish execute \
+          --env ${{ matrix.envs_regions.env }} \
+          --aws-region '${{ matrix.envs_regions.region }}' \
+          --aws-arn 'arn:aws:iam::${{matrix.envs_regions.accountid }}:role/${{ matrix.envs_regions.env }}-unisphere-content-role' \
+          --artifacts-folder '${{ needs.prepare-applications.outputs.unisphereApplicationsArtifactsFolder }}' \
+          --verbose

package/_templates/unisphere-project/.github/workflows/cicd.yml

@@ -0,0 +1,55 @@
+name: CI/CD
+
+on:
+  push:
+    branches:
+      - main
+      - 'prerelease/**'
+
+jobs:
+  release:
+    name: Release
+    runs-on:
+      - codebuild-ovp-unisphere-runner-${{ github.run_id }}-${{ github.attempt }}
+      - instance-size:medium
+    outputs:
+      hasChangesets: ${{ steps.changesets.outputs.hasChangesets }}
+    steps:
+      - name: Check if part of prerelease or official release
+        id: check
+        run: |
+          if [ ! -f ".changeset/pre.json" ] && [ "${{ github.ref }}" != "refs/heads/main" ]; then
+            echo "not part of prerelease or official release, skipping job"
+            echo "::stop-commands::`date +%s`"
+            exit 0
+          fi
+
+      - name: Checkout Repo
+        uses: actions/checkout@v3
+
+      - name: Setup Node.js
+        uses: actions/setup-node@v4
+        with:
+          node-version-file: '.nvmrc'
+
+      - name: Install Dependencies
+        run: npm ci --include=optional
+        env:
+          GIT_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+
+      - name: Create Release Pull Request or Publish to npm
+        id: changesets
+        uses: changesets/action@v1
+        env:
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+
+      - name: Create release tags
+        if: steps.changesets.outputs.hasChangesets == 'false'
+        run: |
+          npx changeset tag
+          git push --follow-tags
+
+  publish-artifacts:
+    needs: release
+    if: needs.release.outputs.hasChangesets == 'false'
+    uses: ./.github/workflows/_publish-artifacts.yml

package/_templates/unisphere-project/.nvmrc

@@ -0,0 +1 @@
+24

package/_templates/unisphere-project/.prettierignore

@@ -0,0 +1,5 @@
+# Add files here to ignore them from prettier formatting
+/dist
+/coverage
+/.nx/cache
+/.nx/workspace-data

package/_templates/unisphere-project/.prettierrc

@@ -0,0 +1,3 @@
+{
+  "singleQuote": true
+}

package/_templates/unisphere-project/.unisphere

@@ -0,0 +1,11 @@
+{
+  "company": "{{company-name|lower-dash-case}}",
+  "type": "widget",
+  "name": "{{project-name|lower-dash-case}}",
+  "schemaVersion": "1.0.0",
+  "elements": {
+    "applications": {},
+    "runtimes": {},
+    "packages": {}
+  }
+}

package/_templates/unisphere-project/README.md

@@ -0,0 +1 @@
+# Unisphere {{company-name|human-readable}} {{project-name|human-readable}}

package/_templates/unisphere-project/jest.config.ts

@@ -0,0 +1,5 @@
+import { getJestProjectsAsync } from '@nx/jest';
+
+export default async () => ({
+  projects: await getJestProjectsAsync(),
+});

package/_templates/unisphere-project/jest.preset.js

@@ -0,0 +1,3 @@
+const nxPreset = require('@nx/jest/preset').default;
+
+module.exports = { ...nxPreset };

package/_templates/unisphere-project/nx.json

@@ -0,0 +1,76 @@
+{
+  "$schema": "./node_modules/nx/schemas/nx-schema.json",
+  "namedInputs": {
+    "default": ["{projectRoot}/**/*", "sharedGlobals"],
+    "production": [
+      "default",
+      "!{projectRoot}/.eslintrc.json",
+      "!{projectRoot}/eslint.config.js",
+      "!{projectRoot}/**/?(*.)+(spec|test).[jt]s?(x)?(.snap)",
+      "!{projectRoot}/tsconfig.spec.json",
+      "!{projectRoot}/jest.config.[jt]s",
+      "!{projectRoot}/src/test-setup.[jt]s",
+      "!{projectRoot}/test-setup.[jt]s",
+      "!{projectRoot}/**/*.stories.@(js|jsx|ts|tsx|mdx)",
+      "!{projectRoot}/.storybook/**/*",
+      "!{projectRoot}/tsconfig.storybook.json"
+    ],
+    "sharedGlobals": []
+  },
+  "plugins": [
+    {
+      "plugin": "@nx/eslint/plugin",
+      "options": {
+        "targetName": "lint"
+      }
+    },
+    {
+      "plugin": "@nx/rollup/plugin",
+      "options": {
+        "buildTargetName": "build"
+      }
+    },
+    {
+      "plugin": "@nx/vite/plugin",
+      "options": {
+        "buildTargetName": "build",
+        "testTargetName": "test",
+        "serveTargetName": "serve",
+        "previewTargetName": "preview",
+        "serveStaticTargetName": "serve-static"
+      }
+    },
+    {
+      "plugin": "@nx/webpack/plugin",
+      "options": {
+        "buildTargetName": "build",
+        "serveTargetName": "serve",
+        "previewTargetName": "preview"
+      }
+    },
+    {
+      "plugin": "@nx/jest/plugin",
+      "options": {
+        "targetName": "test"
+      }
+    }  
+  ],
+  "generators": {
+    "@nx/react": {
+      "library": {
+        "style": "css",
+        "linter": "eslint",
+        "unitTestRunner": "vitest"
+      },
+      "application": {
+        "babel": true,
+        "style": "css",
+        "linter": "eslint",
+        "bundler": "webpack"
+      },
+      "component": {
+        "style": "css"
+      }
+    }
+  }
+}