Update README and plugin documentation to reflect integration of ChatGPT and Codex; increment plugin versions for cwb-app-icon, cwb-local-build, cwb-ship, and cwb-theming.

2026-09-14 20:17:15 +08:00 · 2026-07-12 09:16:02 -05:00
parent 61f709e7f3
commit a2555edf56
7 changed files with 43 additions and 24 deletions
@@ -4,7 +4,7 @@ Professional agent skills and plugins to help mobile developers ship better apps

 ## Overview

-This repository contains a curated collection of Claude agent skills designed specifically for React Native and Expo developers. Each skill automates complex workflows, follows best practices, and helps you build production-ready mobile apps with confidence.
+This repository contains a curated collection of ChatGPT, Codex, and Claude agent skills designed specifically for React Native and Expo developers. Each skill automates complex workflows, follows best practices, and helps you build production-ready mobile apps with confidence.

 ## Available Plugins

@@ -104,7 +104,12 @@ Add this repo as a plugin marketplace from the Codex CLI:
 codex plugin marketplace add Code-with-Beto/skills
 ```

-Then restart the ChatGPT desktop app, open **Plugins** under Work or Codex, pick the **Code with Beto** marketplace, and install the plugins you want.
+Then install the plugins from the **Code with Beto** marketplace:
+
+- In Codex CLI, run `/plugins`, install the plugin, and start a new session.
+- In the ChatGPT desktop app, restart the app, open **Plugins** under Work or Codex, choose **Code with Beto**, and install the plugins you want.
+
+Each plugin includes a Codex manifest at `.codex-plugin/plugin.json`; the repo marketplace is defined at `.agents/plugins/marketplace.json`.

 ### Claude Code

@@ -140,7 +145,7 @@ npx skills add code-with-beto/skills/plugins/cwb-theming

 ## How It Works

-These skills integrate with Claude Code to provide contextual, automated workflows. When you describe what you need, Claude will:
+These skills integrate with ChatGPT, Codex, Claude Code, and other compatible agents to provide contextual, automated workflows. When you describe what you need, the agent will:

 1. Detect which skill is relevant to your task
 2. Execute the appropriate workflow automatically
@@ -1,6 +1,6 @@
 {
  "name": "cwb-app-icon",
-  "version": "1.0.1",
+  "version": "1.0.2",
  "description": "AI-powered app icon generation for React Native and Expo apps, with iOS 26 Liquid Glass and Android adaptive icon support.",
  "author": {
    "name": "Beto",
@@ -18,6 +18,10 @@
    "longDescription": "Generate professional app icons using AI (powered by SnapAI CLI) and configure them automatically for iOS and Android. Supports the iOS 26 .icon folder format with Liquid Glass effects, Android adaptive icons with Material You theming, and multiple style options like minimalism, glassy, gradient, and neon.",
    "developerName": "Code with Beto",
    "category": "Developer Tools",
+    "capabilities": [
+      "Read",
+      "Write"
+    ],
    "websiteURL": "https://codewithbeto.dev",
    "defaultPrompt": [
      "Generate a new app icon for my Expo app",
@@ -79,13 +79,13 @@ If you want to try different styles:
 ## Requirements

 - Node.js and npm/npx
- OpenAI API key (costs ~$0.04 per icon)
+- OpenAI API key (provider usage charges apply)
 - Expo project with app.json
 - SnapAI CLI (automatically used via npx)

 ## About SnapAI

-[SnapAI](https://github.com/betomoedano/snapai) is a free, open-source CLI built by the [Code with Beto](https://codewithbeto.dev) team. It uses your own OpenAI API key to generate icons — the only cost is standard OpenAI API usage (~$0.04 per icon). Your API key is stored in a local config file on your machine (`~/.snapai/config.json`) and is sent directly to OpenAI's API. SnapAI ships no telemetry, has no backend server, and collects zero data; credentials never leave your device.
+[SnapAI](https://github.com/betomoedano/snapai) is a free, open-source CLI built by the [Code with Beto](https://codewithbeto.dev) team. It uses your own provider API key to generate icons, with provider usage billed to your account. The key can be stored in a local config file (`~/.snapai/config.json`) or supplied through an environment variable. SnapAI ships no telemetry and has no intermediary backend.

 ## License

@@ -10,7 +10,7 @@ Generate professional app icons using AI and configure them for both iOS (with i

 ## Step 0: Verify SnapAI Setup (CRITICAL - DO THIS FIRST)

-[SnapAI](https://github.com/betomoedano/snapai) is a free, open-source CLI built by the [Code with Beto](https://codewithbeto.dev) team. It calls OpenAI's image API directly using your personal API key, which is stored locally at `~/.snapai/config.json`. SnapAI ships no telemetry, has no backend server, and collects zero data — your credentials never leave your device.
+[SnapAI](https://github.com/betomoedano/snapai) is a free, open-source CLI built by the [Code with Beto](https://codewithbeto.dev) team. It calls the selected image provider directly using the user's API key. A key can be stored locally at `~/.snapai/config.json` or supplied through an environment variable. SnapAI ships no telemetry and has no backend server.

 **Before attempting to generate icons, check if SnapAI is configured:**

@@ -21,18 +21,18 @@ npx snapai config --show

 2. **If the config check fails or shows no API key:**
   - SnapAI requires an OpenAI API key to generate icons
-   - Each icon costs approximately $0.04 via OpenAI's image generation API
   - Ask the user: "SnapAI requires an OpenAI API key. Do you have one, or would you like me to help you set it up?"

 3. **If the user has an API key:**
-   - Ask them to provide it securely
-   - Configure it for them with:
+   - Never ask the user to paste the secret into chat, source code, or a command you will run
+   - Ask them to configure it locally in their own terminal with:
   ```bash
