appbar

import 'package:app/src/components/buttons/about_merchant_button.dart';
import 'package:app/src/components/buttons/back_button.dart';
import 'package:app/src/components/buttons/follow_button.dart';
import 'package:app/src/components/buttons/search_button.dart';
import 'package:app/src/components/cards/followers_count_card.dart';
import 'package:app/src/components/cards/merchant_thumbnail_card.dart';
import 'package:app/src/models/merchant_model.dart';
import 'package:flutter/material.dart';

class SingleMerchantAppBar extends StatefulWidget {
  final MerchantModel? merchant;
  const SingleMerchantAppBar({
    Key? key,
    this.merchant,
  }) : super(key: key);

  @override
  _SingleMerchantAppBarState createState() => _SingleMerchantAppBarState();
}

class _SingleMerchantAppBarState extends State<SingleMerchantAppBar> {
  @override
  Widget build(BuildContext context) {
    return Stack(
      children: [
        _buildBackgroundImage(context),
        Container(
          padding: EdgeInsets.all(20),
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              Row(
                mainAxisAlignment: MainAxisAlignment.spaceBetween,
                children: <Widget>[
                  CustomBackButton(
                    greyBackground: true,
                  ),
                  CustomSearchButton(
                    greyBackground: true,
                    onPressed: () {},
                  ),
                ],
              ),
              SizedBox(
                height: 30,
              ),
              Row(
                crossAxisAlignment: CrossAxisAlignment.start,
                children: <Widget>[
                  MerchantThumbnailCard(
                    imageUrl: "assets/images/aarong_logo_small.png",
                  ),
                  SizedBox(width: 15),
                  Column(
                    crossAxisAlignment: CrossAxisAlignment.start,
                    children: [
                      _buildNameAndRating(),
                      SizedBox(
                        height: 15,
                      ),
                      _buildFollowRow(context),
                    ],
                  ),
                ],
              ),
            ],
          ),
        ),
      ],
    );
  }

  Widget _buildFollowRow(BuildContext context) {
    return Row(
      children: <Widget>[
        FollowButton(onPressed: () {}),
        SizedBox(width: 20),
        FollowersCountCard(),
        SizedBox(width: 20),
        AboutMerchantButton(onPressed: () {}),
      ],
    );
  }

  Widget _buildBackgroundImage(BuildContext context) {
    return Container(
      decoration: BoxDecoration(
        borderRadius: BorderRadius.only(
          bottomRight: Radius.circular(20.0),
          bottomLeft: Radius.circular(20.0),
        ),
        image: DecorationImage(
          image: AssetImage('assets/images/mock_aarong_background_1.png'),
          fit: BoxFit.fitWidth,
        ),
      ),
    );
  }

  Widget _buildNameAndRating() {
    return Row(
      children: <Widget>[
        Text(
          'AARONG',
          style: TextStyle(
            color: Colors.white,
            fontSize: 18,
            fontWeight: FontWeight.w600,
          ),
        ),
        SizedBox(width: 30),
        _buildRating(context),
      ],
    );
  }

  Widget _buildRating(BuildContext context) {
    return Row(
      children: <Widget>[
        Icon(
          Icons.star,
          color: Colors.amber,
          size: 20,
        ),
        SizedBox(width: 5),
        Text(
          "4.5",
          style: TextStyle(
            color: Colors.white,
            fontSize: 18,
            fontWeight: FontWeight.w600,
          ),
        )
      ],
    );
  }
}