Skip to content

feat: Added price count badges #6493

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
wants to merge 20 commits into
base: develop
Choose a base branch
from
Open

feat: Added price count badges #6493

Show file tree
Hide file tree
Changes from 13 commits
Commits
Show all changes
20 commits
Select commit Hold shift + click to select a range
0018cc4
Enhanced price proof UI and added price count badges.
asim-sahoo Mar 29, 2025
6733ba6
Apply dart formatting
asim-sahoo Mar 29, 2025
ab6e51d
Merge branch 'develop' into feature-price-proof-ui
asim-sahoo Mar 30, 2025
0a85671
Removed GeneratedPluginRegistrant.swift from PR
asim-sahoo Mar 30, 2025
13fc402
Merge branch 'feature-price-proof-ui' of https://github.com/asim-saho…
asim-sahoo Mar 30, 2025
5d0ce55
Ignore GeneratedPluginRegistrant.swift
asim-sahoo Mar 30, 2025
47b594b
Restored GeneratedPluginRegistrant.swift
asim-sahoo Mar 30, 2025
a2781da
Restored GeneratedPluginRegistrant.swift
asim-sahoo Mar 30, 2025
06b05d6
Merge branch 'feature-price-proof-ui' of https://github.com/asim-saho…
asim-sahoo Mar 30, 2025
388b039
Remove .gitignore file
asim-sahoo Mar 30, 2025
e178547
Revert "Remove .gitignore file"
asim-sahoo Mar 30, 2025
8304a52
Revert .gitignore file
asim-sahoo Mar 30, 2025
f8c6f65
Apply dart formatting
asim-sahoo Mar 30, 2025
0618978
Remove PriceBadge component and replace it with a custom badge in Pri…
asim-sahoo Mar 30, 2025
a9d2ceb
removed unused imports fixed
asim-sahoo Mar 31, 2025
990b3be
Merge branch 'develop' into feature-price-proof-ui
asim-sahoo Mar 31, 2025
ec91ea7
Merge branch 'develop' into feature-price-proof-ui
asim-sahoo Apr 1, 2025
009560f
Merge branch 'develop' into feature-price-proof-ui
asim-sahoo Apr 5, 2025
d94b876
Update .gitignore
monsieurtanuki Apr 5, 2025
6bc0b79
Update GeneratedPluginRegistrant.swift
monsieurtanuki Apr 5, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion .gitignore
View file
Open in desktop
Copy link
Contributor

Choose a reason for hiding this comment

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

We don't want to see this file here.
Add some spaces here and here, make it as it used to be, whatever, this file doesn't belong here.

Copy link
Author

Choose a reason for hiding this comment

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

I've reverted all the changes to their original state, but they are still appearing in the changed section. Additionally, I don’t see any differences in the files so I dont know what to do. Could you please advise on how to resolve this?

