import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:go_router/go_router.dart';
import 'package:proxibuy/core/utils/empty_space.dart';
import 'package:proxibuy/presentation/ui/theme/colors.dart';
import 'package:proxibuy/presentation/ui/theme/responsive.dart';

class ProductPage extends StatelessWidget {
  const ProductPage({super.key});

  @override
  Widget build(BuildContext context) {
    return DefaultTabController(
      length: 2,
      child: Responsive(context).builder(
        desktop: Scaffold(
          body: Center(
              child: ConstrainedBox(
            constraints: BoxConstraints(
              maxWidth: 1600,
            ),
            child: Column(
              children: [
                Padding(
                  padding: const EdgeInsets.all(32.0),
                  child: Row(
                    mainAxisAlignment: MainAxisAlignment.spaceBetween,
                    children: [
                      IconButton(
                          onPressed: () {
                            context.pop();
                          },
                          icon: Icon(
                            Icons.arrow_back_ios,
                            size: 32,
                          )),
                      Padding(
                        padding: const EdgeInsets.only(right: 32.0),
                        child: IconButton(
                            iconSize: 32,
                            onPressed: () {},
                            icon: Icon(Icons.bookmark_add_rounded)),
                      ),
                    ],
                  ),
                ),
                Expanded(
                  child: Row(
                    children: [
                      Expanded(
                          child: SingleChildScrollView(
                              physics: BouncingScrollPhysics(),
                              child: productTabBarView(context))),
                      Expanded(
                          child: Padding(
                        padding: const EdgeInsets.symmetric(horizontal: 64.0),
                        child: Column(
                          children: [
                            Expanded(
                              child: ClipRRect(
                                borderRadius: BorderRadius.circular(16),
                                child: AspectRatio(
                                    aspectRatio: 1 / 1,
                                    child: Image.network(
                                      'https://s3-alpha-sig.figma.com/img/4361/9bde/26f7810ea7f22d8aa59a907d378c16ff?Expires=1740960000&Key-Pair-Id=APKAQ4GOSFWCW27IBOMQ&Signature=DIm2QGXae9cxWDNV2UoJd4JWpvvmL~qKmEefvrtVw9XwKTVHwcfgqR3-s-5s7jqsTiT0iWDsYY10MeuSf2d4xXx9uTra~QEj3LbO1x4cRv4DBDJ-wkLGxliV07HVWl~CMl1MhzXyfUvWkrR30QQ5x3IslvBpfulMj88AYU5l97XPaNMOcMT8YqErdCdpiqdXBM9L2vUpCUbZGH~SfKCQyl1QcNhuCBTPODPWcK6kGU1ell3qwXC0-4JcLiiR-Kdo9asKy495iVtQ584fyZAdeN1R4oJnVGnAlUyN2HRQh6j518FCrJIzr7O0JajvrmwZ7j48nXjWPtG0SGp8Lq4l6A__',
                                      width: double.infinity,
                                      fit: BoxFit.cover,
                                    )),
                              ),
                            ),
                            Padding(
                              padding:
                                  const EdgeInsets.only(top: 32.0, bottom: 64),
                              child: SizedBox(
                                width: double.infinity,
                                height: 90,
                                child: ListView.builder(
                                  itemCount: 20,
                                  padding: EdgeInsets.symmetric(horizontal: 8),
                                  scrollDirection: Axis.horizontal,
                                  shrinkWrap: true,
                                  physics: BouncingScrollPhysics(),
                                  itemBuilder: (context, index) {
                                    return Container(
                                      margin:
                                          EdgeInsets.symmetric(horizontal: 8),
                                      padding: EdgeInsets.all(4),
                                      decoration: BoxDecoration(
                                          color: Theme.of(context)
                                              .colorScheme
                                              .surface
                                              .withAlpha(200),
                                          borderRadius:
                                              BorderRadius.circular(8)),
                                      child: Image.network(
                                          'https://static.vecteezy.com/system/resources/previews/021/275/832/non_2x/running-shoes-illustration-with-fire-shape-yellow-and-red-isolated-on-transparan-background-free-png.png'),
                                    );
                                  },
                                ),
                              ),
                            )
                          ],
                        ),
                      )),
                    ],
                  ),
                ),
              ],
            ),
          )),
        ),
        mobile: Scaffold(
          body: SingleChildScrollView(
            child: Column(
              children: [
                Stack(
                  children: [
                    Padding(
                      padding: const EdgeInsets.only(bottom: 46),
                      child: AspectRatio(
                          aspectRatio: 0.95,
                          child: Image.network(
                            'https://s3-alpha-sig.figma.com/img/4361/9bde/26f7810ea7f22d8aa59a907d378c16ff?Expires=1740960000&Key-Pair-Id=APKAQ4GOSFWCW27IBOMQ&Signature=DIm2QGXae9cxWDNV2UoJd4JWpvvmL~qKmEefvrtVw9XwKTVHwcfgqR3-s-5s7jqsTiT0iWDsYY10MeuSf2d4xXx9uTra~QEj3LbO1x4cRv4DBDJ-wkLGxliV07HVWl~CMl1MhzXyfUvWkrR30QQ5x3IslvBpfulMj88AYU5l97XPaNMOcMT8YqErdCdpiqdXBM9L2vUpCUbZGH~SfKCQyl1QcNhuCBTPODPWcK6kGU1ell3qwXC0-4JcLiiR-Kdo9asKy495iVtQ584fyZAdeN1R4oJnVGnAlUyN2HRQh6j518FCrJIzr7O0JajvrmwZ7j48nXjWPtG0SGp8Lq4l6A__',
                            width: double.infinity,
                            fit: BoxFit.cover,
                          )),
                    ),
                    Positioned(
                        left: 16,
                        right: 16,
                        top: 32,
                        child: Row(
                          mainAxisAlignment: MainAxisAlignment.spaceBetween,
                          children: [
                            InkWell(
                              onTap: () {
                                context.pop();
                              },
                              child: Container(
                                decoration: BoxDecoration(
                                    color: Theme.of(context)
                                        .colorScheme
                                        .surface
                                        .withAlpha(180),
                                    borderRadius: BorderRadius.circular(8)),
                                padding: EdgeInsets.all(8),
                                child: Icon(Icons.arrow_back_ios_new_rounded),
                              ),
                            ),
                            InkWell(
                              onTap: () {},
                              child: Container(
                                decoration: BoxDecoration(
                                    color: Theme.of(context)
                                        .colorScheme
                                        .surface
                                        .withAlpha(180),
                                    borderRadius: BorderRadius.circular(8)),
                                padding: EdgeInsets.all(8),
                                child: Icon(Icons.bookmark_add_rounded),
                              ),
                            ),
                          ],
                        )),
                    Positioned(
                        right: 0,
                        left: 0,
                        bottom: 0,
                        child: SizedBox(
                          width: double.infinity,
                          height: 90,
                          child: ListView.builder(
                            itemCount: 20,
                            padding: EdgeInsets.symmetric(horizontal: 8),
                            scrollDirection: Axis.horizontal,
                            shrinkWrap: true,
                            physics: BouncingScrollPhysics(),
                            itemBuilder: (context, index) {
                              return Container(
                                margin: EdgeInsets.symmetric(horizontal: 8),
                                padding: EdgeInsets.all(4),
                                decoration: BoxDecoration(
                                    color: Theme.of(context)
                                        .colorScheme
                                        .surface
                                        .withAlpha(200),
                                    borderRadius: BorderRadius.circular(8)),
                                child: Image.network(
                                    'https://static.vecteezy.com/system/resources/previews/021/275/832/non_2x/running-shoes-illustration-with-fire-shape-yellow-and-red-isolated-on-transparan-background-free-png.png'),
                              );
                            },
                          ),
                        ))
                  ],
                ),
                productTabBarView(context),
              ],
            ),
          ),
        ),
      ),
    );
  }

