Merge pull request #9 from DoktorShift/deploy

Apps + Plugins + Community Skills + Deployment prepare

Author: DoktorShift

.github/workflows/deploy.yml

@@ -0,0 +1,55 @@
+name: Deploy to GitHub Pages
+
+on:
+  push:
+    branches: [main]
+  workflow_dispatch:
+  schedule:
+    - cron: '0 6 * * 1' # Rebuild every Monday 6am UTC (picks up new extension READMEs, releases)
+
+permissions:
+  contents: read
+  pages: write
+  id-token: write
+
+concurrency:
+  group: pages
+  cancel-in-progress: false
+
+jobs:
+  build:
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v4
+
+      - uses: actions/setup-node@v4
+        with:
+          node-version: 20
+          cache: npm
+
+      - run: npm ci
+
+      - name: Generate extension pages
+        run: node scripts/generate-extension-pages.mjs
+        env:
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+
+      - name: Generate LLM files
+        run: npm run generate:llm
+
+      - name: Build VitePress
+        run: npm run docs:build
+
+      - uses: actions/upload-pages-artifact@v3
+        with:
+          path: docs/.vitepress/dist
+
+  deploy:
+    needs: build
+    runs-on: ubuntu-latest
+    environment:
+      name: github-pages
+      url: ${{ steps.deployment.outputs.page_url }}
+    steps:
+      - id: deployment
+        uses: actions/deploy-pages@v4

.gitignore

@@ -26,3 +26,5 @@ Thumbs.db
 # Build artifacts
 .turbo/
 .parcel-cache/
+
+deploy_plan.md

.node-version

@@ -0,0 +1 @@
+20

README.md