-   snapai config --api-key <their-api-key>
+   npx snapai config --openai-api-key "<their-api-key>"
   ```
-   - Verify the setup worked:
+   - Alternatively, they can set `SNAPAI_API_KEY` or `OPENAI_API_KEY` in their shell or secret manager
+   - After the user confirms setup is complete, verify it without printing the secret:
   ```bash
-   snapai config --show
+   npx snapai config --show
   ```

 4. **If the user needs to get an API key:**
@@ -42,15 +42,13 @@ npx snapai config --show
     2. Navigate to API keys section
     3. Click 'Create new secret key'
     4. Copy the key (starts with 'sk-')
-     5. Come back here and provide it to me"
-   - Once they provide the key, configure it using the command above
+     5. Configure it locally without sharing it in chat"

 **Important Notes:**
- SnapAI is open source — your API key is stored in a local config file and sent directly to OpenAI. No intermediary servers, no data collection.
- The tool itself is free; you only pay standard OpenAI API costs (~$0.04 per icon).
+- SnapAI is open source. API requests go directly to the selected provider; the tool has no intermediary backend.
+- The tool itself is free; provider API usage is billed according to the user's provider account.
 - Do NOT proceed with icon generation if SnapAI is not configured
- The key must start with "sk-" to be valid
- You can handle the configuration for the user - just ask for their API key
+- Do not expose credentials in chat, command output, logs, or committed files

 ## Step 1: Understand the App Context
 - Read the `app.json` to understand the app name and current icon configuration
@@ -258,8 +256,8 @@ npx expo run:android
 ## Troubleshooting

 ### SnapAI Configuration Issues
- **"No API key found"** - Run `snapai config --api-key <key>` to set it up
- **"Invalid API key"** - Verify the key starts with "sk-" and is copied correctly from OpenAI
+- **"No API key found"** - Ask the user to run `npx snapai config --openai-api-key "<key>"` locally, or set `SNAPAI_API_KEY` / `OPENAI_API_KEY`
+- **"Invalid API key"** - Ask the user to verify or rotate the key in their OpenAI account without sharing it in chat
 - **Authentication errors** - Check if the API key has been revoked or has insufficient credits at platform.openai.com
 - **Command not found** - Ensure you're using `npx snapai` (not just `snapai`)

@@ -1,6 +1,6 @@
 {
  "name": "cwb-local-build",
-  "version": "1.0.0",
+  "version": "1.0.1",
  "description": "Build release APK and simulator .app artifacts locally for Expo apps using gradlew and xcodebuild directly.",
  "author": {
    "name": "Beto",
@@ -18,6 +18,10 @@
    "longDescription": "Generate release .apk and simulator .app artifacts for your Expo project using gradlew and xcodebuild directly. Reads your app config to pull the app name, slug, scheme, and bundle identifier, writes ready-to-run build scripts, and copies each artifact into builds/ for predictable install paths. Great for e2e testing (Maestro, Detox) and sharing builds without a dev server.",
    "developerName": "Code with Beto",
    "category": "Developer Tools",
+    "capabilities": [
+      "Read",
+      "Write"
+    ],
    "websiteURL": "https://codewithbeto.dev",
    "defaultPrompt": [
      "Build a release APK for my Expo app locally",
@@ -1,6 +1,6 @@
 {
  "name": "cwb-ship",
-  "version": "1.0.0",
+  "version": "1.0.1",
  "description": "Scaffold production-ready React Native apps from Code with Beto templates using the @codewithbeto/ship CLI.",
  "author": {
    "name": "Beto",
@@ -18,6 +18,10 @@
    "longDescription": "One-command project scaffolding with bunx @codewithbeto/ship. Ships the battle-tested Platano template with pre-configured RevenueCat payments, automatic app name, bundle ID and slug configuration, dependency installation, and git initialization out of the box.",
    "developerName": "Code with Beto",
    "category": "Developer Tools",
+    "capabilities": [
+      "Read",
+      "Write"
+    ],
    "websiteURL": "https://cwb.sh/platano",
    "defaultPrompt": [
      "Scaffold a new React Native app with the ship CLI",
@@ -1,6 +1,6 @@
 {
  "name": "cwb-theming",
-  "version": "1.0.0",
+  "version": "1.0.1",
  "description": "Scaffold a unified cross-platform color theme system (native iOS + Android Material You) into an Expo Router app.",
  "author": {
    "name": "Beto",
@@ -18,6 +18,10 @@
    "longDescription": "Set up one color system that works on iOS and Android at once. Semantic tokens (background, text, link, ...) resolve to native iOS colors and Android Material You dynamic colors, flip with dark/light mode automatically, and are read through a single useColors() hook. Same theming pattern as the Platano template.",
    "developerName": "Code with Beto",
    "category": "Developer Tools",
+    "capabilities": [
+      "Read",
+      "Write"
+    ],
    "websiteURL": "https://codewithbeto.dev",
    "defaultPrompt": [
      "Set up theming and dark mode in my Expo app",