feat: extract issue and pull request common widget, add more type

This commit is contained in:
Rongjian Zhang 2019-01-28 21:32:01 +08:00
parent 16240278f6
commit 7c6c211d1c
10 changed files with 509 additions and 336 deletions

View File

@ -1,7 +1,7 @@
import 'package:flutter/cupertino.dart'; import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
import '../widgets/event.dart';
import 'package:git_flux/utils/utils.dart'; import 'package:git_flux/utils/utils.dart';
import 'package:git_flux/widgets/widgets.dart';
class HomeScreen extends StatefulWidget { class HomeScreen extends StatefulWidget {
@override @override

View File

@ -1,33 +1,46 @@
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
import 'package:flutter/cupertino.dart'; import 'package:flutter/cupertino.dart';
import 'package:git_flux/utils/utils.dart';
import 'package:git_flux/widgets/widgets.dart';
class IssueScreen extends StatefulWidget { Future queryIssue(int id, String owner, String name) async {
final int id; var data = await query('''
final String repo; {
IssueScreen(this.id, this.repo); repository(owner: "$owner", name: "$name") {
issue(number: $id) {
@override $graphqlChunk1
_IssueScreenState createState() => _IssueScreenState(); timeline(first: $pageSize) {
pageInfo {
hasNextPage
endCursor
}
nodes {
$graghqlChunk
}
}
}
}
}
''');
return data['repository']['issue'];
} }
class _IssueScreenState extends State<IssueScreen> { class IssueScreen extends StatelessWidget {
int active = 0; final int id;
final String owner;
final String name;
IssueScreen(this.id, this.owner, this.name);
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
return CupertinoPageScaffold( return IssuePullRequestScreen(
navigationBar: CupertinoNavigationBar( id: id,
middle: Text(widget.repo + ' #' + widget.id.toString()), owner: owner,
trailing: Icon(Icons.more_vert, size: 24), name: name,
), init: () => queryIssue(id, owner, name),
child: SafeArea( extra: Row(
child: Column( children: <Widget>[Text('test')],
children: <Widget>[
Container(
child: Text(widget.id.toString() + widget.repo),
),
],
),
), ),
); );
} }

View File

@ -1,38 +1,28 @@
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
import 'package:flutter/cupertino.dart'; import 'package:flutter/cupertino.dart';
import 'package:url_launcher/url_launcher.dart';
import 'package:flutter_markdown/flutter_markdown.dart';
import 'package:git_flux/utils/utils.dart'; import 'package:git_flux/utils/utils.dart';
import 'package:git_flux/widgets/widgets.dart'; import 'package:git_flux/widgets/widgets.dart';
const PAGE_SIZE = 100;
Future queryPullRequest(int id, String owner, String name) async { Future queryPullRequest(int id, String owner, String name) async {
var data = await query(''' var data = await query('''
{ {
repository(owner: "$owner", name: "$name") { repository(owner: "$owner", name: "$name") {
pullRequest(number: $id) { pullRequest(number: $id) {
title $graphqlChunk1
createdAt
body
merged merged
permalink permalink
additions additions
deletions deletions
author {
login
avatarUrl
}
commits { commits {
totalCount totalCount
} }
timeline(first: $PAGE_SIZE) { timeline(first: $pageSize) {
pageInfo { pageInfo {
hasNextPage hasNextPage
endCursor endCursor
} }
nodes { nodes {
__typename $graghqlChunk
... on ReviewRequestedEvent { ... on ReviewRequestedEvent {
createdAt createdAt
actor { actor {
@ -51,14 +41,6 @@ Future queryPullRequest(int id, String owner, String name) async {
login login
} }
} }
... on IssueComment {
createdAt
body
author {
login
avatarUrl
}
}
... on LabeledEvent { ... on LabeledEvent {
createdAt createdAt
label { label {
@ -69,16 +51,6 @@ Future queryPullRequest(int id, String owner, String name) async {
login login
} }
} }
... on ReferencedEvent {
createdAt
actor {
login
}
commit {
oid
url
}
}
... on MergedEvent { ... on MergedEvent {
createdAt createdAt
mergeRefName mergeRefName
@ -97,15 +69,6 @@ Future queryPullRequest(int id, String owner, String name) async {
} }
headRefName headRefName
} }
... on Commit {
committedDate
oid
author {
user {
login
}
}
}
} }
} }
} }
@ -115,285 +78,47 @@ Future queryPullRequest(int id, String owner, String name) async {
return data['repository']['pullRequest']; return data['repository']['pullRequest'];
} }
class PullRequestScreen extends StatefulWidget { class PullRequestScreen extends StatelessWidget {
final int id; final int id;
final String owner; final String owner;
final String name; final String name;
PullRequestScreen(this.id, this.owner, this.name); PullRequestScreen(this.id, this.owner, this.name);
@override
_PullRequestScreenState createState() => _PullRequestScreenState();
}
class _PullRequestScreenState extends State<PullRequestScreen> {
int active = 0;
Map<String, dynamic> payload;
@override
void initState() {
super.initState();
queryPullRequest(widget.id, widget.owner, widget.name).then((_payload) {
setState(() {
payload = _payload;
});
});
}
get _fullName => widget.owner + '/' + widget.name;
Widget _buildBadge() { Widget _buildBadge() {
bool merged = payload['merged']; // bool merged = payload['merged'];
int bgColor = merged ? 0xff6f42c1 : 0xff2cbe4e; // int bgColor = merged ? Palette.purple : Palette.green;
IconData iconData = merged ? Octicons.git_merge : Octicons.git_pull_request; // IconData iconData = merged ? Octicons.git_merge : Octicons.git_pull_request;
String text = merged ? 'Merged' : 'Open'; // String text = merged ? 'Merged' : 'Open';
return Container( // return Container(
decoration: BoxDecoration( // decoration: BoxDecoration(
color: Color(bgColor), // color: Color(bgColor),
borderRadius: BorderRadius.all(Radius.circular(4)), // borderRadius: BorderRadius.all(Radius.circular(4)),
), // ),
padding: EdgeInsets.all(6), // padding: EdgeInsets.all(6),
child: Row( // child: Row(
children: <Widget>[ // children: <Widget>[
Icon(iconData, color: Colors.white, size: 15), // Icon(iconData, color: Colors.white, size: 15),
Text(text, // Text(text,
style: TextStyle( // style: TextStyle(
color: Colors.white, // color: Colors.white,
fontWeight: FontWeight.w600, // fontWeight: FontWeight.w600,
)), // )),
], // ],
), // ),
); // );
} return Text('test');
TextSpan _buildReviewText(BuildContext context, item) {
switch (item['state']) {
case 'APPROVED':
return TextSpan(text: ' approved these changes');
default:
return TextSpan(text: 'not implement');
}
}
TextSpan _buildCommitText(BuildContext context, item) {}
Widget _buildComment(BuildContext context, item) {
// return Text('comment');
return Column(children: <Widget>[
Row(children: <Widget>[
Avatar(item['author']['login'], item['author']['avatarUrl']),
Padding(padding: EdgeInsets.only(left: 10)),
Expanded(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
UserName(item['author']['login']),
Text('opened ' + TimeAgo.formatFromString(item['createdAt'])),
],
),
),
]),
Padding(
padding: const EdgeInsets.only(left: 20, top: 10),
child: MarkdownBody(data: item['body']),
),
]);
}
Widget _buildItemItem({
String actor,
IconData iconData = Octicons.octoface,
int iconColor = 0xff959da5,
TextSpan textSpan,
item,
}) {
return Row(
children: <Widget>[
Icon(iconData, color: Color(iconColor), size: 16),
Padding(padding: EdgeInsets.only(left: 4)),
Expanded(
child: RichText(
text: TextSpan(style: TextStyle(color: Colors.black), children: [
createUserSpan(actor),
textSpan,
// TextSpan(text: ' ' + TimeAgo.formatFromString(item['createdAt']))
]),
),
),
],
);
}
Widget _buildItem(BuildContext context, item) {
switch (item['__typename']) {
case 'IssueComment':
return _buildComment(context, item);
case 'ReviewRequestedEvent':
return _buildItemItem(
iconData: Octicons.eye,
actor: payload['author']['login'],
textSpan: TextSpan(children: [
TextSpan(text: ' requested a review from '),
createUserSpan(item['requestedReviewer']['login']),
]),
item: item,
);
case 'PullRequestReview':
return _buildItemItem(
actor: item['author']['login'],
iconColor: 0xff28a745,
iconData: Octicons.check,
textSpan: _buildReviewText(context, item),
item: item,
);
case 'LabeledEvent':
return _buildItemItem(
actor: item['actor']['login'],
iconData: Octicons.tag,
textSpan: TextSpan(children: [
TextSpan(text: ' added the '),
TextSpan(text: item['label']['name']),
TextSpan(text: 'label'),
]),
item: item,
);
case 'ReferencedEvent':
return _buildItemItem(
actor: item['actor']['login'],
iconData: Octicons.bookmark,
textSpan: TextSpan(children: [
TextSpan(text: ' referenced this pull request from commit '),
TextSpan(text: item['commit']['oid'].substring(0, 8)),
]),
item: item,
);
case 'MergedEvent':
return _buildItemItem(
actor: item['actor']['login'],
iconData: Octicons.git_merge,
iconColor: 0xff6f42c1,
textSpan: TextSpan(children: [
TextSpan(text: ' merged commit '),
TextSpan(text: item['commit']['oid'].substring(0, 8)),
TextSpan(text: ' into '),
TextSpan(text: item['mergeRefName']),
]),
item: item,
);
case 'HeadRefDeletedEvent':
return _buildItemItem(
actor: item['actor']['login'],
iconData: Octicons.git_branch,
textSpan: TextSpan(children: [
TextSpan(text: ' deleted the '),
TextSpan(text: item['headRefName']),
TextSpan(text: ' branch'),
]),
item: item,
);
case 'Commit':
return _buildItemItem(
actor: item['author']['user']['login'],
iconData: Octicons.git_commit,
textSpan: TextSpan(children: [
TextSpan(text: ' added commit '),
TextSpan(text: item['oid'].substring(0, 8))
]),
item: item,
);
default:
return Text('no data', style: TextStyle(color: Colors.redAccent));
}
}
Widget _buildBody(BuildContext context) {
if (payload == null) {
return CupertinoActivityIndicator();
}
List items = payload['timeline']['nodes'];
return Column(children: <Widget>[
Container(
// padding: EdgeInsets.all(10),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
Row(
children: <Widget>[
_buildBadge(),
],
),
Text(payload['title'],
style: TextStyle(
fontSize: 18,
fontWeight: FontWeight.bold,
height: 2,
)),
_buildComment(context, payload),
// ListView.builder(
// shrinkWrap: true,
// itemCount: comments.length,
// itemBuilder: _buildCommentItem,
// ),
Column(
children: items.map((item) {
return Container(
padding: EdgeInsets.all(10),
decoration: BoxDecoration(
border: Border(
bottom: BorderSide(
color:
CupertinoColors.extraLightBackgroundGray))),
child: _buildItem(context, item),
);
}).toList(),
),
],
),
)
]);
} }
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
return CupertinoPageScaffold( return IssuePullRequestScreen(
navigationBar: CupertinoNavigationBar( id: id,
middle: Text(_fullName + ' #' + widget.id.toString()), owner: owner,
trailing: Icon(Icons.more_vert, size: 24), name: name,
), init: () => queryPullRequest(id, owner, name),
child: SafeArea( extra: Row(
child: SingleChildScrollView( children: <Widget>[_buildBadge()],
child: Column(
children: <Widget>[
SizedBox(
width: double.infinity,
height: 48,
child: CupertinoSegmentedControl(
groupValue: active,
onValueChanged: (value) async {
switch (value) {
case 1:
launch(
'https://github.com/$_fullName/pull/${widget.id}/commits');
break;
case 2:
launch(
'https://github.com/$_fullName/pull/${widget.id}/files');
break;
}
setState(() {});
},
children: {
0: Text('Conversation'),
1: Text('Commits'),
2: Text('Changes')
},
),
),
_buildBody(context),
],
),
),
), ),
); );
} }

View File

@ -36,7 +36,7 @@ Future<dynamic> query(String query) async {
if (res['errors'] != null) { if (res['errors'] != null) {
throw new Exception(res['errors'].toString()); throw new Exception(res['errors'].toString());
} }
print(res); // print(res);
return res['data']; return res['data'];
} }

View File

@ -1,3 +1,118 @@
import 'package:flutter/material.dart';
export 'github.dart'; export 'github.dart';
export 'octicons.dart'; export 'octicons.dart';
export 'timeago.dart'; export 'timeago.dart';
class Palette {
static const green = 0xff2cbe4e;
static const purple = 0xff6f42c1;
static const red = 0xffcb2431;
static const gray = 0xff959da5;
}
final pageSize = 100;
final graphqlChunk1 = '''
title
createdAt
body
author {
login
avatarUrl
}
''';
var graghqlChunk = '''
__typename
... on IssueComment {
createdAt
body
author {
login
avatarUrl
}
}
... on Commit {
committedDate
oid
author {
user {
login
}
}
}
... on ReferencedEvent {
createdAt
isCrossRepository
actor {
login
}
commit {
oid
url
}
commitRepository {
owner {
login
}
name
}
}
... on RenamedTitleEvent {
createdAt
previousTitle
currentTitle
actor {
login
}
}
... on ClosedEvent {
createdAt
actor {
login
}
}
... on ReopenedEvent {
createdAt
actor {
login
}
}
... on CrossReferencedEvent {
createdAt
actor {
login
}
source {
__typename
... on Issue {
number
repository {
owner {
login
}
name
}
}
... on PullRequest {
number
repository {
owner {
login
}
name
}
}
}
}
''';
var warning = Text('xxx', style: TextStyle(color: Colors.redAccent));
var warningSpan =
TextSpan(text: 'xxx', style: TextStyle(color: Colors.redAccent));

View File

@ -0,0 +1,33 @@
import 'package:flutter/material.dart';
import 'package:flutter_markdown/flutter_markdown.dart';
import 'package:git_flux/widgets/widgets.dart';
import 'package:git_flux/utils/utils.dart';
class CommentItem extends StatelessWidget {
final Map<String, dynamic> item;
CommentItem(this.item);
@override
Widget build(BuildContext context) {
return Column(children: <Widget>[
Row(children: <Widget>[
Avatar(item['author']['login'], item['author']['avatarUrl']),
Padding(padding: EdgeInsets.only(left: 10)),
Expanded(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
UserName(item['author']['login']),
Text('opened ' + TimeAgo.formatFromString(item['createdAt'])),
],
),
),
]),
Padding(
padding: const EdgeInsets.only(left: 20, top: 10),
child: MarkdownBody(data: item['body']),
),
]);
}
}

View File

@ -65,6 +65,10 @@ class EventItem extends StatelessWidget {
_buildRepo(context), _buildRepo(context),
// TextSpan(text: event.payload['comment']['body']) // TextSpan(text: event.payload['comment']['body'])
]); ]);
case 'ForkEvent':
return TextSpan(children: [
TextSpan(text: ' forked '),
]);
default: default:
return TextSpan( return TextSpan(
text: 'Type ${event.type} Not implement yet', text: 'Type ${event.type} Not implement yet',
@ -117,9 +121,10 @@ class EventItem extends StatelessWidget {
TextSpan _buildIssue(BuildContext context) { TextSpan _buildIssue(BuildContext context) {
int id = event.payload['issue']['number']; int id = event.payload['issue']['number'];
String repo = event.repo.name; String name = event.repo.name;
var arr = name.split('/');
return _buildLink( return _buildLink(
context, '#' + id.toString(), () => IssueScreen(id, repo)); context, '#' + id.toString(), () => IssueScreen(id, arr[0], arr[1]));
} }
TextSpan _buildPullRequest(BuildContext context, int id) { TextSpan _buildPullRequest(BuildContext context, int id) {
@ -141,6 +146,8 @@ class EventItem extends StatelessWidget {
return Octicons.repo_push; return Octicons.repo_push;
case 'WatchEvent': case 'WatchEvent':
return Octicons.star; return Octicons.star;
case 'ForkEvent':
return Octicons.repo_forked;
default: default:
return Octicons.octoface; return Octicons.octoface;
} }

View File

@ -0,0 +1,89 @@
import 'package:flutter/material.dart';
import 'package:flutter/cupertino.dart';
import 'package:git_flux/widgets/widgets.dart';
// Widget of issue screen and pull request screen
class IssuePullRequestScreen extends StatefulWidget {
final int id;
final String owner;
final String name;
final Function init;
final Widget extra;
IssuePullRequestScreen({
this.id,
this.owner,
this.name,
this.init,
this.extra,
});
@override
_IssuePullRequestScreenState createState() => _IssuePullRequestScreenState();
}
class _IssuePullRequestScreenState extends State<IssuePullRequestScreen> {
Map<String, dynamic> payload;
@override
void initState() {
super.initState();
widget.init().then((_payload) {
setState(() {
payload = _payload;
});
});
}
get _fullName => widget.owner + '/' + widget.name;
Widget _buildBody(BuildContext context) {
if (payload == null) {
return CupertinoActivityIndicator();
}
List items = payload['timeline']['nodes'];
return Column(children: <Widget>[
Container(
// padding: EdgeInsets.all(10),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
widget.extra,
Text(payload['title'],
style: TextStyle(
fontSize: 18,
fontWeight: FontWeight.bold,
height: 1.2,
)),
CommentItem(payload),
// ListView.builder(
// shrinkWrap: true,
// itemCount: comments.length,
// itemBuilder: _buildCommentItem,
// ),
Column(
children:
items.map((item) => TimelineItem(item, payload)).toList()),
],
),
)
]);
}
@override
Widget build(BuildContext context) {
return CupertinoPageScaffold(
navigationBar: CupertinoNavigationBar(
middle: Text(_fullName + ' #' + widget.id.toString()),
trailing: Icon(Icons.more_vert, size: 24),
),
child: SafeArea(
child: SingleChildScrollView(
child: _buildBody(context),
),
),
);
}
}

View File

@ -0,0 +1,188 @@
import 'package:flutter/material.dart';
import 'package:flutter/cupertino.dart';
import 'package:git_flux/utils/utils.dart';
import 'package:git_flux/widgets/widgets.dart';
class TimelineItem extends StatelessWidget {
final Map<String, dynamic> item;
final Map<String, dynamic> payload;
TimelineItem(this.item, this.payload);
TextSpan _buildReviewText(BuildContext context, item) {
switch (item['state']) {
case 'APPROVED':
return TextSpan(text: ' approved these changes');
case 'COMMENTED':
return TextSpan(text: ' commented ');
default:
return warningSpan;
}
}
Widget _buildItem({
String actor,
IconData iconData = Octicons.octoface,
int iconColor = Palette.gray,
TextSpan textSpan,
item,
}) {
return Row(
children: <Widget>[
Icon(iconData, color: Color(iconColor), size: 16),
Padding(padding: EdgeInsets.only(left: 4)),
Expanded(
child: RichText(
text: TextSpan(style: TextStyle(color: Colors.black), children: [
createUserSpan(actor),
textSpan,
// TextSpan(text: ' ' + TimeAgo.formatFromString(item['createdAt']))
]),
),
),
],
);
}
Widget _buildByType(BuildContext context) {
switch (item['__typename']) {
case 'IssueComment':
return CommentItem(item);
case 'ReferencedEvent':
// TODO: isCrossRepository
if (item['commit'] == null) {
return Container();
}
return _buildItem(
actor: item['actor']['login'],
iconData: Octicons.bookmark,
textSpan: TextSpan(children: [
TextSpan(text: ' referenced this pull request from commit '),
TextSpan(text: item['commit']['oid'].substring(0, 8)),
]),
item: item,
);
case 'RenamedTitleEvent':
return _buildItem(
actor: item['actor']['login'],
iconData: Octicons.pencil,
textSpan: TextSpan(children: [
TextSpan(text: ' changed the title '),
TextSpan(
text: item['previousTitle'],
style: TextStyle(decoration: TextDecoration.lineThrough),
),
TextSpan(text: ' to '),
TextSpan(text: item['currentTitle'])
]),
item: item,
);
case 'ClosedEvent':
return _buildItem(
actor: item['actor']['login'],
iconData: Octicons.circle_slash,
iconColor: Palette.red,
textSpan: TextSpan(text: ' closed this '),
item: item,
);
case 'ReopenedEvent':
return _buildItem(
actor: item['actor']['login'],
iconData: Octicons.primitive_dot,
iconColor: Palette.green,
textSpan: TextSpan(text: ' reopened this '),
item: item,
);
case 'CrossReferencedEvent':
return _buildItem(
actor: item['actor']['login'],
iconData: Octicons.primitive_dot,
iconColor: Palette.green,
textSpan: TextSpan(
text: ' referenced this on #' +
item['source']['number'].toString()),
item: item,
);
//
case 'ReviewRequestedEvent':
return _buildItem(
iconData: Octicons.eye,
actor: payload['author']['login'],
textSpan: TextSpan(children: [
TextSpan(text: ' requested a review from '),
createUserSpan(item['requestedReviewer']['login']),
]),
item: item,
);
case 'PullRequestReview':
return _buildItem(
actor: item['author']['login'],
iconColor: 0xff28a745,
iconData: Octicons.check,
textSpan: _buildReviewText(context, item),
item: item,
);
case 'LabeledEvent':
return _buildItem(
actor: item['actor']['login'],
iconData: Octicons.tag,
textSpan: TextSpan(children: [
TextSpan(text: ' added the '),
TextSpan(text: item['label']['name']),
TextSpan(text: 'label'),
]),
item: item,
);
case 'MergedEvent':
return _buildItem(
actor: item['actor']['login'],
iconData: Octicons.git_merge,
iconColor: 0xff6f42c1,
textSpan: TextSpan(children: [
TextSpan(text: ' merged commit '),
TextSpan(text: item['commit']['oid'].substring(0, 8)),
TextSpan(text: ' into '),
TextSpan(text: item['mergeRefName']),
]),
item: item,
);
case 'HeadRefDeletedEvent':
return _buildItem(
actor: item['actor']['login'],
iconData: Octicons.git_branch,
textSpan: TextSpan(children: [
TextSpan(text: ' deleted the '),
TextSpan(text: item['headRefName']),
TextSpan(text: ' branch'),
]),
item: item,
);
case 'Commit':
return _buildItem(
actor: item['author']['user']['login'],
iconData: Octicons.git_commit,
textSpan: TextSpan(children: [
TextSpan(text: ' added commit '),
TextSpan(text: item['oid'].substring(0, 8))
]),
item: item,
);
default:
return warning;
}
}
@override
Widget build(BuildContext context) {
return Container(
padding: EdgeInsets.all(10),
decoration: BoxDecoration(
border: Border(
bottom:
BorderSide(color: CupertinoColors.extraLightBackgroundGray))),
child: _buildByType(context),
);
}
}

View File

@ -1,3 +1,6 @@
export 'avatar.dart'; export 'avatar.dart';
export 'event.dart'; export 'event_item.dart';
export 'user_name.dart'; export 'user_name.dart';
export 'timeline_item.dart';
export 'comment_item.dart';
export 'issue_pull_request.dart';