  Column productTabBarView(BuildContext context) {
    return Column(
      children: [
        Padding(
          padding: const EdgeInsets.symmetric(horizontal: 16.0),
          child: TabBar(
            tabs: [
              Tab(text: 'Item'),
              Tab(text: 'Shop'),
            ],
          ),
        ),
        Padding(
          padding: const EdgeInsets.symmetric(vertical: 16.0),
          child: SizedBox(
            height: 1500,
            child: TabBarView(
              children: [itemTab(context), shopTab(context)],
            ),
          ),
        ),
      ],
    );
  }

  Widget itemTab(BuildContext context) {
    return Padding(
      padding: const EdgeInsets.symmetric(horizontal: 16.0),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          SelectableText(
            'Philadelphia Honey Pecan Cream Cheese Spread, 7.5 oz Tub',
            style: Theme.of(context).textTheme.headlineSmall,
          ),
          4.h,
          SelectableText(
            'Brand: Philadelphia',
            style: Theme.of(context).textTheme.titleSmall,
          ),
          8.h,
          Row(
            children: [
              Icon(Icons.star_rate_rounded),
              Icon(Icons.star_rate_rounded),
              Icon(Icons.star_rate_rounded),
              Icon(Icons.star_rate_rounded),
              Icon(Icons.star_half_rounded),
              8.w,
              Text(
                '4.8',
                style: Theme.of(context).textTheme.bodyMedium,
              )
            ],
          ),
          8.h,
          SelectableText(
            'Currently available. 23 remain',
            style: Theme.of(context).textTheme.titleSmall,
          ),
          12.h,
          Row(
            children: [
              Icon(Icons.warning_amber_rounded),
              8.w,
              Text(
                'Expire: 5 days',
                style: Theme.of(context).textTheme.bodyMedium,
              )
            ],
          ),
          8.h,
          Divider(
            color: Theme.of(context).colorScheme.onSurface,
          ),
          8.h,
          SelectableText(
            'Nutrition summary',
            style: Theme.of(context).textTheme.titleLarge,
          ),
          4.h,
          SelectableText(
            '7 servings per container | 2 Tbsp (33g)',
            style: Theme.of(context).textTheme.bodyLarge,
          ),
          16.h,
          Container(
            decoration: BoxDecoration(
                color: Theme.of(context).colorScheme.surface,
                borderRadius: BorderRadius.circular(16)),
            padding: EdgeInsets.symmetric(vertical: 8, horizontal: 16),
            child: Flex(
              direction: Axis.horizontal,
              mainAxisAlignment: MainAxisAlignment.spaceBetween,
              children: [
                Flexible(
                  flex: 1,
                  child: Column(
                    children: [
                      SelectableText(
                        '80',
                        style: Theme.of(context)
                            .textTheme
                            .labelLarge
                            ?.copyWith(color: Theme.of(context).primaryColor),
                      ),
                      SelectableText('Calories',
                          style: Theme.of(context).textTheme.labelLarge),
                    ],
                  ),
                ),
                Flexible(
                  flex: 1,
                  child: Column(
                    children: [
                      SelectableText(
                        '100mg',
                        style: Theme.of(context)
                            .textTheme
                            .labelLarge
                            ?.copyWith(color: Theme.of(context).primaryColor),
                      ),
                      SelectableText('Sodium',
                          style: Theme.of(context).textTheme.labelLarge),
                    ],
                  ),
                ),
                Flexible(
                  flex: 1,
                  child: Column(
                    children: [
                      SelectableText(
                        '0g',
                        style: Theme.of(context)
                            .textTheme
                            .labelLarge
                            ?.copyWith(color: Theme.of(context).primaryColor),
                      ),
                      SelectableText('Dietary Fiber',
                          style: Theme.of(context).textTheme.labelLarge),
                    ],
                  ),
                ),
                Flexible(
                  flex: 1,
                  child: Column(
                    children: [
                      SelectableText(
                        '5g',
                        style: Theme.of(context)
                            .textTheme
                            .labelLarge
                            ?.copyWith(color: Theme.of(context).primaryColor),
                      ),
                      SelectableText('Sugars',
                          style: Theme.of(context).textTheme.labelLarge),
                    ],
                  ),
                ),
              ],
            ),
          ),
          16.h,
          Divider(
            color: Theme.of(context).colorScheme.onSurface,
          ),
          16.h,
          Row(
            children: [
              Container(
                decoration: BoxDecoration(
                    color: semanticRed, borderRadius: BorderRadius.circular(8)),
                padding: EdgeInsets.all(8),
                child: Text(
                  'HOT',
                  style: Theme.of(context)
                      .textTheme
                      .titleMedium
                      ?.copyWith(color: Colors.white),
                ),
              ),
              8.w,
              SelectableText(
                '(50%) 32.18 - 16.9 \$',
                style: Theme.of(context)
                    .textTheme
                    .titleMedium
                    ?.copyWith(color: semanticRed),
              )
            ],
          ),
          16.h,
          Center(
              child: Text(
            'Top reviews from the United States',
            style: Theme.of(context).textTheme.titleMedium,
          )),
          8.h,
          ListView.builder(
            shrinkWrap: true,
            itemCount: 3,
            physics: NeverScrollableScrollPhysics(),
            itemBuilder: (context, index) {
              return Column(
                children: [
                  ListTile(
                    contentPadding: EdgeInsets.zero,
                    title: SelectableText(
                      'Kristin Watson',
                      style: Theme.of(context).textTheme.labelLarge,
                    ),
                    subtitle: SelectableText(
                      'Verified Buyer',
                      style: Theme.of(context).textTheme.bodySmall,
                    ),
                    trailing: Row(
                      mainAxisSize: MainAxisSize.min,
                      children: [
                        Icon(Icons.star_rate_rounded),
                        Icon(Icons.star_rate_rounded),
                        Icon(Icons.star_rate_rounded),
                        Icon(Icons.star_rate_rounded),
                        Icon(Icons.star_rate_rounded),
                      ],
                    ),
                  ),
                  16.h,
                  SelectableText(
                    'This is 💯 one hundred percent the best !!! "Philadelphia cream cheese is absolutely amazing—so creamy and versatile, it elevates every recipe, from cheesecakes to simple bagels. A must-have in my kitchen!"😋😋😋',
                    style: Theme.of(context).textTheme.bodyLarge,
                  ),
                  16.h,
                  Row(
                    mainAxisAlignment: MainAxisAlignment.spaceBetween,
                    children: [
                      Row(
                        children: [
                          Icon(Icons.thumb_up_alt_outlined),
                          8.w,
                          Text('Yes (2)'),
                          12.w,
                          Icon(Icons.thumb_down_alt_outlined),
                          8.w,
                          Text('No (0)'),
                        ],
                      ),
                      Text(
                        'Nov 09, 2024',
                        style: Theme.of(context).textTheme.bodySmall,
                      )
                    ],
                  ),
                  if (index != 3 - 1)
                    Divider(
                      color: Theme.of(context).colorScheme.onSurface,
                    )
                ],
              );
            },
          ),
          12.h,
          Row(
            mainAxisAlignment: MainAxisAlignment.center,
            children: [
              Text(
                'See all reviws',
                style: Theme.of(context)
                    .textTheme
                    .titleMedium
                    ?.copyWith(color: semanticRed),
              ),
              4.w,
              Icon(
                Icons.arrow_forward,
                color: semanticRed,
              )
            ],
          )
        ],
      ),
    );
  }

  Widget shopTab(BuildContext context) {
    return Column(
      children: [
        Padding(
          padding: const EdgeInsets.symmetric(horizontal: 16.0),
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              SelectableText(
                'Heinen\'s Grocery',
                style: Theme.of(context).textTheme.headlineSmall,
              ),
              8.h,
              Row(
                children: [
                  Icon(Icons.star_rate_rounded),
                  Icon(Icons.star_rate_rounded),
                  Icon(Icons.star_rate_rounded),
                  Icon(Icons.star_rate_rounded),
                  Icon(Icons.star_half_rounded),
                  8.w,
                  Text(
                    '4.8',
                    style: Theme.of(context).textTheme.bodyMedium,
                  )
                ],
              ),
              8.h,
              Row(
                children: [
                  Icon(Icons.location_on_outlined),
                  8.w,
                  Text(
                    'Shop 1, Cleveland, Ohio, United States',
                    style: Theme.of(context).textTheme.bodyMedium,
                  )
                ],
              ),
              4.h,
              Row(
                children: [
                  Icon(Icons.access_time_rounded),
                  8.w,
                  Text(
                    'Open now | 10:00 AM - 12:00 PM',
                    style: Theme.of(context).textTheme.bodyMedium,
                  )
                ],
              ),
              16.h,
              Row(
                children: [
                  SelectableText(
                    'Facilities',
                    style: Theme.of(context).textTheme.titleMedium,
                  ),
                  8.w,
                  Expanded(
                    child: Divider(
                      color: Theme.of(context).colorScheme.onSurface,
                    ),
                  ),
                ],
              ),
              8.h,
              Row(
                children: [
                  Icon(Icons.check_box_outlined),
                  8.w,
                  Text(
                    'Home Delivery',
                    style: Theme.of(context).textTheme.bodyMedium,
                  )
                ],
              ),
              16.h,
              SizedBox(
                height: 46,
                child: ElevatedButton(
                    style: ElevatedButton.styleFrom(
                        backgroundColor: Theme.of(context).colorScheme.surface),
                    onPressed: () {},
                    child: Row(
                      mainAxisAlignment: MainAxisAlignment.center,
                      children: [
                        Icon(Icons.navigation_rounded),
                        4.w,
                        Text('Direction')
                      ],
                    )),
              ),
              16.h,
              Container(
                width: double.infinity,
                decoration: BoxDecoration(
                    color: Theme.of(context).colorScheme.surface,
                    borderRadius: BorderRadius.circular(16)),
                padding: EdgeInsets.all(16),
                child: Column(
                  crossAxisAlignment: CrossAxisAlignment.center,
                  children: [
                    Text(
                      '23 min (8.7 km)',
                      style: Theme.of(context).textTheme.titleLarge,
                    ),
                    12.h,
                    SizedBox(
                      height: 46,
                      width: double.infinity,
                      child: ElevatedButton(
                          style: ElevatedButton.styleFrom(
                              backgroundColor: semanticGreen),
                          onPressed: () {},
                          child: Text('Reservation')),
                    ),
                  ],
                ),
              ),
            ],
          ),
        ),
        16.h,
        Padding(
          padding: const EdgeInsets.symmetric(horizontal: 16.0),
          child: Row(
            children: [
              SelectableText(
                'List of offers',
                style: Theme.of(context).textTheme.titleLarge,
              ),
            ],
          ),
        ),
        16.h,
        SizedBox(
          width: double.infinity,
          height: 150,
          child: ListView.builder(
            shrinkWrap: true,
            scrollDirection: Axis.horizontal,
            padding: EdgeInsets.symmetric(horizontal: 8),
            physics: BouncingScrollPhysics(),
            itemBuilder: (context, index) {
              return Container(
                width: 300,
                padding: EdgeInsets.all(12),
                margin: EdgeInsets.symmetric(horizontal: 8),
                decoration: BoxDecoration(
                    color: Theme.of(context).colorScheme.surface,
                    borderRadius: BorderRadius.circular(16)),
                child: Column(
                  children: [
                    Row(
                      crossAxisAlignment: CrossAxisAlignment.start,
                      children: [
                        ClipRRect(
                          borderRadius: BorderRadius.circular(8),
                          child: Image.network(
                            'https://s3-alpha-sig.figma.com/img/f773/0650/56608740ed0260647aa12c36f8b46534?Expires=1740960000&Key-Pair-Id=APKAQ4GOSFWCW27IBOMQ&Signature=UxdqWfGI5Ix~S2728Qsiw0MHGST~we6M25cWRZ8YetaIGlC-ITXjDaX8LDssimYJt5XWmfyWqE0D4vRq1lP9Nmy3CfI~bLXaaBBSmQqAwdXDz1aVXFh7Q8ri5klxYoCjIF0HTp3nr4Scpf5d9PHU7L32s8JF0pz4dt8tyaCo-goeEOsjn8Q-LOBKNHVE6B8uRnW74GH12V7GNygxv1EV59dDD1vcXNcD7kS~2Ox7RejK159Ys7La1F-Evbt5sU7XFOMJuFbPVUgWA05wgrF1U1zdaz5b10Mu9~4PnErR~FjJTZPYcznatVYwuxWRWRAtpwjhjew2TL0DoOvlCKHbYw__',
                            width: 74,
                            height: 74,
                            fit: BoxFit.cover,
                          ),
                        ),
                        12.w,
                        Expanded(
                          child: Column(
                            mainAxisAlignment: MainAxisAlignment.start,
                            crossAxisAlignment: CrossAxisAlignment.start,
                            children: [
                              SelectableText(
                                'Kellogg\'s Corn Flakes',
                                style: Theme.of(context)
                                    .textTheme
                                    .titleMedium
                                    ?.copyWith(overflow: TextOverflow.ellipsis),
                                maxLines: 1,
                              ),
                              8.h,
                              SelectableText(
                                'Classic cereal with a crispy texture an a mildly sweet flavor',
                                style: Theme.of(context)
                                    .textTheme
                                    .bodyMedium
                                    ?.copyWith(overflow: TextOverflow.ellipsis),
                                maxLines: 2,
                              ),
                            ],
                          ),
                        )
                      ],
                    ),
                    12.h,
                    Row(
                      mainAxisAlignment: MainAxisAlignment.spaceBetween,
                      children: [
                        Row(
                          children: [
                            Container(
                              decoration: BoxDecoration(
                                  color: semanticRed,
                                  borderRadius: BorderRadius.circular(8)),
                              padding: EdgeInsets.all(8),
                              child: Text(
                                'HOT',
                                style: Theme.of(context)
                                    .textTheme
                                    .titleSmall
                                    ?.copyWith(color: Colors.white),
                              ),
                            ),
                            8.w,
                            Text(
                              '(50%) / 16 - 8\$',
                              style: Theme.of(context).textTheme.titleSmall,
                            )
                          ],
                        ),
                        Container(
                          decoration: BoxDecoration(
                              color: semanticGreen,
                              borderRadius: BorderRadius.circular(8)),
                          padding: EdgeInsets.all(8),
                          child: Text(
                            'Reservation',
                            style: Theme.of(context)
                                .textTheme
                                .titleSmall
                                ?.copyWith(color: Colors.white),
                          ),
                        ),
                      ],
                    )
                  ],
                ),
              );
            },
          ),
        ),
        16.h,
        Padding(
          padding: const EdgeInsets.symmetric(horizontal: 16.0),
          child: Row(
            children: [
              SelectableText(
                'Similar Business',
                style: Theme.of(context).textTheme.titleLarge,
              ),
            ],
          ),
        ),
        16.h,
        SizedBox(
          width: double.infinity,
          height: 270,
          child: ListView.builder(
            shrinkWrap: true,
            scrollDirection: Axis.horizontal,
            padding: EdgeInsets.symmetric(horizontal: 8),
            physics: BouncingScrollPhysics(),
            itemBuilder: (context, index) {
              return Container(
                width: 240,
                padding: EdgeInsets.all(12),
                margin: EdgeInsets.symmetric(horizontal: 8),
                decoration: BoxDecoration(
                    color: Theme.of(context).colorScheme.surface,
                    borderRadius: BorderRadius.circular(16)),
                child: Column(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: [
                    ClipRRect(
                      borderRadius: BorderRadius.circular(8),
                      child: AspectRatio(
                        aspectRatio: 16 / 9,
                        child: Image.network(
                          'https://s3-alpha-sig.figma.com/img/c720/df1c/d8288c0392372fb3dd15824b84b9d563?Expires=1740960000&Key-Pair-Id=APKAQ4GOSFWCW27IBOMQ&Signature=CMct6yvsv~g0YEUDRp-D3prnQve4nZc5mB~oJ4jbRsH63ltvM4yoCKbTYJLCm~ONwb9e7TNoFO1Q1pO8sPz3TBB-gAFIX9j53fz40ypp0VsRXSOK91G7LBj82V974E1Yqxol2fhAZ8icTAaOZVJgJH-47EG3wQqujGieHbcOYCCBZoCPP0a~jKG~LsE-EtLmP0RdXOuqE9-o2gMzEBH2TMXLtWJXYtA6dS~XHPBIeUXn4Sa7Hy4ca3pGb6wXN4owNt4SeanQuxeR-CEgDYJTI~tU6LkW1N2TSPOt6iGn5Jbb4XdkFjKA7dkwijG9mEU9F3wy16aMj7a1Z1yEwAvlwg__',
                          height: 100,
                          fit: BoxFit.cover,
                        ),
                      ),
                    ),
                    8.h,
                    SelectableText(
                      'Milam\'s Markets',
                      style: Theme.of(context)
                          .textTheme
                          .titleMedium
                          ?.copyWith(overflow: TextOverflow.ellipsis),
                      maxLines: 1,
                    ),
                    8.h,
                    Row(
                      children: [
                        Icon(Icons.location_on_outlined),
                        8.w,
                        SelectableText(
                          'Miami Springs, Florida',
                          style: Theme.of(context)
                              .textTheme
                              .bodyMedium
                              ?.copyWith(overflow: TextOverflow.ellipsis),
                          maxLines: 1,
                        )
                      ],
                    ),
                    8.h,
                    SizedBox(
                      child: ElevatedButton(
                          onPressed: () {}, child: Text('See more about')),
                    ),
                  ],
                ),
              );
            },
          ),
        )
      ],
    );
  }
}
