Skip to main content

Functional Change: Temporarily Hide Point Redemption & Point Ticket Conversion

Last Updated: 16/07/2026
Type: Feature Flagging / UI Visibility Modification
Scope: Mobile App & CMS Admin Panel
Severity: 🔴 High — Temporarily disabling incomplete point redemption logic to prevent user confusion, while keeping database schemas intact for future enablement.

Feedback Screenshot:

1. Overview & Policy Rationale​

The app currently implements visual components for point redemption (e.g. converting 300 GPoints or 500 GPoints to redeem discount vouchers).

Because the GPoint conversion rules and POS sync policies are not fully finalized:

  • Users cannot actually redeem vouchers reliably.
  • Showing these options causes confusion (especially the message warning them that they need 10,000 points to start using points).

Decisions:​

  • Do NOT delete the backend code/logic or database tables: The voucher conversion schemas and APIs must remain intact.
  • Temporarily Hide on Frontend & CMS:
    • On Mobile App: Hide the voucher redemption list section ("Gói ưu đãi") and the detail screen for point redemption.
    • On CMS Admin: Add a feature toggle (or temporarily hide the voucher exchange list view/settings) to prevent admins from creating point-based voucher events until enabled.

2. Mobile App Adjustments (React Native)​

2.1 Hide Point Voucher Exchange Section on Home/BigFan Screens​

Locate the section rendering point-exchange voucher cards (usually a Horizontal FlatList titled "Gói ưu đãi tại..." or "Redeem Vouchers"):

// ❌ Before: Rendering point-redemption vouchers
return (
  <ScrollView>
    <ActiveBannerSlider />
    <WorkshopList />
    <PointVoucherRedemptionSection /> {/* ← HIDE THIS */}
  </ScrollView>
);

// ✅ After: Temporarily hide / comment out the component
return (
  <ScrollView>
    <ActiveBannerSlider />
    {/* PointVoucherRedemptionSection is hidden until point policies are finalized */}
  </ScrollView>
);

2.2 Disable Point-to-Ticket details route​

Ensure that if a user manually triggers navigation to the Point Detail / Exchange screen, they are redirected, or the route is completely commented out in the Navigator stack:

// In AppNavigator.tsx
// Comment out or remove the route temporarily to block entry:

/* 
<Stack.Screen 
  name="VoucherRedemptionDetail" 
  component={VoucherRedemptionDetailScreen} 
/> 
*/

3. CMS Admin Panel Adjustments (Saleor CMS)​

Instead of deleting the Voucher Redemption endpoints and settings pages, the sidebar navigation and action forms will hide these tabs:

3.1 Hide Sidebar Menu Items​

In the swizzled navigation sidebar (see cms-minigame-menu-grouping.md):

  • Temporarily hide the Voucher redemptions child node from the Voucher group.
  • Keep the Vouchers (templates management) active.
// File: saleor-app/src/navigation.ts

// === VOUCHER GROUP ===
{
  label: "Voucher",
  icon: VoucherIcon,
  type: "group",
  children: [
    {
      label: "Vouchers",
      url: "/apps/golden-lotus/vouchers",
      icon: TicketIcon,
    },
    /* 
    Temporarily hidden until Point Conversion policies are finalized:
    {
      label: "Voucher redemptions",
      url: "/apps/golden-lotus/vouchers/redemptions",
      icon: SwapIcon,
    },
    */
    {
      label: "Report voucher",
      url: "/apps/golden-lotus/vouchers/report",
      icon: ChartIcon,
    },
  ],
}

3.2 Hide "Point Requirement" Configuration inside Voucher Forms​

If the Voucher Template creation form has an option for "Redeemable with Points" or "Point Cost", hide this input section so admins can only create vouchers meant for direct distribution (e.g. via marketing campaigns or lucky spin prizes):

<!-- Inside CMS Voucher Form -->
<!-- Temporarily hide the point value cost input -->
<!--
<div class="form-group" id="point-cost-input-wrapper" style="display: none;">
  <label>Point Cost to Redeem</label>
  <input type="number" name="point_cost" value="0" />
</div>
-->

4. Re-enablement Strategy​

When the company decides to officially release the Point Redemption feature:

  1. Un-comment PointVoucherRedemptionSection in the Mobile App home screens.
  2. Re-enable the VoucherRedemptionDetail stack route in the Navigator.
  3. Un-comment the Voucher redemptions item in the CMS navigation configurations.
  4. Show the point cost fields in the voucher creation form.

Technical Checklist​

  • Comment out the Point Voucher Redemption list components on the Mobile App Home / BigFan screen views.
  • Disable / hide the stack navigator route to the point redemption detail view screen.
  • In the CMS codebase (navigation.ts), comment out the Voucher redemptions link row.
  • Hide any point-conversion input fields inside the CMS Voucher creation/edit forms.
  • Ensure that code and DB models for voucher points are NOT deleted, preserving schema integrity.
  • Run build verification on both Mobile App and Docusaurus to verify no compiler regressions.