Original file line number Diff line number Diff line change
Expand Up @@ -274,4 +274,4 @@ packages/smooth_app/ios/Runner/tzl.lproj/InfoPlist.strings
packages/smooth_app/ios/Runner/val.lproj/InfoPlist.strings
packages/smooth_app/ios/Runner/vec.lproj/InfoPlist.strings
packages/smooth_app/ios/Runner/vls.lproj/InfoPlist.strings
packages/smooth_app/ios/Runner/zea.lproj/InfoPlist.strings
packages/smooth_app/ios/Runner/zea.lproj/InfoPlist.strings
55 changes: 35 additions & 20 deletions packages/smooth_app/lib/pages/prices/price_proof_page.dart
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,7 @@ import 'package:intl/intl.dart';
import 'package:openfoodfacts/openfoodfacts.dart';
import 'package:smooth_app/helpers/launch_url_helper.dart';
import 'package:smooth_app/pages/prices/price_model.dart';
import 'package:smooth_app/pages/prices/prices_card.dart';
import 'package:smooth_app/pages/prices/product_price_add_page.dart';
import 'package:smooth_app/pages/product/common/product_refresher.dart';
import 'package:smooth_app/query/product_query.dart';
Expand Down Expand Up @@ -77,27 +78,40 @@ class _PriceProofPageState extends State<PriceProofPage> {
),
],
),
body: Center(
child: Image.network(
_getUrl(false),
fit: BoxFit.cover,
loadingBuilder: (BuildContext context, Widget child,
ImageChunkEvent? loadingProgress) {
if (loadingProgress == null) {
return child;
}
return Center(
child: SizedBox(
width: double.maxFinite,
height: double.maxFinite,
child: Image.network(
_getUrl(true),
fit: BoxFit.contain,
),
body: Stack(
children: <Widget>[
Center(
child: Image.network(
_getUrl(false),
fit: BoxFit.cover,
loadingBuilder: (BuildContext context, Widget child,
ImageChunkEvent? loadingProgress) {
if (loadingProgress == null) {
return child;
}
return Center(
child: SizedBox(
width: double.maxFinite,
height: double.maxFinite,
child: Image.network(
_getUrl(true),
fit: BoxFit.contain,
),
),
);
},
),
),
// Using PriceBadge component instead of custom badge
if (_existingPrices != null)
Positioned(
Copy link
Contributor

Choose a reason for hiding this comment

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

Instead of a Stack and a Positioned, please just us a Badge, cf. prices_card.dart.

Copy link
Contributor

Choose a reason for hiding this comment

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

@asim-sahoo ping

Copy link
Author

Choose a reason for hiding this comment

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

yes

top: 16.0,
right: 16.0,
child: PriceBadge(
count: _existingPrices!.length,
),
);
},
),
),
],
),
);
}
Expand All @@ -121,6 +135,7 @@ class _PriceProofPageState extends State<PriceProofPage> {
if (prices.isError) {
return;
}

_existingPrices = prices.value.items ?? <Price>[];
if (mounted) {
setState(() {});
Expand Down
47 changes: 47 additions & 0 deletions packages/smooth_app/lib/pages/prices/prices_card.dart
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -21,6 +21,53 @@ import 'package:smooth_app/themes/smooth_theme.dart';
import 'package:smooth_app/themes/smooth_theme_colors.dart';
import 'package:smooth_app/themes/theme_provider.dart';

/// Badge showing the number of prices with a payment icon
class PriceBadge extends StatelessWidget {
Copy link
Contributor

Choose a reason for hiding this comment

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

Please keep it simple and just use a Badge, as already mentioned. And forget about your additional icon.

If you really want to create your own widget - to be used in both proof grid and single proof pages:

  • create a specific file, like proof_badge.dart
  • create a specific widget, like ProofBadge

const PriceBadge({
super.key,
required this.count,
});

final int count;

@override
Widget build(BuildContext context) {
return Container(
padding: const EdgeInsets.all(8.0),
decoration: BoxDecoration(
color: Colors.blue,
borderRadius: BorderRadius.circular(20.0),
boxShadow: <BoxShadow>[
BoxShadow(
color: Colors.black.withOpacity(0.2),
blurRadius: 4.0,
offset: const Offset(0, 2),
),
],
),
child: Row(
mainAxisSize: MainAxisSize.min,
children: <Widget>[
const Icon(
Icons.payments_outlined,
color: Colors.white,
size: 18.0,
),
const SizedBox(width: 4.0),
Text(
'$count',
style: const TextStyle(
color: Colors.white,
fontWeight: FontWeight.bold,
fontSize: 16.0,
),
),
],
),
);
}
}

/// Card that displays buttons related to prices.
class PricesCard extends StatelessWidget {
const PricesCard(this.product);
Expand Down
160 changes: 118 additions & 42 deletions packages/smooth_app/lib/pages/prices/prices_proofs_page.dart
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,14 +1,13 @@
import 'package:auto_size_text/auto_size_text.dart';
import 'dart:async';
import 'package:flutter/material.dart';
import 'package:flutter_gen/gen_l10n/app_localizations.dart';
import 'package:intl/intl.dart';
import 'package:matomo_tracker/matomo_tracker.dart';
import 'package:openfoodfacts/openfoodfacts.dart';
import 'package:smooth_app/generic_lib/design_constants.dart';
import 'package:smooth_app/generic_lib/widgets/images/smooth_image.dart';
import 'package:smooth_app/generic_lib/widgets/smooth_back_button.dart';
import 'package:smooth_app/generic_lib/widgets/smooth_card.dart';
import 'package:smooth_app/helpers/launch_url_helper.dart';
import 'package:smooth_app/pages/prices/price_model.dart';
import 'package:smooth_app/pages/prices/price_proof_page.dart';
import 'package:smooth_app/query/product_query.dart';
import 'package:smooth_app/widgets/smooth_app_bar.dart';
Expand Down Expand Up @@ -138,9 +137,25 @@ class _PricesProofsPageState extends State<PricesProofsPage>
),
),
);
}, // PriceProofPage
child: _PriceProofImage(proof,
squareSize: squareSize),
},
child: _PriceProofImage(
proof: proof,
onTap: () async {
if (widget.selectProof) {
Navigator.of(context).pop(proof);
return;
}
return Navigator.push<void>(
context,
MaterialPageRoute<void>(
builder: (BuildContext context) =>
PriceProofPage(
proof,
),
),
);
},
),
);
},
addAutomaticKeepAlives: false,
Expand Down Expand Up @@ -192,57 +207,118 @@ class _PricesProofsPageState extends State<PricesProofsPage>
}
}

// TODO(monsieurtanuki): reuse whatever will be coded in https://github.com/openfoodfacts/smooth-app/pull/5366
class _PriceProofImage extends StatelessWidget {
const _PriceProofImage(
this.proof, {
required this.squareSize,
/// Enhanced version of PriceProofImage with price badge
class _PriceProofImage extends StatefulWidget {
const _PriceProofImage({
required this.proof,
required this.onTap,
Copy link
Contributor

Choose a reason for hiding this comment

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

What's the point of changing the parameters?

});

final Proof proof;
final double squareSize;
final VoidCallback onTap;

@override
State<_PriceProofImage> createState() => _PriceProofImageState();
}

class _PriceProofImageState extends State<_PriceProofImage> {
List<Price>? _prices;

@override
void initState() {
super.initState();
unawaited(_loadPrices());
}

Future<void> _loadPrices() async {
if (PriceModel.isProofNotGoodEnough(widget.proof)) {
return;
}
final MaybeError<GetPricesResult> prices =
await OpenPricesAPIClient.getPrices(
GetPricesParameters()..proofId = widget.proof.id,
uriHelper: ProductQuery.uriPricesHelper,
);

if (!mounted) {
return;
}

if (prices.isError) {
return;
}

_prices = prices.value.items ?? <Price>[];
if (mounted) {
setState(() {});
}
}

@override
Widget build(BuildContext context) {
final DateFormat dateFormat =
DateFormat.yMd(ProductQuery.getLocaleString());
final String date = dateFormat.format(proof.created);
return Stack(
children: <Widget>[
SmoothImage(
width: squareSize,
height: squareSize,
imageProvider: NetworkImage(
proof
.getFileUrl(
uriProductHelper: ProductQuery.uriPricesHelper,
isThumbnail: true,
)
.toString(),
return GestureDetector(
onTap: widget.onTap,
child: Stack(
children: <Widget>[
Column(
children: <Widget>[
Expanded(
child: Image.network(
widget.proof
.getFileUrl(
uriProductHelper: ProductQuery.uriPricesHelper,
isThumbnail: true,
)
.toString(),
fit: BoxFit.cover,
),
),
Container(
color: Colors.black.withOpacity(0.7),
padding: const EdgeInsets.symmetric(vertical: 2.0),
width: double.infinity,
child: Text(
dateFormat.format(widget.proof.created),
textAlign: TextAlign.center,
style: const TextStyle(color: Colors.white),
),
),
],
),
rounded: false,
),
SizedBox(
width: squareSize,
height: squareSize,
child: Align(
alignment: Alignment.bottomCenter,
child: Padding(
padding: const EdgeInsets.all(SMALL_SPACE),
if (_prices != null)
Positioned(
top: 8.0,
right: 8.0,
child: Container(
height: VERY_LARGE_SPACE,
color: Colors.white.withAlpha(128),
width: 32.0,
height: 32.0,
decoration: BoxDecoration(
color: Colors.blue,
shape: BoxShape.circle,
boxShadow: <BoxShadow>[
BoxShadow(
color: Colors.black.withOpacity(0.2),
blurRadius: 4.0,
offset: const Offset(0, 2),
),
],
),
child: Center(
child: AutoSizeText(
date,
maxLines: 1,
child: Text(
'${_prices!.length}',
style: const TextStyle(
color: Colors.white,
fontWeight: FontWeight.bold,
fontSize: 16.0,
),
),
),
),
),
),
),
],
],
),
);
}
}
2 changes: 1 addition & 1 deletion packages/smooth_app/macos/Flutter/GeneratedPluginRegistrant.swift
View file
Open in desktop
Copy link
Contributor

Choose a reason for hiding this comment

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

Please remove that file from the PR, it has nothing to do with your code.

Copy link
Author

Choose a reason for hiding this comment

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

the changes were auto generated, I have reverted the changes but its still showing in the changed files.
same with the .gitignore file. I have no idea why its showing changed although there is no difference. can you please help me with this

Copy link
Contributor

Choose a reason for hiding this comment

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

We don't want to see this file here.
Add some spaces here and here, make it as it used to be, whatever, this file doesn't belong here.

Copy link
Author

Choose a reason for hiding this comment

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

I've reverted all the changes to their original state, but they are still appearing in the changed section. Additionally, I don’t see any differences in the files so I dont know what to do. Could you please advise on how to resolve this?

Original file line number Diff line number Diff line change
Expand Up @@ -41,4 +41,4 @@ func RegisterGeneratedPlugins(registry: FlutterPluginRegistry) {
SqflitePlugin.register(with: registry.registrar(forPlugin: "SqflitePlugin"))
UrlLauncherPlugin.register(with: registry.registrar(forPlugin: "UrlLauncherPlugin"))
FLTWebViewFlutterPlugin.register(with: registry.registrar(forPlugin: "FLTWebViewFlutterPlugin"))
}
}