Merge pull request #1372 from Kamran-Khan-Gene/Revised-NFT-Full-Scree…

…n-View(Buy-Now+sub-tabs)-issue-#1344

Revised nft full screen view(buy now+sub tabs) issue #1344

wallet/i18n/de.json

@@ -361,7 +361,9 @@
   "bought_nft": "Gekauft",
   "resolution": "Auflösung",
   "set_lockscreen": "Instellen als vergrendelscherm",
+  "ipfs_cid": "IPFS-CID",
+  "available": "verfügbar",
+  "ea": "ea",
   "maintenance_mode_message": "We ondervinden technische problemen en hebben tijdelijk de onderhoudsmodus gestart voor het oplossen van problemen. Maak je geen zorgen, je collectie is veilig. U kunt echter geen on-chain-transacties starten totdat we het probleem hebben opgelost en de normale functionaliteit hebben hersteld.",
   "maintenance_mode_header": "onderhoudsstand"
-
 }

wallet/i18n/en.json

@@ -363,7 +363,9 @@
   "checkout": "Checkout",
   "artist": "Artist",
   "set_lockscreen": "Set as lockscreen",
+  "ipfs_cid": "IPFS CID",
+  "available": "available",
+  "ea": "ea",
   "maintenance_mode_message": "We are experiencing technical issues and have temporarily initiated maintenance mode for troubleshooting. Don't worry, your collection is safe. However, you cannot initiate on-chain transactions until we've resolved the problem and restored normal functionality.",
   "maintenance_mode_header": "Maintenance Mode"
-
 }

wallet/i18n/es.json

@@ -361,7 +361,9 @@
   "resolution": "resolución",
   "bought_nft": "Comprado",
   "set_lockscreen": "Establecer como pantalla de bloqueo",
+  "ipfs_cid": "CID IPFS",
+  "available": "disponible",
+  "ea": "cada uno",
   "maintenance_mode_message": "Estamos experimentando problemas técnicos y hemos iniciado temporalmente el modo de mantenimiento para solucionar problemas. No te preocupes, tu colección está segura. Sin embargo, no puede iniciar transacciones en cadena hasta que hayamos resuelto el problema y restablecido la funcionalidad normal.",
   "maintenance_mode_header": "Modo de mantenimiento"
-
 }

wallet/i18n/id.json

@@ -361,7 +361,9 @@
   "bought_nft": "Dibeli",
   "resolution": "resolusi",
   "set_lockscreen": "Tetapkan sebagai layar kunci",
+  "ipfs_cid": "ID Pelanggan IPFS",
+  "available": "tersedia",
+  "ea": "ea",
   "maintenance_mode_message": "Kami mengalami masalah teknis dan untuk sementara memulai mode pemeliharaan untuk pemecahan masalah. Jangan khawatir, koleksi Anda aman. Namun, Anda tidak dapat memulai transaksi on-chain sampai kami menyelesaikan masalah dan memulihkan fungsionalitas normal.",
   "maintenance_mode_header": "Mode Pemeliharaan"
-
 }

wallet/i18n/ja.json

@@ -361,7 +361,9 @@
   "resolution": "解像度",
   "bought_nft": "買った",
   "set_lockscreen": "ロック画面に設定",
+  "ipfs_cid": "IPFS CID",
+  "available": "利用可能",
+  "ea": "えー",
   "maintenance_mode_message": "技術的な問題が発生しており、トラブルシューティングのために一時的にメンテナンス モードを開始しました。心配はいりません。あなたのコレクションは安全です。ただし、問題が解決され、通常の機能が回復するまで、オンチェーン トランザクションを開始することはできません。",
   "maintenance_mode_header": "メンテナンスモード"
-
 }

wallet/i18n/ko.json

@@ -360,7 +360,9 @@
   "resolution": "해결",
   "bought_nft": "구입했다",
   "set_lockscreen": "잠금 화면으로 설정",
