refactor: repo header

lib/screens/gitlab_project.dart

@@ -7,9 +7,9 @@ import 'package:git_touch/models/gitlab.dart';
 import 'package:git_touch/scaffolds/refresh_stateful.dart';
 import 'package:git_touch/utils/utils.dart';
 import 'package:git_touch/widgets/app_bar_title.dart';
-import 'package:git_touch/widgets/avatar.dart';
 import 'package:git_touch/widgets/entry_item.dart';
 import 'package:git_touch/widgets/markdown_view.dart';
+import 'package:git_touch/widgets/repo_header.dart';
 import 'package:git_touch/widgets/table_view.dart';
 import 'package:provider/provider.dart';
 import 'package:git_touch/models/theme.dart';
@@ -72,44 +72,19 @@ class GitlabProjectScreen extends StatelessWidget {
         return Column(
           crossAxisAlignment: CrossAxisAlignment.stretch,
           children: <Widget>[
-            Container(
+            RepoHeader(
-              padding: CommonStyle.padding,
+              avatarUrl: p.avatarUrl,
-              child: Column(
+              avatarLink: '/${p.namespace.name}',
-                crossAxisAlignment: CrossAxisAlignment.start,
+              owner: p.namespace.name,
-                children: join(SizedBox(height: 12), [
+              name: p.name,
-                  Row(
+              description: p.description,
-                    crossAxisAlignment: CrossAxisAlignment.start,
+              trailings: <Widget>[
-                    children: <Widget>[
-                      Avatar(
-                        url: p.avatarUrl,
-                        size: AvatarSize.small,
-                        linkUrl: '/${p.namespace.name}',
-                      ),
-                      SizedBox(width: 8),
-                      Text(
-                        '${p.namespace.name} / ${p.name}',
-                        style: TextStyle(
-                          fontSize: 20,
-                          color: theme.palette.primary,
-                        ),
-                      ),
-                    ],
-                  ),
-                  if (p.description != null && p.description.isNotEmpty)
-                    Text(
-                      p.description,
-                      style: TextStyle(
-                        color: theme.palette.secondaryText,
-                        fontSize: 17,
-                      ),
-                    ),
                 if (badges.isNotEmpty)
                   Wrap(spacing: 4, runSpacing: 4, children: [
                     for (var label in badges)
                       SvgPicture.network(label.renderedImageUrl, height: 20),
                   ])
-                ]),
+              ],
-              ),
             ),
             CommonStyle.border,
             Row(

lib/screens/repository.dart

@@ -7,12 +7,12 @@ import 'package:git_touch/models/auth.dart';
 import 'package:git_touch/scaffolds/refresh_stateful.dart';
 import 'package:git_touch/utils/utils.dart';
 import 'package:git_touch/widgets/app_bar_title.dart';
-import 'package:git_touch/widgets/avatar.dart';
 import 'package:git_touch/widgets/entry_item.dart';
 import 'package:git_touch/widgets/label.dart';
 import 'package:git_touch/widgets/mutation_button.dart';
-import 'package:git_touch/widgets/link.dart';
+
 import 'package:git_touch/widgets/markdown_view.dart';
+import 'package:git_touch/widgets/repo_header.dart';
 import 'package:git_touch/widgets/table_view.dart';
 import 'package:provider/provider.dart';
 import 'package:git_touch/models/theme.dart';
@@ -152,31 +152,14 @@ class RepositoryScreen extends StatelessWidget {
         return Column(
           crossAxisAlignment: CrossAxisAlignment.stretch,
           children: <Widget>[
-            Container(
+            RepoHeader(
-              padding: CommonStyle.padding,
+              avatarUrl: repo.owner.avatarUrl,
-              child: Column(
+              avatarLink: '/${repo.owner.login}',
-                crossAxisAlignment: CrossAxisAlignment.start,
+              name: repo.name,
-                children: join(SizedBox(height: 12), [
+              owner: repo.owner.login,
-                  Row(
+              description: repo.description,
-                    crossAxisAlignment: CrossAxisAlignment.start,
+              homepageUrl: repo.homepageUrl,
-                    children: <Widget>[
+              actions: [
-                      Avatar(
-                        url: repo.owner.avatarUrl,
-                        size: AvatarSize.small,
-                        linkUrl: '/$owner',
-                      ),
-                      SizedBox(width: 8),
-                      Text(
-                        '$owner / $name',
-                        style: TextStyle(
-                          fontSize: 20,
-                          color: theme.palette.primary,
-                        ),
-                      ),
-                    ],
-                  ),
-                  Row(
-                    children: <Widget>[
                 MutationButton(
                   text: repo.viewerHasStarred ? 'Unstar' : 'Star',
                   onPressed: () async {
@@ -189,8 +172,8 @@ class RepositoryScreen extends StatelessWidget {
                       ),
                     );
                     setState(() {
-                            repo.viewerHasStarred = res.data.removeStar
+                      repo.viewerHasStarred =
-                                    ?.starrable?.viewerHasStarred ??
+                          res.data.removeStar?.starrable?.viewerHasStarred ??
                               res.data.addStar.starrable.viewerHasStarred;
                     });
                   },
@@ -245,26 +228,7 @@ class RepositoryScreen extends StatelessWidget {
                 //   },
                 // ),
               ],
-                  ),
+              trailings: <Widget>[
-                  if (repo.description != null && repo.description.isNotEmpty)
-                    Text(
-                      repo.description,
-                      style: TextStyle(
-                        color: theme.palette.secondaryText,
-                        fontSize: 17,
-                      ),
-                    ),
-                  if (repo.homepageUrl != null && repo.homepageUrl.isNotEmpty)
-                    Link(
-                      url: repo.homepageUrl,
-                      child: Text(
-                        repo.homepageUrl,
-                        style: TextStyle(
-                          color: theme.palette.primary,
-                          fontSize: 17,
-                        ),
-                      ),
-                    ),
                 if (repo.repositoryTopics.nodes.isNotEmpty)
                   // TODO: link
                   Wrap(
@@ -279,8 +243,7 @@ class RepositoryScreen extends StatelessWidget {
                       );
                     }).toList(),
                   )
-                ]),
+              ],
-              ),
             ),
             CommonStyle.border,
             Row(

lib/widgets/repo_header.dart

@@ -0,0 +1,80 @@
+import 'package:flutter/material.dart';
+import 'package:git_touch/models/theme.dart';
+import 'package:git_touch/utils/utils.dart';
+import 'package:git_touch/widgets/avatar.dart';
+import 'package:git_touch/widgets/link.dart';
+import 'package:provider/provider.dart';
+
+class RepoHeader extends StatelessWidget {
+  final String avatarUrl;
+  final String avatarLink;
+  final String owner;
+  final String name;
+  final String description;
+  final String homepageUrl;
+  final List<Widget> actions;
+  final List<Widget> trailings;
+
+  RepoHeader({
+    @required this.avatarUrl,
+    @required this.avatarLink,
+    @required this.owner,
+    @required this.name,
+    @required this.description,
+    this.homepageUrl,
+    this.actions,
+    this.trailings,
+  });
+
+  @override
+  Widget build(BuildContext context) {
+    final theme = Provider.of<ThemeModel>(context);
+    return Container(
+      padding: CommonStyle.padding,
+      child: Column(
+        crossAxisAlignment: CrossAxisAlignment.start,
+        children: join(SizedBox(height: 12), [
+          Row(
+            crossAxisAlignment: CrossAxisAlignment.start,
+            children: <Widget>[
+              Avatar(
+                url: avatarUrl,
+                size: AvatarSize.small,
+                linkUrl: '/$owner',
+              ),
+              SizedBox(width: 8),
+              Text(
+                '$owner / $name',
+                style: TextStyle(
+                  fontSize: 20,
+                  color: theme.palette.primary,
+                ),
+              ),
+            ],
+          ),
+          if (actions != null) ...actions,
+          if (description != null && description.isNotEmpty)
+            Text(
+              description,
+              style: TextStyle(
+                color: theme.palette.secondaryText,
+                fontSize: 17,
+              ),
+            ),
+          if (homepageUrl != null && homepageUrl.isNotEmpty)
+            Link(
+              url: homepageUrl,
+              child: Text(
+                homepageUrl,
+                style: TextStyle(
+                  color: theme.palette.primary,
+                  fontSize: 17,
+                ),
+              ),
+            ),
+          if (trailings != null) ...trailings
+        ]),
+      ),
+    );
+  }
+}