Skip to content

lowercase ids, remove daily price interval, show item ids#930

Merged
BilalG1 merged 1 commit intopayments-test-mode-togglefrom
product-card-fixes
Oct 7, 2025
Merged

lowercase ids, remove daily price interval, show item ids#930
BilalG1 merged 1 commit intopayments-test-mode-togglefrom
product-card-fixes

Conversation

@BilalG1
Copy link
Contributor

@BilalG1 BilalG1 commented Oct 7, 2025

High-level PR Summary

This PR enforces lowercase transformation for product, price, and item IDs across input fields, removes the daily interval option from price recurring billing intervals (keeping only weekly, monthly, and yearly options), and updates the UI to display item IDs instead of item display names in the product catalog view.

⏱️ Estimated Review Time: 15-30 minutes

💡 Review Order Suggestion
Order File Path
1 apps/dashboard/src/app/(main)/(protected)/projects/[projectId]/payments/products/product-dialog.tsx
2 apps/dashboard/src/app/(main)/(protected)/projects/[projectId]/payments/products/price-dialog.tsx
3 apps/dashboard/src/app/(main)/(protected)/projects/[projectId]/payments/products/item-dialog.tsx
4 apps/dashboard/src/app/(main)/(protected)/projects/[projectId]/payments/products/page-client-catalogs-view.tsx

Need help? Join our Discord

Analyze latest changes


Important

Standardize ID inputs to lowercase, remove daily price intervals, and display item IDs in the UI.

  • Behavior:
    • Convert itemId, priceId, and productId inputs to lowercase in item-dialog.tsx, price-dialog.tsx, and product-dialog.tsx.
    • Remove 'day' from allowed price intervals in page-client-catalogs-view.tsx.
    • Display itemId instead of itemDisplayName in ProductItemRow in page-client-catalogs-view.tsx.
  • Components:
    • Update IntervalPopover in page-client-catalogs-view.tsx to handle allowed units dynamically.
    • Add transform prop to ProductEditableInput for ID transformation in page-client-catalogs-view.tsx.
  • Validation:
    • Ensure IDs contain only lowercase letters, numbers, and hyphens in item-dialog.tsx, price-dialog.tsx, and product-dialog.tsx.

This description was created by Ellipsis for 3e5bb70. You can customize this summary. It will automatically update as commits are pushed.

@vercel
Copy link

vercel bot commented Oct 7, 2025

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Preview Comments Updated (UTC)
stack-backend Ready Ready Preview Comment Oct 7, 2025 5:12pm
stack-dashboard Ready Ready Preview Comment Oct 7, 2025 5:12pm
stack-demo Ready Ready Preview Comment Oct 7, 2025 5:12pm
stack-docs Ready Ready Preview Comment Oct 7, 2025 5:12pm

@coderabbitai
Copy link
Contributor

coderabbitai bot commented Oct 7, 2025

Important

Review skipped

Auto reviews are disabled on base/target branches other than the default branch.

Please check the settings in the CodeRabbit UI or the .coderabbit.yaml file in this repository. To trigger a single review, invoke the @coderabbitai review command.

You can disable this status message by setting the reviews.review_status to false in the CodeRabbit configuration file.

✨ Finishing touches
🧪 Generate unit tests (beta)
  • Create PR with unit tests
  • Post copyable unit tests in a comment
  • Commit unit tests in branch product-card-fixes

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

Comment @coderabbitai help to get the list of available commands and usage tips.

Copy link
Contributor

@greptile-apps greptile-apps bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Greptile Overview

Summary

This PR introduces several UX improvements to the payments dashboard interface, focusing on consistency and user experience. The changes implement automatic lowercase conversion for product, item, and price IDs as users type, preventing validation errors since the underlying validation logic requires lowercase-only identifiers. The PR also updates the product catalog interface to display actual item IDs instead of display names throughout the UI, providing developers with the exact identifiers they need for their code integration.