+  "ipfs_cid": "IPFS CID",
+  "available": "사용 가능",
+  "ea": "에아",
   "maintenance_mode_message": "기술적인 문제가 발생했으며 문제 해결을 위해 일시적으로 유지 관리 모드를 시작했습니다. 걱정하지 마세요. 컬렉션은 안전합니다. 그러나 문제를 해결하고 정상적인 기능을 복원할 때까지 온체인 트랜잭션을 시작할 수 없습니다.",
   "maintenance_mode_header": "유지 관리 모드"
-
 }

wallet/i18n/ru.json

@@ -361,7 +361,9 @@
   "bought_nft": "Купленный",
   "resolution": "разрешающая способность",
   "set_lockscreen": "Установить как экран блокировки",
+  "ipfs_cid": "CID ИПФС",
+  "available": "доступный",
+  "ea": "шт.",
   "maintenance_mode_message": "У нас возникли технические проблемы, и мы временно запустили режим обслуживания для устранения неполадок. Не волнуйтесь, ваша коллекция в безопасности. Однако вы не можете инициировать транзакции в сети, пока мы не решим проблему и не восстановим нормальную работу.",
   "maintenance_mode_header": "Режим технического обслуживания"
-
 }

wallet/i18n/vi.json

@@ -126,7 +126,7 @@
   "mnemonic_is_empty": "Mnemonic là trống",
   "user_name_doesnt_exists": "Tên người dùng không tồn tại",
   "user_name_invalid": "Tên người dùng không hợp lệ",
-  "invalid_input": "đâu vao không hợp lệ",
+  "invalid_input": "đâu vao không hợp lệ",
   "purchase_nft_success": "Đã mua thành công NFT này.",
   "payout_request_success": "Yêu cầu thanh toán thành công. %S",
   "trade_create_success": "Giao dịch trên NFT này đã được tạo thành công.",
@@ -349,7 +349,7 @@
   "enter_description_text": "Nhập mô tả",
   "enter_subject_text": "Nhập chủ đề",
   "free": "Tự do",
-  "thank_you_for_feedback": "Cảm ơn phản hôi của bạn.",
+  "thank_you_for_feedback": "Cảm ơn phản hôi của bạn.",
   "claim_free_nft": "Yêu cầu NFT miễn phí của bạn",
   "before_too_late": "Trước khi quá muộn!",
   "please_try_again_later": "Vui lòng thử lại sau",
@@ -361,7 +361,9 @@
   "resolution": "nghị quyết",
   "bought_nft": "Đã mua",
   "set_lockscreen": "Đặt làm màn hình khóa",
+  "ipfs_cid": "IPFS CID",
+  "available": "có sẵn",
+  "ea": "ea",
   "maintenance_mode_message": "Chúng tôi đang gặp sự cố kỹ thuật và đã tạm thời bắt đầu chế độ bảo trì để khắc phục sự cố. Đừng lo lắng, bộ sưu tập của bạn vẫn an toàn. Tuy nhiên, bạn không thể bắt đầu các giao dịch trên chuỗi cho đến khi chúng tôi giải quyết xong sự cố và khôi phục chức năng bình thường.",
   "maintenance_mode_header": "Chế độ bảo trì"
-
 }

wallet/lib/generated/locale_keys.g.dart