@@ -11,6 +11,7 @@ Official documentation for [LNbits](https://github.com/lnbits/lnbits), the free
 - **Developer Guide** - Architecture, building extensions, deploying, contributing
 - **Extensions** - 62 extension pages with docs and API references
 - **LLM Integration** - Agent-ready docs, system prompts, llms.txt
+- **Skills to Built** - Create own Skill.md files or use existing ones from Core Team and Community to built awesome stuff
 
 ## Local development
 

docs/.vitepress/config.mjs

@@ -131,7 +131,8 @@ export default withMermaid(defineConfig({
         ],
       },
       { text: 'Extensions', link: '/extensions/' },
-      { text: 'Apps', link: '/apps/tpos-wrapper' },
+      { text: 'Apps', link: '/apps/' },
+      { text: 'Plugins', link: '/plugins/' },
       { text: 'Contribute', link: '/contribute/' },
       {
         text: 'Developers',
@@ -486,23 +487,52 @@ export default withMermaid(defineConfig({
           ],
         },
         {
-          text: 'Available Skills',
+          text: 'Official Skills',
           collapsed: false,
           items: [
             { text: 'Wallet & Payments', link: '/llm/skills/wallet-payments' },
             { text: 'Lightning Address', link: '/llm/skills/lnurlp-pay-links' },
             { text: 'Shared Wallet (Uncle Jim)', link: '/llm/skills/shared-wallet' },
           ],
         },
+        {
+          text: 'Community Skills',
+          collapsed: false,
+          items: [
+            { text: 'Coming soon' },
+          ],
+        },
       ],
       '/apps/': [
         {
           text: 'Companion Apps',
+          items: [
+            { text: 'Overview', link: '/apps/' },
+          ],
+        },
+        {
+          text: 'Apps',
+          collapsed: false,
           items: [
             { text: 'TPoS Wrapper', link: '/apps/tpos-wrapper' },
           ],
         },
       ],
+      '/plugins/': [
+        {
+          text: 'eCommerce Plugins',
+          items: [
+            { text: 'Overview', link: '/plugins/' },
+          ],
+        },
+        {
+          text: 'Plugins',
+          collapsed: false,
+          items: [
+            { text: 'WooCommerce', link: '/plugins/woocommerce' },
+          ],
+        },
+      ],
     },
 
     socialLinks: [

docs/.vitepress/theme/components/ContributePage.vue

@@ -75,6 +75,12 @@ const faqOpen = ref(new Set())
 
 const roleData = {
   developer: {
+    intro: {
+      kicker: 'START BUILDING',
+      headline: 'Write code that powers Lightning for thousands',
+      sub: 'Pick a good first issue, set up FakeWallet, and ship your first PR. The codebase is Python + FastAPI on the backend, Vue 3 + Quasar on the frontend.',
+      cta: { label: 'Browse good first issues', url: 'https://github.com/lnbits/lnbits/labels/good%20first%20issue' },
+    },
     video: null,
     steps: [
       {
@@ -123,6 +129,12 @@ const roleData = {
     ],
   },
   tester: {
+    intro: {
+      kicker: 'BREAK THINGS',
+      headline: 'Every bug you catch saves a merchant',
+      sub: 'Test pull requests, try every release, and report what breaks. Use FakeWallet locally or spin up a live instance on my.lnbits.com in under 3 minutes.',
+      cta: { label: 'View open PRs to test', url: 'https://github.com/lnbits/lnbits/pulls?q=is%3Apr+is%3Aopen+label%3Aneeds-testing' },
+    },
     video: null,
     steps: [
       {
@@ -199,6 +211,12 @@ const roleData = {
     ],
   },
   writer: {
+    intro: {
+      kicker: 'TELL THE STORY',
+      headline: 'Your words bring people closer to Bitcoin',
+      sub: 'Pick an open issue in the docs or blog and start writing. No technical background needed. The best content comes from real experience.',
+      cta: { label: 'Browse docs issues', url: 'https://github.com/DoktorShift/docs_lnbits/issues' },
+    },
     video: null,
     steps: [
       {
@@ -275,6 +293,12 @@ const roleData = {
     ],
   },
   designer: {
+    intro: {
+      kicker: 'MAKE IT SHINE',
+      headline: 'Design the interface people trust',
+      sub: 'Shape the LNbits UI with Vue 3 and Quasar, create visuals for marketing, or redesign extension flows. When it looks good, people trust it.',
+      cta: { label: 'See design issues', url: 'https://github.com/lnbits/lnbits/issues?q=is%3Aissue+is%3Aopen+label%3Adesign' },
+    },
     video: null,
     steps: [
       {
@@ -344,6 +368,12 @@ const roleData = {
     ],
   },
   entrepreneur: {
+    intro: {
+      kicker: 'BUILD YOUR BUSINESS',
+      headline: 'Turn LNbits into your product',
+      sub: 'Deploy for your community, white-label it, sell extensions, or run it as a service. LNbits is the platform - you decide the business model.',
+      cta: { label: 'Launch a SaaS instance', url: 'https://my.lnbits.com' },
+    },
     video: null,
     blog: {
       title: 'How to set up your own LNbits server',
@@ -402,6 +432,12 @@ const roleData = {
     ],
   },
   ambassador: {
+    intro: {
+      kicker: 'LEAD THE CHARGE',
+      headline: 'Bring Lightning to your community',
+      sub: 'Deploy LNbits, onboard merchants, host meetups, and spread the word. You are the bridge between Bitcoin and everyday commerce.',
+      cta: { label: 'Get the install guide', url: '/guide/installation/' },
+    },
     video: { id: 'ZTjFalYeOlA', title: 'LNbits Extensions Deep-Dive' },
     steps: [
       {
@@ -789,6 +825,21 @@ onUnmounted(() => {
     <Transition name="cp-fade" mode="out-in">
       <div :key="activeRole" class="cp-flow">
 
+        <!-- Role intro -->
+        <section v-if="active.intro" class="cp-role-intro">
+          <div class="cp-w">
+            <div class="cp-role-intro-inner">
+              <span class="cp-role-kicker">{{ active.intro.kicker }}</span>
+              <h2 class="cp-role-headline">{{ active.intro.headline }}</h2>
+              <p class="cp-role-sub">{{ active.intro.sub }}</p>
+              <a v-if="active.intro.cta" :href="active.intro.cta.url" class="cp-role-cta" :target="active.intro.cta.url.startsWith('http') ? '_blank' : undefined" :rel="active.intro.cta.url.startsWith('http') ? 'noopener noreferrer' : undefined">
+                {{ active.intro.cta.label }}
+                <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12h14"/><path d="M12 5l7 7-7 7"/></svg>
+              </a>
+            </div>
+          </div>
+        </section>
+
         <!-- Video -->
         <section v-if="active.video" class="cp-vid-sec">
           <div class="cp-w">
@@ -1215,6 +1266,41 @@ onUnmounted(() => {
 .cp-featured:hover .cp-featured-arr { color: var(--vp-c-brand-1); }
 
 /* ═══ Steps ═══ */
+/* ═══ Role Intro ═══ */
+.cp-role-intro { padding: 48px 0 32px; }
+.cp-role-intro-inner {
+  max-width: 640px; margin: 0 auto; text-align: center;
+}
+.cp-role-kicker {
+  display: inline-block;
+  font-size: 11px; font-weight: 700; letter-spacing: 2px; text-transform: uppercase;
+  color: var(--vp-c-brand-1);
+  margin-bottom: 12px;
+}
+.cp-role-headline {
+  font-size: 28px; font-weight: 800; line-height: 1.2;
+  color: var(--vp-c-text-1);
+  margin: 0 0 16px;
+}
+.cp-role-sub {
+  font-size: 15px; line-height: 1.65; color: var(--vp-c-text-2);
+  margin: 0 0 24px;
+}
+.cp-role-cta {
+  display: inline-flex; align-items: center; gap: 6px;
+  padding: 10px 24px;
+  font-size: 14px; font-weight: 600;
+  color: var(--vp-c-white); background: var(--vp-c-brand-1);
+  border-radius: 8px; text-decoration: none;
+  transition: background .2s ease, transform .15s ease;
+}
+.cp-role-cta:hover {
+  background: var(--vp-c-brand-2);
+  transform: translateY(-1px);
+}
+.cp-role-cta svg { transition: transform .2s ease; }
+.cp-role-cta:hover svg { transform: translateX(3px); }
+
 .cp-flow { padding-bottom: 24px; }
 .cp-step { position: relative; }
 .cp-step-line { height: 1px; background: linear-gradient(to right, transparent, var(--vp-c-divider) 15%, var(--vp-c-divider) 85%, transparent); }
@@ -1425,6 +1511,12 @@ onUnmounted(() => {
   .cp-title { font-size: 1.6rem; letter-spacing: -.03em; margin-bottom: 12px; }
   .cp-sub { font-size: 0.95rem; max-width: 100%; line-height: 1.7; }
 
+  /* Role intro */
+  .cp-role-intro { padding: 32px 0 24px; }
+  .cp-role-headline { font-size: 22px; }
+  .cp-role-sub { font-size: 14px; }
+  .cp-role-cta { font-size: 13px; padding: 9px 20px; }
+
   /* Contributors carousel */
   .cp-contributors { padding: 0 0 32px; }
   .cp-contrib-label { font-size: 12px; margin-bottom: 14px; }

docs/.vitepress/theme/components/MegaMenu.vue

@@ -40,7 +40,7 @@ const columns = [
         items: [
           { name: 'Wallet Backends', desc: '20+ funding sources', link: '/guide/wallets/', icon: 'wallet' },
           { name: 'Core Features', desc: 'Payments, LNURL, labels', link: '/guide/core/', icon: 'zap' },
-          { name: 'Extensions', desc: '60+ plugins', link: '/guide/using-extensions', icon: 'puzzle' },
+          { name: 'Extensions', desc: '60+ extensions', link: '/guide/using-extensions', icon: 'puzzle' },
           { name: 'Admin Dashboard', desc: 'Server management', link: '/guide/admin-dashboard', icon: 'settings' },
           { name: 'User Management', desc: 'Roles & permissions', link: '/guide/core/user-management/', icon: 'users' },
           { name: 'FAQ', desc: '80+ common questions', link: '/guide/faq/', icon: 'help' },
@@ -121,13 +121,19 @@ const columns = [
       {
         heading: 'Extensions',
         items: [
-          { name: 'Browse Extensions', desc: '60+ plugins ready to use', link: '/extensions/', icon: 'puzzle' },
+          { name: 'Browse Extensions', desc: '60+ extensions ready to use', link: '/extensions/', icon: 'puzzle' },
         ],
       },
       {
         heading: 'Companion Apps',
         items: [
-          { name: 'TPoS Wrapper', desc: 'Android Tap to Pay', link: '/apps/tpos-wrapper', icon: 'zap' },
+          { name: 'Browse Apps', desc: 'Standalone apps for LNbits', link: '/apps/', icon: 'zap' },
+        ],
+      },
+      {
+        heading: 'eCommerce Plugins',
+        items: [
+          { name: 'Browse Plugins', desc: 'WooCommerce, Shopify and more', link: '/plugins/', icon: 'shopping-cart' },
         ],
       },
       {
@@ -196,6 +202,7 @@ const columns = [
                   <svg v-if="item.icon==='shield'" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10z"/></svg>
                   <svg v-if="item.icon==='plus'" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><line x1="12" y1="5" x2="12" y2="19"/><line x1="5" y1="12" x2="19" y2="12"/></svg>
                   <svg v-if="item.icon==='layers'" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polygon points="12 2 2 7 12 12 22 7 12 2"/><polyline points="2 17 12 22 22 17"/><polyline points="2 12 12 17 22 12"/></svg>
+                  <svg v-if="item.icon==='shopping-cart'" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="9" cy="21" r="1"/><circle cx="20" cy="21" r="1"/><path d="M1 1h4l2.68 13.39a2 2 0 002 1.61h9.72a2 2 0 002-1.61L23 6H6"/></svg>
                   <svg v-if="item.icon==='database'" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><ellipse cx="12" cy="5" rx="9" ry="3"/><path d="M21 12c0 1.66-4 3-9 3s-9-1.34-9-3"/><path d="M3 5v14c0 1.66 4 3 9 3s9-1.34 9-3V5"/></svg>
                   <svg v-if="item.icon==='code'" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="16 18 22 12 16 6"/><polyline points="8 6 2 12 8 18"/></svg>
                   <svg v-if="item.icon==='clock'" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="10"/><polyline points="12 6 12 12 16 14"/></svg>

docs/.vitepress/theme/components/NavSwitch.vue

@@ -5,12 +5,14 @@ import MegaMenu from './MegaMenu.vue'
 
 const route = useRoute()
 const isIndex = computed(() => route.path === '/' || route.path === '/index.html')
+const isContribute = computed(() => route.path.startsWith('/contribute'))
 
 const sections = [
   { text: 'Guide', link: '/guide/', match: '/guide' },
   { text: 'API', link: '/api/', match: '/api' },
   { text: 'Extensions', link: '/extensions/', match: '/extensions' },
-  { text: 'Apps', link: '/apps/tpos-wrapper', match: '/apps' },
+  { text: 'Apps', link: '/apps/', match: '/apps' },
+  { text: 'Plugins', link: '/plugins/', match: '/plugins' },
   { text: 'Developers', link: '/dev/architecture', match: '/dev' },
   { text: 'LLM', link: '/llm/', match: '/llm' },
   { text: 'Contribute', link: '/contribute/', match: '/contribute' },
@@ -24,10 +26,10 @@ const activeSection = computed(() => {
 })
 
 function syncClass() {
-  document.body.classList.toggle('has-section-bar', !isIndex.value)
+  document.body.classList.toggle('has-section-bar', !isIndex.value && !isContribute.value)
 }
 
-watch(isIndex, syncClass)
+watch([isIndex, isContribute], syncClass)
 onMounted(syncClass)
 onUnmounted(() => document.body.classList.remove('has-section-bar'))
 </script>
@@ -38,7 +40,7 @@ onUnmounted(() => document.body.classList.remove('has-section-bar'))
 
   <!-- Doc pages: section bar below header -->
   <Teleport to="body">
-    <nav v-if="!isIndex" class="sb" aria-label="Section navigation">
+    <nav v-if="!isIndex && !isContribute" class="sb" aria-label="Section navigation">
       <div class="sb-inner">
         <a
           v-for="s in sections"