Additionally, the PR removes the 'daily' interval option from price configuration (while keeping it available for other interval selections) and refactors the interval selection logic to be more robust when handling restricted unit sets. These changes work together to create a more consistent developer experience where the dashboard shows the actual identifiers that will be used in API calls, while the automatic case conversion prevents common input errors that could cause integration issues.

The changes are implemented across four key files in the payments dashboard: item dialog, product dialog, price dialog, and the main catalog view. All modifications maintain existing validation logic while improving the user interface to be more forgiving and informative.

Important Files Changed

Changed Files
Filename Score Overview
apps/dashboard/src/app/(main)/(protected)/projects/[projectId]/payments/products/item-dialog.tsx 5/5 Adds automatic lowercase conversion for item ID input to prevent validation errors
apps/dashboard/src/app/(main)/(protected)/projects/[projectId]/payments/products/product-dialog.tsx 5/5 Implements automatic lowercase transformation for product ID input during typing
apps/dashboard/src/app/(main)/(protected)/projects/[projectId]/payments/products/price-dialog.tsx 5/5 Converts price ID input to lowercase automatically to match validation requirements
apps/dashboard/src/app/(main)/(protected)/projects/[projectId]/payments/products/page-client-catalogs-view.tsx 4/5 Updates catalog view to show item IDs instead of display names, removes daily pricing interval, adds product ID lowercase transform

Confidence score: 5/5

  • This PR is safe to merge with minimal risk as it only improves user experience without changing core business logic
  • Score reflects simple UI improvements that enhance usability while maintaining existing validation and functionality
  • No files require special attention as all changes are straightforward UX enhancements with clear benefits

Sequence Diagram

sequenceDiagram
    participant User
    participant ProductDialog
    participant ItemDialog
    participant PriceDialog
    participant AdminApp
    participant Project

    User->>ProductDialog: "Click Create Product"
    ProductDialog->>ProductDialog: "Apply template (one-time/subscription/addon/scratch)"
    ProductDialog->>ProductDialog: "Set displayName, productId (lowercase)"
    
    alt "Creating new item"
        ProductDialog->>ItemDialog: "Open item dialog"
        User->>ItemDialog: "Enter item details"
        ItemDialog->>ItemDialog: "Transform itemId to lowercase"
        ItemDialog->>ItemDialog: "Validate ID format (a-z0-9-)"
        ItemDialog->>ProductDialog: "Return item data"
    end

    alt "Adding prices (non-daily intervals only)"
        ProductDialog->>PriceDialog: "Open price dialog"
        User->>PriceDialog: "Configure price (week/month/year)"
        PriceDialog->>PriceDialog: "Transform priceId to lowercase"
        PriceDialog->>ProductDialog: "Return price data"
    end

    ProductDialog->>ProductDialog: "Validate product data"
    ProductDialog->>AdminApp: "Call onSave with product data"
    AdminApp->>Project: "updateConfig with product"
    Project-->>AdminApp: "Configuration updated"
    AdminApp-->>User: "Show success toast"
Loading

4 files reviewed, no comments

Edit Code Review Agent Settings | Greptile

Copy link

@recurseml recurseml bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Review by RecurseML

🔍 Review performed on 94f68f4..3e5bb70

✨ No bugs found, your code is sparkling clean

✅ Files analyzed, no issues (4)

apps/dashboard/src/app/(main)/(protected)/projects/[projectId]/payments/products/item-dialog.tsx
apps/dashboard/src/app/(main)/(protected)/projects/[projectId]/payments/products/page-client-catalogs-view.tsx
apps/dashboard/src/app/(main)/(protected)/projects/[projectId]/payments/products/price-dialog.tsx
apps/dashboard/src/app/(main)/(protected)/projects/[projectId]/payments/products/product-dialog.tsx

@BilalG1 BilalG1 merged commit 4659dc2 into payments-test-mode-toggle Oct 7, 2025
22 of 24 checks passed
@BilalG1 BilalG1 deleted the product-card-fixes branch October 7, 2025 17:46
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant