import 'package:flutter/material.dart';

import '../../constants.dart';
import '../../generated/l10n.dart';
import '../../store/actions.dart';
import '../../store/store.dart';
import '../../widgets/general/bottom_nav.dart';
import '../../widgets/general/breadcrumbs.dart';
import '../../widgets/general/navigationbar.dart';

/// “My Cards” 页：已停止保存银行卡（Stripe 移除）。改为展示 e-Transfer 说明。
class DesktopMyCards extends StatelessWidget {
  const DesktopMyCards({Key? key});

  @override
  Widget build(BuildContext context) {
    store.dispatch(UpdateContext(context));

    double sideSpace = 0;
    if (MediaQuery.of(context).size.width > 1200) {
      sideSpace = (MediaQuery.of(context).size.width - 1200) / 2;
    }

    return Scaffold(
      appBar: MiniNavigationBar(
        title: S.of(context).blog,
        back: true,
        breadCrumbs: [
          BreadCrumb(S.of(context).my_cards, null),
        ],
        breadCrumbHeight: Constants.BREADCRUMB_HEIGHT,
      ),
      body: Row(
        children: [
          Container(width: sideSpace),
          Expanded(
            child: ListView(
              children: [
                Container(
                  margin: const EdgeInsets.all(24),
                  padding: const EdgeInsets.all(24),
                  decoration: BoxDecoration(
                    color: Colors.lightBlueAccent.withOpacity(0.08),
                    borderRadius: BorderRadius.circular(12),
                    border: Border.all(color: Colors.black12),
                  ),
                  child: Column(
                    crossAxisAlignment: CrossAxisAlignment.start,
                    children: [
                      const Row(
                        children: [
                          Icon(Icons.info_outline, color: Colors.lightBlueAccent),
                          SizedBox(width: 8),
                          Text(
                            'Saved cards are no longer used',
                            style: TextStyle(
                                fontSize: 18, fontWeight: FontWeight.bold),
                          ),
                        ],
                      ),
                      const SizedBox(height: 12),
                      const Text(
                        'We have switched to Interac e-Transfer for payments. '
                        'You no longer need to save a credit card.',
                      ),
                      const SizedBox(height: 16),
                      const Text('Send your e-Transfer to:'),
                      const SizedBox(height: 4),
                      SelectableText(
                        Constants.ETRANSFER_EMAIL,
                        style: const TextStyle(
                            fontSize: 18, fontWeight: FontWeight.bold),
                      ),
                      const SizedBox(height: 12),
                      const Text(
                        'Remember to put your order code '
                        '(e.g. R#<order id>) in the e-Transfer message so we '
                        'can process your order automatically.',
                        style: TextStyle(color: Colors.black54),
                      ),
                    ],
                  ),
                ),
              ],
            ),
          ),
          Container(width: sideSpace),
        ],
      ),
      bottomNavigationBar: BottomNav(),
    );
  }
}