@@ -363,6 +363,9 @@ abstract class  LocaleKeys {
   static const resolution = 'resolution';
   static const bought_nft = 'bought_nft';
   static const set_lockscreen = 'set_lockscreen';
+  static const ipfs_cid = 'ipfs_cid';
+  static const available = 'available';
+  static const ea = 'ea';
   static const maintenance_mode_message = 'maintenance_mode_message';
   static const maintenance_mode_header = 'maintenance_mode_header';
 

wallet/lib/model/nft_ownership_history.dart

@@ -4,11 +4,11 @@ class NftOwnershipHistory {
   final String itemID;
   final String cookbookID;
   final String senderName;
-  final String receiver;
+  final String receiverID;
   final int createdAt;
 
   NftOwnershipHistory(
-      {required this.itemID, required this.cookbookID, required this.senderName, required this.receiver, required this.createdAt});
+      {required this.itemID, required this.cookbookID, required this.senderName, required this.receiverID, required this.createdAt});
 
   factory NftOwnershipHistory.fromJson(Map<String, dynamic> json) {
     final itemID = json[kItemId] as String;
@@ -17,7 +17,22 @@ class NftOwnershipHistory {
     final receiver = json[kTo] as String;
     final createdAt = int.parse(json[kCreatedAt] as String);
     return NftOwnershipHistory(
-      receiver: receiver,
+      receiverID: receiver,
+      cookbookID: cookbookID,
+      senderName: senderName,
+      itemID: itemID,
+      createdAt: createdAt,
+    );
+  }
+
+  factory NftOwnershipHistory.fromCookBookAndRecipeJson(Map<String, dynamic> json) {
+    final itemID = json[kItemIdKey] as String;
+    final cookbookID = json[kCookbookId] as String;
+    final senderName = json[kSenderName] as String;
+    final receiver = json[kReceiver] as String;
+    final createdAt = int.parse(json[kCreatedAt] as String);
+    return NftOwnershipHistory(
+      receiverID: receiver,
       cookbookID: cookbookID,
       senderName: senderName,
       itemID: itemID,

wallet/lib/pages/detailed_asset_view/widgets/tab_fields.dart

@@ -8,7 +8,6 @@ import 'package:pylons_wallet/model/nft.dart';
 import 'package:pylons_wallet/model/nft_ownership_history.dart';
 import 'package:pylons_wallet/utils/constants.dart';
 import 'package:pylons_wallet/utils/enums.dart';
-import 'package:pylons_wallet/utils/extension.dart';
 
 import '../../../generated/locale_keys.g.dart';
 
@@ -46,16 +45,13 @@ class _TabFieldState extends State<TabField> {
     switch (widget.nft.type) {
       case NftType.TYPE_RECIPE:
         return {
-          LocaleKeys.owned_by.tr(): widget.owner,
-          LocaleKeys.edition.tr(): '#${widget.nft.amountMinted} of ${widget.nft.quantity}',
+          LocaleKeys.owner.tr(): widget.owner,
+          "${LocaleKeys.edition.tr()}#": '#${widget.nft.amountMinted} of ${widget.nft.quantity}',
           LocaleKeys.royalty_text.tr(): widget.nft.tradePercentage,
-          LocaleKeys.creation.tr(): widget.nft.createdAt,
         };
       case NftType.TYPE_ITEM:
         return {
-          LocaleKeys.owned_by.tr(): widget.owner,
-          LocaleKeys.size.tr(): widget.nft.getAssetSize(),
-          LocaleKeys.creation.tr(): widget.nft.createdAt,
+          LocaleKeys.owner.tr(): widget.owner,
         };
       case NftType.TYPE_TRADE:
         return {};
@@ -65,14 +61,23 @@ class _TabFieldState extends State<TabField> {
   Map<String, String> getNFTDetailsMap() {
     switch (widget.nft.type) {
       case NftType.TYPE_RECIPE:
-        return {LocaleKeys.recipe_id.tr(): widget.nft.recipeID, LocaleKeys.resolution.tr(): widget.nft.getAssetSize(), kIpfsCid: widget.nft.cid};
+        return {
+          LocaleKeys.recipe_id.tr(): widget.nft.recipeID,
+          LocaleKeys.resolution.tr(): "${widget.nft.width}x${widget.nft.height}",
+          LocaleKeys.ipfs_cid.tr(): widget.nft.cid
+        };
       case NftType.TYPE_ITEM:
-        return {LocaleKeys.recipe_id.tr(): widget.nft.recipeID, LocaleKeys.resolution.tr(): widget.nft.getAssetSize(), kIpfsCid: widget.nft.cid};
+        return {
+          LocaleKeys.recipe_id.tr(): widget.nft.recipeID
+        };
       case NftType.TYPE_TRADE:
         break;
     }
 
-    return {LocaleKeys.recipe_id.tr(): widget.nft.recipeID, LocaleKeys.resolution.tr(): widget.nft.getAssetSize(), kIpfsCid: widget.nft.cid};
+    return {
+      LocaleKeys.recipe_id.tr(): widget.nft.recipeID,
+      LocaleKeys.resolution.tr(): "${widget.nft.width}x${widget.nft.height}",
+      LocaleKeys.ipfs_cid.tr(): widget.nft.cid};
   }
 
   @override
@@ -81,9 +86,16 @@ class _TabFieldState extends State<TabField> {
 
     final nftDetail = getNFTDetailsMap();
 
-    final listOwnership = ownership.entries.map((element) => _tabDetails(field: element.key, value: element.value)).toList();
+    final listOwnership = ownership.entries.map((element) => _tabDetails(field: element.key, value: element.value, customColor: element.key == LocaleKeys.owner.tr() ? Colors.red : null)).toList();
 
-    final listDetails = nftDetail.entries.map((element) => _tabDetails(field: element.key, value: element.value, customWidget: customWidget(element))).toList();
+    final listDetails = nftDetail.entries
+        .map(
+            (element) => _tabDetails(
+                field: element.key,
+                value: element.value,
+                customWidget: (element.key == LocaleKeys.recipe_id.tr() || element.key == LocaleKeys.ipfs_cid.tr()) && element.value.isNotEmpty ? _tabDetailsWithIcon(value: element.value) : null),
+        )
+        .toList();
 
     return AnimatedContainer(
       duration: const Duration(milliseconds: 100),
@@ -205,15 +217,15 @@ class _TabFieldState extends State<TabField> {
         children: [
           Text(
             value.substring(0, 6),
-            style: TextStyle(color: AppColors.kWhite),
+            style: TextStyle(color: AppColors.kGreyColor, fontSize: 9.sp),
           ),
           Text(
             "...",
-            style: TextStyle(color: AppColors.kWhite),
+            style: TextStyle(color: AppColors.kGreyColor, fontSize: 9.sp),
           ),
           Text(
             value.substring(value.length - 5, value.length),
-            style: TextStyle(color: AppColors.kWhite),
+            style: TextStyle(color: AppColors.kGreyColor, fontSize: 9.sp),
           ),
           if (value.isNotEmpty)
             InkWell(
@@ -226,8 +238,8 @@ class _TabFieldState extends State<TabField> {
               },
               child: Icon(
                 Icons.copy_outlined,
-                color: AppColors.kWhite,
-                size: 15.h,
+                color: AppColors.kGreyColor,
+                size: 11.h,
               ),
             )
         ],
@@ -242,7 +254,7 @@ class _TabFieldState extends State<TabField> {
           flex: 50,
           child: Text(
             field,
-            style: const TextStyle(color: Colors.white),
+            style: TextStyle(color: AppColors.kGreyColor, fontSize: 9.sp),
           ),
         ),
         if (customWidget != null) ...[
@@ -252,7 +264,7 @@ class _TabFieldState extends State<TabField> {
             flex: 45,
             child: Text(
               value,
-              style: TextStyle(color: customColor != null ? AppColors.kPurple : Colors.white),
+              style: TextStyle(color: customColor != null ? AppColors.kPurple : AppColors.kGreyColor, fontSize: 9.sp),
               maxLines: 1,
               overflow: TextOverflow.ellipsis,
             ),

wallet/lib/pages/purchase_item/clipper/top_left_bottom_right_clipper.dart

@@ -0,0 +1,23 @@
+import 'package:flutter/material.dart';
+
+class TopLeftBottomRightClipper extends CustomClipper<Path> {
+  @override
+  Path getClip(Size size) {
+    final path = Path();
+
+    path.lineTo(0, 18);
+    path.lineTo(0, size.height);
+    path.lineTo(size.width - 18, size.height);
+    path.lineTo(size.width, size.height - 18);
+    path.lineTo(size.width, 0);
+    path.lineTo(18, 0);
+    path.lineTo(0, 18);
+
+    return path;
+  }
+
+  @override
+  bool shouldReclip(covariant CustomClipper<Path> oldClipper) {
+    return false;
+  }
+}