Skip to content

Scalable JSON Visibility #1

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.

Sign up for GitHub

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

Open
mack-at-pieces wants to merge 2 commits into
base: master
Choose a base branch
from
Open

Scalable JSON Visibility #1

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
b3b67c5
JSON Viewer
mack-at-pieces Sep 26, 2022
cf3e6bf
Revert min env version
mack-at-pieces Sep 26, 2022
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
7 changes: 4 additions & 3 deletions lib/app_state.dart
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,5 +1,6 @@
import 'package:flutter/foundation.dart';
import 'package:studio/file_upload.dart';

import 'upload_status_enum.dart';

class AppState extends ChangeNotifier {
UploadStatus _status = UploadStatus.none;
Expand All @@ -9,14 +10,14 @@ class AppState extends ChangeNotifier {
notifyListeners();
}

String _boxName;
String _boxName = '';
String get boxName => _boxName;
set boxName(String boxName) {
_boxName = boxName;
notifyListeners();
}

Map<dynamic, dynamic> _entries;
Map<dynamic, dynamic> _entries = {};
Map<dynamic, dynamic> get entries => _entries;
set entries(Map<dynamic, dynamic> entries) {
_entries = entries;
Expand Down
125 changes: 44 additions & 81 deletions lib/data_explorer.dart
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,4 +1,7 @@
import 'dart:convert';

import 'package:flutter/material.dart';
import 'package:flutter_json_viewer/flutter_json_viewer.dart';
import 'package:provider/provider.dart';
import 'package:studio/app_state.dart';
import 'package:studio/path_view.dart';
Expand All @@ -8,70 +11,50 @@ class DataExplorer extends StatelessWidget {
Widget build(BuildContext context) {
var app = Provider.of<AppState>(context);
return Center(
child: ConstrainedBox(
constraints: BoxConstraints(maxWidth: 900),
child: Card(
margin: EdgeInsets.zero,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.vertical(
top: Radius.circular(20),
),
),
color: Colors.white,
child: Padding(
padding: EdgeInsets.fromLTRB(20, 20, 20, 0),
child: Column(
crossAxisAlignment: CrossAxisAlignment.stretch,
children: <Widget>[
Row(
children: <Widget>[
Expanded(
child: PathView(),
),
if (false)
ConstrainedBox(
constraints: BoxConstraints(maxWidth: 250),
child: TextField(
decoration: InputDecoration(
border: OutlineInputBorder(
borderRadius:
BorderRadius.all(Radius.circular(30)),
),
hintText: 'Search the box',
contentPadding: EdgeInsets.fromLTRB(20, 8, 12, 8),
),
style: TextStyle(
fontSize: 16,
),
),
),
],
),
SizedBox(height: 20),
if (app.path.isEmpty)
Expanded(
child: Scrollbar(
child: ListView.builder(
itemCount: app.entries.length,
itemBuilder: (context, index) {
var mapEntry = app.entries.entries.elementAt(index);
return EntryWidget(
mapEntry.key.toString(), mapEntry.value);
},
),
),
)
/*else
child: Card(
margin: EdgeInsets.all(16),
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.all(Radius.circular(16)),
),
color: Colors.white,
child: Padding(
padding: EdgeInsets.fromLTRB(20, 20, 20, 0),
child: Column(
crossAxisAlignment: CrossAxisAlignment.stretch,
children: <Widget>[
Row(
children: <Widget>[
Expanded(
child: PathView(),
),
],
),
SizedBox(height: 16),
if (app.path.isEmpty)
Expanded(
child: Scrollbar(
child: ListView.builder(
itemCount: app.entries.length,
itemBuilder: (context, index) {
return EntryWidget(app.entries[index]);
var mapEntry = app.entries.entries.elementAt(index);
return EntryWidget(mapEntry.key.toString(), mapEntry.value);
},
),
),*/
],
),
),
),

/// Adds a little buffer between the last json and the bottom of the view
SizedBox(height: 16),
/*else
Expanded(
child: ListView.builder(
itemCount: app.entries.length,
itemBuilder: (context, index) {
return EntryWidget(app.entries[index]);
},
),
),*/
],
),
),
),
Expand All @@ -94,29 +77,9 @@ class EntryWidget extends StatelessWidget {
borderRadius: BorderRadius.all(Radius.circular(10)),
),
clipBehavior: Clip.antiAlias,
child: InkWell(
onTap: () {},
child: Padding(
padding: const EdgeInsets.all(10.0),
child: Row(
children: <Widget>[
SizedBox(
width: 100,
child: Text(
entryKey,
style: TextStyle(
fontSize: 16,
fontWeight: FontWeight.bold,
),
),
),
Text(
value.toString(),
style: TextStyle(fontSize: 16),
),
],
),
),
child: Padding(
padding: const EdgeInsets.all(12.0),
child: JsonViewer({entryKey: jsonDecode(jsonEncode(value))}),
),
);
}
Expand Down
26 changes: 9 additions & 17 deletions lib/file_upload.dart
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,8 @@ import 'package:provider/provider.dart';
import 'package:studio/app_state.dart';
import 'package:studio/data_explorer.dart';

