fix(subscription): display promo group discounts in device/traffic purchase and tariff switch

- Add discount fields to TrafficPackage and TariffSwitchPreview types
- Show strikethrough original price and discount badge for device purchase
- Show discount badge and original price for traffic packages
- Show discount info and free label for tariff switch with 100% discount

src/api/subscription.ts

@@ -91,6 +91,11 @@ export const subscriptionApi = {
     can_add?: number;
     days_left?: number;
     base_device_price_kopeks?: number;
+    // Discount fields (from promo group)
+    original_price_per_device_kopeks?: number;
+    base_total_price_kopeks?: number;
+    discount_percent?: number;
+    discount_kopeks?: number;
   }> => {
     const response = await apiClient.get('/cabinet/subscription/devices/price', {
       params: { devices },
@@ -355,6 +360,10 @@ export const subscriptionApi = {
     missing_amount_kopeks: number;
     missing_amount_label: string;
     is_upgrade: boolean;
+    // Discount fields (from promo group)
+    base_upgrade_cost_kopeks?: number;
+    discount_percent?: number;
+    discount_kopeks?: number;
   }> => {
     const response = await apiClient.post('/cabinet/subscription/tariff/switch/preview', {
       tariff_id: tariffId,

src/pages/Subscription.tsx

@@ -1215,13 +1215,47 @@ export default function Subscription() {
                   {devicePriceData?.available && devicePriceData.price_per_device_label && (
                     <div className="text-center">
                       <div className="mb-2 text-sm text-dark-400">
-                        {devicePriceData.price_per_device_label}/
+                        {/* Show original price with strikethrough if discount */}
-                        {t('subscription.perDevice').replace('/ ', '')} (
+                        {devicePriceData.discount_percent &&
+                        devicePriceData.discount_percent > 0 ? (
+                          <span>
+                            <span className="text-dark-500 line-through">
+                              {formatPrice(devicePriceData.original_price_per_device_kopeks || 0)}
+                            </span>
+                            <span className="mx-1">{devicePriceData.price_per_device_label}</span>
+                          </span>
+                        ) : (
+                          devicePriceData.price_per_device_label
+                        )}
+                        /{t('subscription.perDevice').replace('/ ', '')} (
                         {t('subscription.days', { count: devicePriceData.days_left })})
                       </div>
-                      <div className="text-2xl font-bold text-accent-400">
+                      {/* Discount badge */}
-                        {devicePriceData.total_price_label}
+                      {devicePriceData.discount_percent && devicePriceData.discount_percent > 0 && (
-                      </div>
+                        <div className="mb-2">
+                          <span className="inline-block rounded-full bg-green-500/20 px-2.5 py-0.5 text-sm font-medium text-green-400">
+                            -{devicePriceData.discount_percent}%
+                          </span>
+                        </div>
+                      )}
+                      {/* Total price - show as free if 100% discount or 0 */}
+                      {devicePriceData.total_price_kopeks === 0 ? (
+                        <div className="text-2xl font-bold text-green-400">
+                          {t('subscription.switchTariff.free')}
+                        </div>
+                      ) : (
+                        <div className="text-2xl font-bold text-accent-400">
+                          {/* Show original total with strikethrough if discount */}
+                          {devicePriceData.discount_percent &&
+                            devicePriceData.discount_percent > 0 &&
+                            devicePriceData.base_total_price_kopeks && (
+                              <span className="mr-2 text-lg text-dark-500 line-through">
+                                {formatPrice(devicePriceData.base_total_price_kopeks)}
+                              </span>
+                            )}
+                          {devicePriceData.total_price_label}
+                        </div>
+                      )}
                     </div>
                   )}
 
@@ -1514,8 +1548,28 @@ export default function Subscription() {
                                 ? '♾️ ' + t('subscription.additionalOptions.unlimited')
                                 : `${pkg.gb} ${t('common.units.gb')}`}
                             </div>
+                            {/* Discount badge */}
+                            {pkg.discount_percent && pkg.discount_percent > 0 && (
+                              <div className="mb-1">
+                                <span className="inline-block rounded-full bg-green-500/20 px-2 py-0.5 text-xs font-medium text-green-400">
+                                  -{pkg.discount_percent}%
+                                </span>
+                              </div>
+                            )}
+                            {/* Price with original strikethrough if discount */}
                             <div className="font-medium text-accent-400">
-                              {formatPrice(pkg.price_kopeks)}
+                              {pkg.discount_percent &&
+                              pkg.discount_percent > 0 &&
+                              pkg.base_price_kopeks ? (
+                                <>
+                                  <span className="mr-1 text-sm text-dark-500 line-through">
+                                    {formatPrice(pkg.base_price_kopeks)}
+                                  </span>
+                                  {formatPrice(pkg.price_kopeks)}
+                                </>
+                              ) : (
+                                formatPrice(pkg.price_kopeks)
+                              )}
                             </div>
                           </button>
                         ))}
@@ -2102,14 +2156,35 @@ export default function Subscription() {
                       )}
 
                       <div className="flex items-center justify-between border-t border-dark-700/50 pt-3">
-                        <span className="font-medium text-dark-100">
+                        <div>
-                          {t('subscription.switchTariff.upgradeCost')}
+                          <span className="font-medium text-dark-100">
-                        </span>
+                            {t('subscription.switchTariff.upgradeCost')}
-                        <span className="text-lg font-bold text-accent-400">
+                          </span>
-                          {switchPreview.upgrade_cost_kopeks > 0
+                          {/* Discount badge */}
-                            ? switchPreview.upgrade_cost_label
+                          {switchPreview.discount_percent && switchPreview.discount_percent > 0 && (
-                            : t('subscription.switchTariff.free')}
+                            <span className="ml-2 inline-block rounded-full bg-green-500/20 px-2 py-0.5 text-xs font-medium text-green-400">
-                        </span>
+                              -{switchPreview.discount_percent}%
+                            </span>
+                          )}
+                        </div>
+                        <div className="text-right">
+                          {/* Show original price with strikethrough if discount */}
+                          {switchPreview.discount_percent &&
+                            switchPreview.discount_percent > 0 &&
+                            switchPreview.base_upgrade_cost_kopeks &&
+                            switchPreview.base_upgrade_cost_kopeks > 0 && (
+                              <span className="mr-2 text-sm text-dark-500 line-through">
+                                {formatPrice(switchPreview.base_upgrade_cost_kopeks)}
+                              </span>
+                            )}
+                          <span
+                            className={`text-lg font-bold ${switchPreview.upgrade_cost_kopeks === 0 ? 'text-green-400' : 'text-accent-400'}`}
+                          >
+                            {switchPreview.upgrade_cost_kopeks > 0
+                              ? switchPreview.upgrade_cost_label
+                              : t('subscription.switchTariff.free')}
+                          </span>
+                        </div>
                       </div>
 
                       {!switchPreview.has_enough_balance &&

src/types/index.ts

@@ -122,6 +122,10 @@ export interface TariffSwitchPreview {
   missing_amount_kopeks: number;
   missing_amount_label: string;
   is_upgrade: boolean;
+  // Discount fields (from promo group)
+  base_upgrade_cost_kopeks?: number;
+  discount_percent?: number;
+  discount_kopeks?: number;
 }
 
 export interface RenewalOption {
@@ -137,6 +141,10 @@ export interface TrafficPackage {
   price_kopeks: number;
   price_rubles: number;
   is_unlimited: boolean;
+  // Discount fields (from promo group)
+  base_price_kopeks?: number;
+  discount_percent?: number;
+  discount_kopeks?: number;
 }
 
 export interface TrialInfo {