From 41f59ec9ca9089feebaeafafa92ce684fc90f44b Mon Sep 17 00:00:00 2001 From: ashilkn Date: Sat, 27 Jul 2024 12:16:47 +0530 Subject: [PATCH] [mob][photos] Move SubscriptionToggle widget to subscription_common_widgets.dart --- .../ui/payment/stripe_subscription_page.dart | 115 ----------------- .../payment/subscription_common_widgets.dart | 117 ++++++++++++++++++ 2 files changed, 117 insertions(+), 115 deletions(-) diff --git a/mobile/lib/ui/payment/stripe_subscription_page.dart b/mobile/lib/ui/payment/stripe_subscription_page.dart index 95274d8f05..02b782c700 100644 --- a/mobile/lib/ui/payment/stripe_subscription_page.dart +++ b/mobile/lib/ui/payment/stripe_subscription_page.dart @@ -578,118 +578,3 @@ class _StripeSubscriptionPageState extends State { ); } } - -class SubscriptionToggle extends StatefulWidget { - final Function(bool) onToggle; - const SubscriptionToggle({required this.onToggle, super.key}); - - @override - State createState() => _SubscriptionToggleState(); -} - -class _SubscriptionToggleState extends State { - bool _isYearly = true; - @override - Widget build(BuildContext context) { - const borderPadding = 2.5; - const spaceBetweenButtons = 4.0; - final textTheme = getEnteTextTheme(context); - return Padding( - padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 32), - child: LayoutBuilder( - builder: (context, constrains) { - final widthOfButton = (constrains.maxWidth - - (borderPadding * 2) - - spaceBetweenButtons) / - 2; - return Container( - decoration: BoxDecoration( - color: getEnteColorScheme(context).fillBaseGrey, - borderRadius: BorderRadius.circular(50), - ), - padding: const EdgeInsets.symmetric( - vertical: borderPadding, - horizontal: borderPadding, - ), - width: double.infinity, - child: Stack( - children: [ - Row( - children: [ - GestureDetector( - onTap: () { - setIsYearly(false); - }, - behavior: HitTestBehavior.opaque, - child: Container( - padding: const EdgeInsets.symmetric( - vertical: 8, - ), - width: widthOfButton, - child: Center( - child: Text( - "Monthly", - style: textTheme.bodyFaint, - ), - ), - ), - ), - const SizedBox(width: spaceBetweenButtons), - GestureDetector( - onTap: () { - setIsYearly(true); - }, - behavior: HitTestBehavior.opaque, - child: Container( - padding: const EdgeInsets.symmetric( - vertical: 8, - ), - width: widthOfButton, - child: Center( - child: Text( - "Yearly", - style: textTheme.bodyFaint, - ), - ), - ), - ), - ], - ), - AnimatedPositioned( - duration: const Duration(milliseconds: 350), - curve: Curves.easeInOutQuart, - left: _isYearly ? widthOfButton + spaceBetweenButtons : 0, - child: Container( - width: widthOfButton, - height: 40, - decoration: BoxDecoration( - color: getEnteColorScheme(context).backgroundBase, - borderRadius: BorderRadius.circular(50), - ), - child: AnimatedSwitcher( - duration: const Duration(milliseconds: 350), - switchInCurve: Curves.easeInOutExpo, - switchOutCurve: Curves.easeInOutExpo, - child: Text( - key: ValueKey(_isYearly), - _isYearly ? "Yearly" : "Monthly", - style: textTheme.body, - ), - ), - ), - ), - ], - ), - ); - }, - ), - ); - } - - setIsYearly(bool isYearly) { - setState(() { - _isYearly = isYearly; - }); - widget.onToggle(isYearly); - } -} diff --git a/mobile/lib/ui/payment/subscription_common_widgets.dart b/mobile/lib/ui/payment/subscription_common_widgets.dart index 49a9a4aaed..90f2864d56 100644 --- a/mobile/lib/ui/payment/subscription_common_widgets.dart +++ b/mobile/lib/ui/payment/subscription_common_widgets.dart @@ -180,3 +180,120 @@ class SubFaqWidget extends StatelessWidget { ); } } + +class SubscriptionToggle extends StatefulWidget { + final Function(bool) onToggle; + const SubscriptionToggle({required this.onToggle, super.key}); + + @override + State createState() => _SubscriptionToggleState(); +} + +class _SubscriptionToggleState extends State { + bool _isYearly = true; + @override + Widget build(BuildContext context) { + const borderPadding = 2.5; + const spaceBetweenButtons = 4.0; + final textTheme = getEnteTextTheme(context); + return Padding( + padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 32), + child: LayoutBuilder( + builder: (context, constrains) { + final widthOfButton = (constrains.maxWidth - + (borderPadding * 2) - + spaceBetweenButtons) / + 2; + return Container( + decoration: BoxDecoration( + color: getEnteColorScheme(context).fillBaseGrey, + borderRadius: BorderRadius.circular(50), + ), + padding: const EdgeInsets.symmetric( + vertical: borderPadding, + horizontal: borderPadding, + ), + width: double.infinity, + child: Stack( + children: [ + Row( + children: [ + GestureDetector( + onTap: () { + setIsYearly(false); + }, + behavior: HitTestBehavior.opaque, + child: Container( + padding: const EdgeInsets.symmetric( + vertical: 8, + ), + width: widthOfButton, + child: Center( + child: Text( + "Monthly", + style: textTheme.bodyFaint, + ), + ), + ), + ), + const SizedBox(width: spaceBetweenButtons), + GestureDetector( + onTap: () { + setIsYearly(true); + }, + behavior: HitTestBehavior.opaque, + child: Container( + padding: const EdgeInsets.symmetric( + vertical: 8, + ), + width: widthOfButton, + child: Center( + child: Text( + "Yearly", + style: textTheme.bodyFaint, + ), + ), + ), + ), + ], + ), + AnimatedPositioned( + duration: const Duration(milliseconds: 350), + curve: Curves.easeInOutQuart, + left: _isYearly ? widthOfButton + spaceBetweenButtons : 0, + child: Container( + padding: const EdgeInsets.symmetric( + vertical: 8, + ), + width: widthOfButton, + decoration: BoxDecoration( + color: getEnteColorScheme(context).backgroundBase, + borderRadius: BorderRadius.circular(50), + ), + child: AnimatedSwitcher( + duration: const Duration(milliseconds: 350), + switchInCurve: Curves.easeInOutExpo, + switchOutCurve: Curves.easeInOutExpo, + child: Text( + key: ValueKey(_isYearly), + _isYearly ? "Yearly" : "Monthly", + style: textTheme.body, + ), + ), + ), + ), + ], + ), + ); + }, + ), + ); + } + + setIsYearly(bool isYearly) { + setState(() { + _isYearly = isYearly; + }); + widget.onToggle(isYearly); + } +}