Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Added Graph QL Support #244

Closed
wants to merge 2 commits into from
Closed
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 3 additions & 1 deletion lib/consts.dart
Original file line number Diff line number Diff line change
Expand Up @@ -241,10 +241,11 @@ final kColorHttpMethodPost = Colors.blue.shade800;
final kColorHttpMethodPut = Colors.amber.shade900;
final kColorHttpMethodPatch = kColorHttpMethodPut;
final kColorHttpMethodDelete = Colors.red.shade800;
final kColorHttpMethodGraphQL = Colors.green.shade800;

enum RequestItemMenuOption { edit, delete, duplicate }

enum HTTPVerb { get, head, post, put, patch, delete }
enum HTTPVerb { get, head, post, put, patch, delete , graphql }
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

GraphQL operates over HTTP, it doesn’t map directly to HTTP verbs like a RESTful service does. GraphQL, on the other hand, is a query language and data manipulation language for APIs.


enum FormDataType { text, file }

Expand All @@ -255,6 +256,7 @@ const kMethodsWithBody = [
HTTPVerb.put,
HTTPVerb.patch,
HTTPVerb.delete,
HTTPVerb.graphql,
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Same comment that I left in the code above. Instead, you can define a ProtocolType enumeration and include HTTP and GraphQL.

];

const kDefaultHttpMethod = HTTPVerb.get;
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -24,26 +24,27 @@ class EditRequestBody extends ConsumerWidget {
margin: kPt5o10,
child: Column(
children: [
const SizedBox(
height: kHeaderHeight,
child: Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Text(
"Select Content Type:",
),
DropdownButtonBodyContentType(),
],
),
),
SizedBox(
height: kHeaderHeight,
child: requestModel!.method != HTTPVerb.graphql
? const Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Text(
"Select Content Type:",
),
DropdownButtonBodyContentType(),
],
)
: const Text("Enter the query")),
Expanded(
child: switch (contentType) {
ContentType.formdata => const FormDataWidget(),
// TODO: Fix JsonTextFieldEditor & plug it here
ContentType.json => TextFieldEditor(
key: Key("$selectedId-json-body"),
fieldKey: "$selectedId-json-body-editor",
initialValue: requestModel?.requestBody,
initialValue: requestModel.requestBody,
onChanged: (String value) {
ref
.read(collectionStateNotifierProvider.notifier)
Expand All @@ -53,7 +54,7 @@ class EditRequestBody extends ConsumerWidget {
_ => TextFieldEditor(
key: Key("$selectedId-body"),
fieldKey: "$selectedId-body-editor",
initialValue: requestModel?.requestBody,
initialValue: requestModel.requestBody,
onChanged: (String value) {
ref
.read(collectionStateNotifierProvider.notifier)
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -24,6 +24,7 @@ class EditRequestPane extends ConsumerWidget {
.select((value) => value?.requestBody?.length));

return RequestPane(
ref: ref,
selectedId: selectedId,
codePaneVisible: codePaneVisible,
tabIndex: tabIndex,
Expand Down
8 changes: 8 additions & 0 deletions lib/services/http_service.dart
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

A separate service file must be made for GraphQL instead of modifying this one.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thanks for giving the info!
I was also wondering the same :)
I wanted to ask if the logic of implementation
String requestBody = '{"query": "${body!.replaceAll('\n', '')}"}'; is correct and the UI design is on the point
Is there's a suggestion on that I would love to work on it and solve the bugs :)

Original file line number Diff line number Diff line change
Expand Up @@ -81,6 +81,14 @@ Future<(http.Response?, Duration?, String?)> request(
response =
await http.delete(requestUrl, headers: headers, body: body);
break;
case HTTPVerb.graphql:
String requestBody = '{"query": "${body!.replaceAll('\n', '')}"}';
final int contentLength = utf8.encode(requestBody).length;
headers[HttpHeaders.contentTypeHeader] = 'application/json';
headers[HttpHeaders.contentLengthHeader] = contentLength.toString();
response =
await http.post(requestUrl, headers: headers, body: requestBody);
break;
}
stopwatch.stop();
return (response, stopwatch.elapsed, null);
Expand Down
3 changes: 3 additions & 0 deletions lib/utils/ui_utils.dart
Original file line number Diff line number Diff line change
Expand Up @@ -46,6 +46,9 @@ Color getHTTPMethodColor(HTTPVerb method,
case HTTPVerb.delete:
col = kColorHttpMethodDelete;
break;
case HTTPVerb.graphql:
col = kColorHttpMethodGraphQL;
break;
}
if (brightness == Brightness.dark) {
col = getDarkModeColor(col);
Expand Down
11 changes: 10 additions & 1 deletion lib/widgets/request_widgets.dart
Original file line number Diff line number Diff line change
@@ -1,5 +1,7 @@
import 'package:apidash/providers/collection_providers.dart';
import 'package:flutter/material.dart';
import 'package:apidash/consts.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart';
import 'tabs.dart';

class RequestPane extends StatefulWidget {
Expand All @@ -11,6 +13,7 @@ class RequestPane extends StatefulWidget {
this.onPressedCodeButton,
this.onTapTabBar,
required this.children,
required this.ref,
this.showIndicators = const [false, false, false],
});

Expand All @@ -21,6 +24,7 @@ class RequestPane extends StatefulWidget {
final void Function(int)? onTapTabBar;
final List<Widget> children;
final List<bool> showIndicators;
final WidgetRef ref;

@override
State<RequestPane> createState() => _RequestPaneState();
Expand All @@ -45,6 +49,10 @@ class _RequestPaneState extends State<RequestPane>
if (widget.tabIndex != null) {
_controller.index = widget.tabIndex!;
}
final selectedId = widget.ref.watch(selectedIdStateProvider);
final requestModel = widget.ref
.read(collectionStateNotifierProvider.notifier)
.getRequestModel(selectedId!);
return Column(
children: [
Padding(
Expand Down Expand Up @@ -90,7 +98,8 @@ class _RequestPaneState extends State<RequestPane>
showIndicator: widget.showIndicators[1],
),
TabLabel(
text: 'Body',
text:requestModel?.method == HTTPVerb
.graphql ?'Query':'Body',
showIndicator: widget.showIndicators[2],
),
],
Expand Down