Feat: Advanced Story controls "Pro panel" with presets and presets sharing implemented along with UI/UX updated as recommended

.github/pull_request_template.md

@@ -1,17 +1,21 @@
 > **IMPORTANT:** Read this entire template and follow it fully.  
-> Pull requests that do **not** follow this template may be **closed and marked as blocked** until updated.
+> Pull requests that do **not** follow this template may be **closed and marked as blocked** until
+> updated.
 
 ---
+
 ## Description
 
 **Issue Reference (e.g. Fixes #123):** ---
 
 **Summary of Changes (high-level):**
+
 - What did you change?
 - Why was this change needed?
 - Which part of the system is impacted (AI, Web, Smart Contracts, Docs, Infra, etc.)?
 
 **Context / Motivation:**
+
 - What problem or use case does this PR solve?
 - Any relevant discussion, issue, or design doc links?
 
@@ -38,33 +42,41 @@ Select the relevant categories:
 Tick everything that applies. Leave non‑applicable items unchecked.
 
 **AI / Application Logic**
+
 - [ ] I tested story generation end‑to‑end with a valid `GROQ_API_KEY`.
 - [ ] I verified that prompts, model names, and parameters are up to date with current Groq APIs.
-- [ ] I confirmed that error states and empty responses are handled gracefully (no unhandled exceptions).
+- [ ] I confirmed that error states and empty responses are handled gracefully (no unhandled
+      exceptions).
 
 **Web3 / Smart Contracts**
+
 - [ ] I verified contract logic on the **Monad Testnet** (deploy + basic flows).
 - [ ] I ran the smart contract tests in `smart_contracts` and they passed.
-- [ ] I checked for potential reentrancy / overflow / access‑control issues in new or edited contracts.
+- [ ] I checked for potential reentrancy / overflow / access‑control issues in new or edited
+      contracts.
 
 **Frontend / UX / Accessibility**
+
 - [ ] My changes follow the **Progressive Disclosure** (accordion / step‑based) UX where applicable.
 - [ ] I verified the UI in **light and dark mode**.
 - [ ] I checked keyboard navigation and focus states for interactive elements I touched.
 - [ ] I ensured accessible labels (`aria-*`, alt text) and semantic HTML for new UI.
 
 **Backend / Database**
+
 - [ ] I ran backend startup locally without runtime errors.
 - [ ] I validated new API routes with both success and failure cases.
 - [ ] I considered database performance (indexes, query filters) for any new queries.
 - [ ] I confirmed that new logic respects existing retry/health‑check behavior where relevant.
 
 **Security & Privacy**
+
 - [ ] No API keys, private keys, secrets, or `.env` files are committed.
 - [ ] I avoided logging sensitive data (tokens, secrets, full payloads with PII).
 - [ ] I considered common web vulnerabilities (XSS, CSRF, SSRF, injection) in my changes.
 
 **Code Quality**
+
 - [ ] I ran `npm run lint` (or equivalent) and resolved reported issues.
 - [ ] I ran available tests for the areas I changed (frontend, backend, or contracts).
 - [ ] I kept functions/components focused and avoided large “god” modules where possible.
@@ -95,7 +107,9 @@ If this PR affects UI flows, also describe the manual test steps you followed.
 
 ## Visual Proof (for UI / UX changes)
 
-> Required for all visual changes. Attach screenshots or a short screen recording (GIF / video) that clearly shows:
+> Required for all visual changes. Attach screenshots or a short screen recording (GIF / video) that
+> clearly shows:
+>
 > - Before vs After (if applicable)
 > - Different breakpoints (mobile + desktop)
 > - Light and dark mode if supported
@@ -117,23 +131,30 @@ Tick all that apply to you for this PR:
 ## Review & Impact
 
 **Breaking Changes**
+
 - [ ] This PR introduces a breaking change (API / contract / DB).
 - [ ] If yes, I have documented migration steps in the description above.
 
 **Dependencies**
+
 - [ ] I added or upgraded dependencies.
 - [ ] I explained why these dependencies are needed and checked for license compatibility.
 
 **Backward Compatibility / Migrations**
+
 - [ ] Existing users can continue using GroqTales without manual steps.
-- [ ] If a migration is required, steps are clearly described (DB migrations, contract redeploys, etc.).
+- [ ] If a migration is required, steps are clearly described (DB migrations, contract redeploys,
+      etc.).
 
 ---
 
 ## Final Acknowledgements (Mandatory or will be marked invalid)
 
 You must check all of the following before requesting review. These are **required**:
 
-- [ ] **I confirm that the information and code in this PR are my original work or appropriately credited, and I have the right to contribute them under this repository’s license.**
-- [ ] **I understand that by submitting this PR, I take full responsibility and accountability for the changes I am proposing.**
-- [ ] **I have read and agree to follow the project’s Code of Conduct, Security Policy, and Contribution Guidelines for all discussions and follow‑up on this PR.**
+- [ ] **I confirm that the information and code in this PR are my original work or appropriately
+      credited, and I have the right to contribute them under this repository’s license.**
+- [ ] **I understand that by submitting this PR, I take full responsibility and accountability for
+      the changes I am proposing.**
+- [ ] **I have read and agree to follow the project’s Code of Conduct, Security Policy, and
+      Contribution Guidelines for all discussions and follow‑up on this PR.**

.github/workflows/dependency-review.yml

@@ -17,4 +17,4 @@ jobs:
         uses: actions/dependency-review-action@v4
         with:
           fail-on-severity: high
-          comment-summary-in-pr: false
+          comment-summary-in-pr: false

.github/workflows/deployment.yml

@@ -48,25 +48,34 @@ jobs:
           NEXT_PUBLIC_SPLASH_IMAGE_URL: 'https://groqtales.xyz/splash.jpg'
           NEXT_PUBLIC_SPLASH_BACKGROUND_COLOR: '#1a1a2e'
 
+      - name: Install Wrangler
+        run: npm install -g wrangler@3.99.0
+
       - name: Deploy to Cloudflare Pages
-        uses: cloudflare/wrangler-action@v3
-        with:
-          apiToken: ${{ secrets.CLOUDFLARE_API_TOKEN }}
-          accountId: ${{ secrets.CLOUDFLARE_ACCOUNT_ID }}
-          command: pages deploy out --project-name=groqtales --branch=main
+        run: wrangler pages deploy --project-name=groqtales --branch=main
+        env:
+          CLOUDFLARE_API_TOKEN: ${{ secrets.CLOUDFLARE_API_TOKEN }}
+          CLOUDFLARE_ACCOUNT_ID: ${{ secrets.CLOUDFLARE_ACCOUNT_ID }}
 
   deploy-preview:
     if: github.ref_name != 'main'
     name: Build & Deploy to Cloudflare Pages (Preview)
     runs-on: ubuntu-latest
     environment:
       name: preview
-      url: https://groqtales-preview.pages.dev
+      url: ${{ steps.deploy.outputs.url }}
 
     steps:
       - name: Checkout Code
         uses: actions/checkout@v4
 
+      - name: Compute branch slug
+        id: slug
+        run: |
+          SLUG=$(echo "${{ github.ref_name }}" | tr '[:upper:]' '[:lower:]' | sed 's/[^a-z0-9]/-/g' | sed 's/-\+/-/g' | sed 's/^-//;s/-$//')
+          echo "value=$SLUG" >> $GITHUB_OUTPUT
+          echo "preview_url=https://${SLUG}.groqtales.pages.dev" >> $GITHUB_OUTPUT
+
       - name: Setup Node.js 20
         uses: actions/setup-node@v4
         with:
@@ -83,7 +92,7 @@ jobs:
         run: npm run cf-build
         env:
           NEXT_PUBLIC_BUILD_MODE: 'true'
-          NEXT_PUBLIC_URL: 'https://groqtales-preview.pages.dev'
+          NEXT_PUBLIC_URL: ${{ steps.slug.outputs.preview_url }}
           NEXT_PUBLIC_API_URL: ${{ secrets.NEXT_PUBLIC_API_URL }}
           GROQ_API_KEY: ${{ secrets.GROQ_API_KEY }}
           NEXT_PUBLIC_SUPABASE_URL: ${{ secrets.NEXT_PUBLIC_SUPABASE_URL }}
@@ -93,9 +102,14 @@ jobs:
           NEXT_PUBLIC_SPLASH_IMAGE_URL: 'https://groqtales.xyz/splash.jpg'
           NEXT_PUBLIC_SPLASH_BACKGROUND_COLOR: '#1a1a2e'
 
+      - name: Install Wrangler
+        run: npm install -g wrangler@3.99.0
+
       - name: Deploy to Cloudflare Pages
-        uses: cloudflare/wrangler-action@v3
-        with:
-          apiToken: ${{ secrets.CLOUDFLARE_API_TOKEN }}
-          accountId: ${{ secrets.CLOUDFLARE_ACCOUNT_ID }}
-          command: pages deploy out --project-name=groqtales --branch=${{ github.ref_name }}
+        id: deploy
+        run: |
+          wrangler pages deploy --project-name=groqtales --branch="${{ github.ref_name }}"
+          echo "url=${{ steps.slug.outputs.preview_url }}" >> $GITHUB_OUTPUT
+        env:
+          CLOUDFLARE_API_TOKEN: ${{ secrets.CLOUDFLARE_API_TOKEN }}
+          CLOUDFLARE_ACCOUNT_ID: ${{ secrets.CLOUDFLARE_ACCOUNT_ID }}

.github/workflows/license-compliance.yml

@@ -2,9 +2,9 @@ name: License Compliance Check
 
 on:
   push:
-    branches: [ master, main, develop ]
+    branches: [master, main, develop]
   pull_request:
-    branches: [ master, main, develop ]
+    branches: [master, main, develop]
   schedule:
     - cron: '0 9 * * 1'
 
@@ -35,4 +35,4 @@ jobs:
         id: license-check
         run: |
           echo "Checking licenses for compliance..."
-          license-checker --production --summary --failOn "GPL;AGPL;LGPL;NGPL"
+          license-checker --production --summary --failOn "GPL;AGPL;LGPL;NGPL"

.github/workflows/lighthouse-ci.yml

@@ -46,13 +46,12 @@ jobs:
         # Lower threshold temporarily because this PR focuses on dev environment setup,
         # not frontend performance optimizations. Performance tuning will be handled separately.
         run: |
+          npx -y serve@latest out -l 3000 &
+          sleep 5
           lhci autorun \
-            --collect.startServerCommand="npx next start -p 3000" \
-            --collect.startServerReadyPattern="Ready" \
-            --collect.startServerReadyTimeout=30000 \
-            --collect.numberOfRuns=3 \
             --collect.url="http://localhost:3000/" \
             --collect.url="http://localhost:3000/nft-gallery" \
+            --collect.numberOfRuns=3 \
             --collect.settings.chromeFlags="--no-sandbox --disable-dev-shm-usage --headless" \
             --assert.assertions.categories:performance="error" \
             --assert.assertions.categories:performance.minScore=0.5 \

.github/workflows/pr-ci.yml

@@ -7,7 +7,7 @@ name: PR CI — Tests & Cloudflare Build Check
 
 on:
   pull_request:
-    branches: ["main"]
+    branches: ['main']
     types: [opened, synchronize, reopened]
 
 permissions:
@@ -24,7 +24,7 @@ jobs:
       - name: Setup Node.js 20
         uses: actions/setup-node@v4
         with:
-          node-version: "20"
+          node-version: '20'
 
       - name: Install Dependencies
         run: npm install --legacy-peer-deps
@@ -43,7 +43,7 @@ jobs:
       - name: Setup Node.js 20
         uses: actions/setup-node@v4
         with:
-          node-version: "20"
+          node-version: '20'
 
       - name: Install Dependencies
         run: npm install --legacy-peer-deps
@@ -63,30 +63,30 @@ jobs:
       - name: Setup Node.js 20
         uses: actions/setup-node@v4
         with:
-          node-version: "20"
+          node-version: '20'
 
       - name: Install Dependencies
         run: npm install --legacy-peer-deps
 
       - name: Build for Cloudflare Pages (dry run)
         run: npm run cf-build
         env:
-          NEXT_PUBLIC_BUILD_MODE: "true"
-          NEXT_PUBLIC_URL: "https://groqtales.xyz"
+          NEXT_PUBLIC_BUILD_MODE: 'true'
+          NEXT_PUBLIC_URL: 'https://groqtales.xyz'
           NEXT_PUBLIC_API_URL: ${{ secrets.NEXT_PUBLIC_API_URL }}
           NEXT_PUBLIC_GROQ_API_KEY: ${{ secrets.NEXT_PUBLIC_GROQ_API_KEY }}
           NEXT_PUBLIC_SUPABASE_URL: ${{ secrets.NEXT_PUBLIC_SUPABASE_URL }}
           NEXT_PUBLIC_SUPABASE_ANON_KEY: ${{ secrets.NEXT_PUBLIC_SUPABASE_ANON_KEY }}
           NEXT_PUBLIC_WALLET_CONNECT_PROJECT_ID: ${{ secrets.NEXT_PUBLIC_WALLET_CONNECT_PROJECT_ID }}
-          NEXT_PUBLIC_IMAGE_URL: "https://groqtales.xyz/images"
-          NEXT_PUBLIC_SPLASH_IMAGE_URL: "https://groqtales.xyz/splash.jpg"
-          NEXT_PUBLIC_SPLASH_BACKGROUND_COLOR: "#1a1a2e"
+          NEXT_PUBLIC_IMAGE_URL: 'https://groqtales.xyz/images'
+          NEXT_PUBLIC_SPLASH_IMAGE_URL: 'https://groqtales.xyz/splash.jpg'
+          NEXT_PUBLIC_SPLASH_BACKGROUND_COLOR: '#1a1a2e'
 
       - name: Verify Build Output Exists
         run: |
-          if [ -d "out" ]; then
+          if [ -d ".vercel/output/static" ]; then
             echo "✅ Build output directory exists"
-            du -sh out
+            du -sh .vercel/output/static
           else
             echo "❌ Build output directory not found!"
             exit 1

.github/workflows/welcome.yml

@@ -123,4 +123,4 @@ jobs:
                 pull_number: pr.number,
                 reviewers: filteredReviewers
               });
-            }
+            }

.github/workflows/wiki-sync.yml

@@ -5,7 +5,7 @@ on:
     paths:
       - 'wiki/**'
     branches:
-      - main 
+      - main
 
 permissions:
   contents: write
@@ -16,10 +16,10 @@ jobs:
     runs-on: ubuntu-latest
     steps:
       - uses: actions/checkout@v4
-      
+
       - name: Sync Wiki
         uses: newrelic/wiki-sync-action@v1.0.0
         with:
           source: wiki
           destination: wiki
-          token: ${{ secrets.GITHUB_TOKEN }}
+          token: ${{ secrets.GITHUB_TOKEN }}

.gitignore

@@ -1,7 +1,7 @@
 # See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
 
 # dependencies
-/node_modules
+node_modules/
 /.pnp
 .pnp.js
 .yarn/install-state.gz
@@ -104,6 +104,14 @@ sitemap.xml
 /public/sitemap.xml
 /out/sitemap.xml
 
+# Font demo files
+another-danger-rohit/
+another-danger-rohit.zip
+
+# Generated files
+/public/sitemap*.xml
+/public/robots.txt
+
 # Generated files (PWA service workers only)
 /public/sw.js
 /public/workbox-*.js