import 'package:flutter/material.dart';
import 'package:loris/business_logic/notifications/notifs.dart';
import 'package:loris/dialogues/profile_view.dart';
import 'package:loris/partials/post.dart';
import '../../global.dart' as global;
import 'package:loris/themes/themes.dart' as themes;

class SingleNotif extends StatelessWidget {
  const SingleNotif({
    required this.model,
    Key? key,
  }) : super(key: key);
  final NotificationModel model;

  @override
  Widget build(BuildContext context) {
    return Align(
      child: Container(
        width: global.getWidth(context),
        constraints: global.getConstraints(context),
        padding: themes.defaultInsideMargins,
        decoration: BoxDecoration(
          color: Theme.of(context).colorScheme.surface,
          border: Border.all(
            color: Theme.of(context).colorScheme.secondary,
            width: 2,
          ),
          borderRadius: const BorderRadius.all(themes.defaultRadius),
        ),
        child: Material(
          child: Column(
            children: [
              InkWell(
                borderRadius: const BorderRadius.all(themes.defaultRadius),
                onTap: () => showDialog(
                  barrierColor: Colors.transparent,
                  context: context,
                  builder: (context) => ProfileView(model: model.account),
                ),
                child: Row(
                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
                  children: [
                    ProfilePic(url: model.account.avatar),
                    const SizedBox(
                      width: 8,
                    ),
                    Expanded(
                      flex: 20,
                      child: Column(
                        crossAxisAlignment: CrossAxisAlignment.start,
                        children: [
                          SelectableText(
                            model.account.displayName,
                            style: Theme.of(context).textTheme.displaySmall,
                          ),
                          SelectableText.rich(
                            TextSpan(
                              text: "${model.account.acct} ",
                              style: Theme.of(context).textTheme.bodySmall,
                              children: [
                                TextSpan(
                                    text: model.type.actionName,
                                    style:
                                        Theme.of(context).textTheme.bodyMedium)
                              ],
                            ),
                          ),
                        ],
                      ),
                    ),
                    Icon(
                      model.type.icon,
                      size: 64,
                    ),
                  ],
                ),
              ),
              const SizedBox(
                height: 8,
              ),
              (model.post != null)
                  ? (Post(
                      reblogVisible: false,
                      model: model.post!,
                    ))
                  : const SizedBox(
                      width: 0,
                      height: 0,
                    ),
            ],
          ),
        ),
      ),
    );
  }
}