import 'upload_status_enum.dart';

class FileUpload extends StatefulWidget {
@override
_FileUploadState createState() => _FileUploadState();
Expand All @@ -33,23 +35,23 @@ class _FileUploadState extends State<FileUpload> {
void _onDrop(MouseEvent event) {
event.stopPropagation();
event.preventDefault();

var files = event.dataTransfer.files;
if (files.isEmpty) return;

if (files == null || files.isEmpty) return;

var file = files.first;
var reader = FileReader();
reader.onLoadEnd.listen((e) {
_process(file.name, reader.result as Uint8List);
process(file.name, reader.result as Uint8List, context);
});
reader.readAsArrayBuffer(file);

var appState = Provider.of<AppState>(context);
var appState = Provider.of<AppState>(context, listen: false);
appState.status = UploadStatus.processing;
}

void _process(String name, Uint8List bytes) {
var appState = Provider.of<AppState>(context);
void process(String name, Uint8List bytes, BuildContext context) {
var appState = Provider.of<AppState>(context, listen: false);
scheduleMicrotask(() async {
try {
var box = await Hive.openBox('box', bytes: bytes);
Expand All @@ -69,22 +71,19 @@ class _FileUploadState extends State<FileUpload> {
switch (app.status) {
case UploadStatus.none:
return Center(
child:
Text('Drop a .hive file to begin\n\n(This is a preview version)'),
child: Text('Drop a .hive file to begin\n\n(This is a preview version)'),
);
case UploadStatus.processing:
return Center(
child: Text('Processing file'),
);

case UploadStatus.failed:
return Center(
child: Text('Invalid file'),
);
case UploadStatus.success:
return DataExplorer();
}
return Container();
}

@override
Expand All @@ -94,10 +93,3 @@ class _FileUploadState extends State<FileUpload> {
super.dispose();
}
}

enum UploadStatus {
none,
processing,
success,
failed,
}
16 changes: 6 additions & 10 deletions lib/main.dart
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -25,20 +25,16 @@ class MyApp extends StatelessWidget {
fontFamily: 'OpenSans',
),
home: Scaffold(
backgroundColor: Color(0xFFE6EBEB),
backgroundColor: Color(0xFFF3F5F6),
body: Column(
crossAxisAlignment: CrossAxisAlignment.center,
children: <Widget>[
InkWell(
child: ConstrainedBox(
constraints: BoxConstraints(maxWidth: 400),
child: Image.asset('assets/logo.png'),
),
onTap: () {
appState.status = UploadStatus.none;
},
SizedBox(height: 16),
ConstrainedBox(
constraints: BoxConstraints(maxWidth: 300),
child: Image.asset('assets/logo.png'),
),
SizedBox(height: 20),
SizedBox(height: 16),
Expanded(
child: ChangeNotifierProvider(
child: FileUpload(),
Expand Down
25 changes: 8 additions & 17 deletions lib/path_view.dart
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -9,29 +9,20 @@ class PathView extends StatelessWidget {
builder: (BuildContext context, AppState app, Widget child) {
return Row(
children: <Widget>[
_buildPathElement(app.boxName, () {
app.path = [];
}, divider: false),
for (var i = 0; i < app.path.length; i++)
_buildPathElement(app.path[i], () {
app.path = app.path.sublist(0, i + 1);
}),
_buildPathElement(app.boxName),
for (var i = 0; i < app.path.length; i++) _buildPathElement(app.path[i]),
],
);
},
);
}

Widget _buildPathElement(String name, VoidCallback goto,
{bool divider = true}) {
return InkWell(
onTap: goto,
child: Text(
divider ? '> $name' : name,
style: TextStyle(
fontSize: 30,
fontWeight: FontWeight.bold,
),
Widget _buildPathElement(String name) {
return Text(
name,
style: TextStyle(
fontSize: 18,
fontWeight: FontWeight.bold,
),
);
}
Expand Down
6 changes: 6 additions & 0 deletions lib/upload_status_enum.dart
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,6 @@
enum UploadStatus {
none,
processing,
success,
failed,
}
1 change: 1 addition & 0 deletions pubspec.yaml
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -10,6 +10,7 @@ dependencies:
flutter:
sdk: flutter

flutter_json_viewer: ^1.0.1
hive: 1.2.0
provider: any

Expand Down