395 lines
14 KiB
Dart
395 lines
14 KiB
Dart
import 'package:flutter/material.dart';
|
|
import 'package:flutter/widgets.dart';
|
|
import 'package:font_awesome_flutter/font_awesome_flutter.dart';
|
|
import 'package:provider/provider.dart';
|
|
import 'package:simplecloudnotifier/api/api_client.dart';
|
|
import 'package:simplecloudnotifier/models/user.dart';
|
|
import 'package:simplecloudnotifier/state/user_account.dart';
|
|
|
|
class AccountRootPage extends StatefulWidget {
|
|
const AccountRootPage({super.key});
|
|
|
|
@override
|
|
State<AccountRootPage> createState() => _AccountRootPageState();
|
|
}
|
|
|
|
class _AccountRootPageState extends State<AccountRootPage> {
|
|
late Future<int>? futureSubscriptionCount;
|
|
late Future<int>? futureClientCount;
|
|
late Future<int>? futureKeyCount;
|
|
late Future<int>? futureChannelAllCount;
|
|
late Future<int>? futureChannelSubscribedCount;
|
|
|
|
late UserAccount userAcc;
|
|
|
|
@override
|
|
void initState() {
|
|
super.initState();
|
|
|
|
userAcc = Provider.of<UserAccount>(context, listen: false);
|
|
userAcc.addListener(_onAuthStateChanged);
|
|
_onAuthStateChanged();
|
|
}
|
|
|
|
@override
|
|
void dispose() {
|
|
userAcc.removeListener(_onAuthStateChanged);
|
|
super.dispose();
|
|
}
|
|
|
|
void _onAuthStateChanged() {
|
|
futureSubscriptionCount = null;
|
|
futureClientCount = null;
|
|
futureKeyCount = null;
|
|
futureChannelAllCount = null;
|
|
futureChannelSubscribedCount = null;
|
|
|
|
if (userAcc.auth != null) {
|
|
futureChannelAllCount = () async {
|
|
if (userAcc.auth == null) throw new Exception('not logged in');
|
|
final channels = await APIClient.getChannelList(userAcc.auth!, ChannelSelector.all);
|
|
return channels.length;
|
|
}();
|
|
|
|
futureChannelSubscribedCount = () async {
|
|
if (userAcc.auth == null) throw new Exception('not logged in');
|
|
final channels = await APIClient.getChannelList(userAcc.auth!, ChannelSelector.subscribed);
|
|
return channels.length;
|
|
}();
|
|
|
|
futureSubscriptionCount = () async {
|
|
if (userAcc.auth == null) throw new Exception('not logged in');
|
|
final subs = await APIClient.getSubscriptionList(userAcc.auth!);
|
|
return subs.length;
|
|
}();
|
|
|
|
futureClientCount = () async {
|
|
if (userAcc.auth == null) throw new Exception('not logged in');
|
|
final clients = await APIClient.getClientList(userAcc.auth!);
|
|
return clients.length;
|
|
}();
|
|
|
|
futureKeyCount = () async {
|
|
if (userAcc.auth == null) throw new Exception('not logged in');
|
|
final keys = await APIClient.getKeyTokenList(userAcc.auth!);
|
|
return keys.length;
|
|
}();
|
|
}
|
|
}
|
|
|
|
@override
|
|
Widget build(BuildContext context) {
|
|
return Consumer<UserAccount>(
|
|
builder: (context, acc, child) {
|
|
if (acc.auth == null) {
|
|
return buildNoAuth(context);
|
|
} else {
|
|
return FutureBuilder(
|
|
future: acc.loadUser(false),
|
|
builder: ((context, snapshot) {
|
|
if (snapshot.connectionState == ConnectionState.done) {
|
|
if (snapshot.hasError) {
|
|
return Text('Error: ${snapshot.error}'); //TODO better error display
|
|
}
|
|
return buildShowAccount(context, acc, snapshot.data!);
|
|
}
|
|
return Center(child: CircularProgressIndicator());
|
|
}),
|
|
);
|
|
}
|
|
},
|
|
);
|
|
}
|
|
|
|
Widget buildNoAuth(BuildContext context) {
|
|
return Center(
|
|
child: Column(
|
|
mainAxisAlignment: MainAxisAlignment.center,
|
|
children: [
|
|
ElevatedButton(
|
|
style: ElevatedButton.styleFrom(textStyle: const TextStyle(fontSize: 20)),
|
|
onPressed: () {
|
|
//TODO
|
|
},
|
|
child: const Text('Use existing account'),
|
|
),
|
|
const SizedBox(height: 32),
|
|
ElevatedButton(
|
|
style: ElevatedButton.styleFrom(textStyle: const TextStyle(fontSize: 20)),
|
|
onPressed: () {
|
|
//TODO
|
|
},
|
|
child: const Text('Create new account'),
|
|
),
|
|
],
|
|
),
|
|
);
|
|
}
|
|
|
|
Widget buildShowAccount(BuildContext context, UserAccount acc, User user) {
|
|
//TODO better layout
|
|
return Column(
|
|
children: [
|
|
SingleChildScrollView(
|
|
scrollDirection: Axis.vertical,
|
|
child: Padding(
|
|
padding: const EdgeInsets.fromLTRB(8.0, 24.0, 8.0, 8.0),
|
|
child: Column(
|
|
children: [
|
|
buildHeader(context, user),
|
|
const SizedBox(height: 16),
|
|
Text(user.username ?? user.userID, overflow: TextOverflow.ellipsis, style: TextStyle(fontWeight: FontWeight.bold, fontSize: 20)),
|
|
const SizedBox(height: 16),
|
|
...buildCards(context, user),
|
|
],
|
|
),
|
|
),
|
|
),
|
|
const Expanded(child: SizedBox(height: 16)),
|
|
buildFooter(context, user),
|
|
SizedBox(height: 40)
|
|
],
|
|
);
|
|
}
|
|
|
|
Row buildHeader(BuildContext context, User user) {
|
|
return Row(
|
|
crossAxisAlignment: CrossAxisAlignment.start,
|
|
children: [
|
|
SizedBox(
|
|
width: 80,
|
|
height: 80,
|
|
child: Stack(
|
|
children: [
|
|
Container(
|
|
width: 80,
|
|
height: 80,
|
|
decoration: BoxDecoration(
|
|
color: Colors.grey,
|
|
borderRadius: BorderRadius.circular(8),
|
|
),
|
|
child: Center(child: FaIcon(FontAwesomeIcons.addressCard, size: 55, color: Colors.white))),
|
|
if (user.isPro)
|
|
Align(
|
|
alignment: Alignment.bottomRight,
|
|
child: Container(
|
|
child: Text('PRO', style: TextStyle(fontSize: 14, color: Colors.white, fontWeight: FontWeight.bold)),
|
|
padding: const EdgeInsets.fromLTRB(4, 1, 4, 1),
|
|
decoration: BoxDecoration(
|
|
color: Colors.blue,
|
|
borderRadius: BorderRadius.only(topLeft: Radius.circular(8)),
|
|
),
|
|
),
|
|
),
|
|
if (!user.isPro)
|
|
Align(
|
|
alignment: Alignment.bottomRight,
|
|
child: Container(
|
|
child: Text('FREE', style: TextStyle(fontSize: 14, color: Colors.white, fontWeight: FontWeight.bold)),
|
|
padding: const EdgeInsets.fromLTRB(4, 1, 4, 1),
|
|
decoration: BoxDecoration(
|
|
color: Colors.purple,
|
|
borderRadius: BorderRadius.only(topLeft: Radius.circular(8)),
|
|
),
|
|
),
|
|
),
|
|
],
|
|
),
|
|
),
|
|
const SizedBox(width: 16),
|
|
Expanded(
|
|
child: Column(
|
|
crossAxisAlignment: CrossAxisAlignment.start,
|
|
children: [
|
|
Row(
|
|
children: [
|
|
Expanded(child: Text(user.username ?? user.userID, overflow: TextOverflow.ellipsis)),
|
|
IconButton(
|
|
icon: FaIcon(FontAwesomeIcons.pen),
|
|
iconSize: 18,
|
|
padding: EdgeInsets.fromLTRB(0, 0, 4, 0),
|
|
constraints: BoxConstraints(),
|
|
onPressed: () {/*TODO*/},
|
|
),
|
|
],
|
|
),
|
|
const SizedBox(height: 4),
|
|
Row(
|
|
children: [
|
|
SizedBox(width: 80, child: Text("Quota", style: TextStyle(color: Theme.of(context).textTheme.bodyLarge?.color?.withAlpha(160)))),
|
|
Expanded(child: Text('${user.quotaUsed} / ${user.quotaPerDay}')),
|
|
],
|
|
),
|
|
Row(
|
|
children: [
|
|
SizedBox(width: 80, child: Text("Messages", style: TextStyle(color: Theme.of(context).textTheme.bodyLarge?.color?.withAlpha(160)))),
|
|
Expanded(child: Text('${user.messagesSent}')),
|
|
],
|
|
),
|
|
Row(
|
|
children: [
|
|
SizedBox(width: 80, child: Text("Channels", style: TextStyle(color: Theme.of(context).textTheme.bodyLarge?.color?.withAlpha(160)))),
|
|
FutureBuilder(
|
|
future: futureChannelAllCount,
|
|
builder: (context, snapshot) {
|
|
if (snapshot.connectionState == ConnectionState.done) {
|
|
return Text('${snapshot.data}');
|
|
}
|
|
return const SizedBox(width: 8, height: 8, child: Center(child: CircularProgressIndicator()));
|
|
},
|
|
)
|
|
],
|
|
),
|
|
],
|
|
),
|
|
),
|
|
],
|
|
);
|
|
}
|
|
|
|
List<Widget> buildCards(BuildContext context, User user) {
|
|
return [
|
|
Card.filled(
|
|
margin: EdgeInsets.fromLTRB(0, 4, 0, 4),
|
|
shape: BeveledRectangleBorder(borderRadius: BorderRadius.circular(0)),
|
|
color: Theme.of(context).cardTheme.color,
|
|
child: InkWell(
|
|
splashColor: Theme.of(context).splashColor,
|
|
onTap: () {/*TODO*/},
|
|
child: Padding(
|
|
padding: const EdgeInsets.all(16),
|
|
child: Row(
|
|
children: [
|
|
FutureBuilder(
|
|
future: futureSubscriptionCount,
|
|
builder: (context, snapshot) {
|
|
if (snapshot.connectionState == ConnectionState.done) {
|
|
return Text('${snapshot.data}', style: TextStyle(fontWeight: FontWeight.bold, fontSize: 20));
|
|
}
|
|
return const SizedBox(width: 12, height: 12, child: Center(child: CircularProgressIndicator()));
|
|
},
|
|
),
|
|
const SizedBox(width: 12),
|
|
Text('Subscriptions', style: TextStyle(fontWeight: FontWeight.bold, fontSize: 20)),
|
|
],
|
|
),
|
|
),
|
|
),
|
|
),
|
|
Card.filled(
|
|
margin: EdgeInsets.fromLTRB(0, 4, 0, 4),
|
|
shape: BeveledRectangleBorder(borderRadius: BorderRadius.circular(0)),
|
|
color: Theme.of(context).cardTheme.color,
|
|
child: InkWell(
|
|
splashColor: Theme.of(context).splashColor,
|
|
onTap: () {/*TODO*/},
|
|
child: Padding(
|
|
padding: const EdgeInsets.all(16),
|
|
child: Row(
|
|
children: [
|
|
FutureBuilder(
|
|
future: futureClientCount,
|
|
builder: (context, snapshot) {
|
|
if (snapshot.connectionState == ConnectionState.done) {
|
|
return Text('${snapshot.data}', style: TextStyle(fontWeight: FontWeight.bold, fontSize: 20));
|
|
}
|
|
return const SizedBox(width: 12, height: 12, child: Center(child: CircularProgressIndicator()));
|
|
},
|
|
),
|
|
const SizedBox(width: 12),
|
|
Text('Clients', style: TextStyle(fontWeight: FontWeight.bold, fontSize: 20)),
|
|
],
|
|
),
|
|
),
|
|
),
|
|
),
|
|
Card.filled(
|
|
margin: EdgeInsets.fromLTRB(0, 4, 0, 4),
|
|
shape: BeveledRectangleBorder(borderRadius: BorderRadius.circular(0)),
|
|
color: Theme.of(context).cardTheme.color,
|
|
child: InkWell(
|
|
splashColor: Theme.of(context).splashColor,
|
|
onTap: () {/*TODO*/},
|
|
child: Padding(
|
|
padding: const EdgeInsets.all(16),
|
|
child: Row(
|
|
children: [
|
|
FutureBuilder(
|
|
future: futureKeyCount,
|
|
builder: (context, snapshot) {
|
|
if (snapshot.connectionState == ConnectionState.done) {
|
|
return Text('${snapshot.data}', style: TextStyle(fontWeight: FontWeight.bold, fontSize: 20));
|
|
}
|
|
return const SizedBox(width: 12, height: 12, child: Center(child: CircularProgressIndicator()));
|
|
},
|
|
),
|
|
const SizedBox(width: 12),
|
|
Text('Keys', style: TextStyle(fontWeight: FontWeight.bold, fontSize: 20)),
|
|
],
|
|
),
|
|
),
|
|
),
|
|
),
|
|
Card.filled(
|
|
margin: EdgeInsets.fromLTRB(0, 4, 0, 4),
|
|
shape: BeveledRectangleBorder(borderRadius: BorderRadius.circular(0)),
|
|
color: Theme.of(context).cardTheme.color,
|
|
child: InkWell(
|
|
splashColor: Theme.of(context).splashColor,
|
|
onTap: () {/*TODO*/},
|
|
child: Padding(
|
|
padding: const EdgeInsets.all(16),
|
|
child: Row(
|
|
children: [
|
|
FutureBuilder(
|
|
future: futureChannelSubscribedCount,
|
|
builder: (context, snapshot) {
|
|
if (snapshot.connectionState == ConnectionState.done) {
|
|
return Text('${snapshot.data}', style: TextStyle(fontWeight: FontWeight.bold, fontSize: 20));
|
|
}
|
|
return const SizedBox(width: 12, height: 12, child: Center(child: CircularProgressIndicator()));
|
|
},
|
|
),
|
|
const SizedBox(width: 12),
|
|
Text('Channels', style: TextStyle(fontWeight: FontWeight.bold, fontSize: 20)),
|
|
],
|
|
),
|
|
),
|
|
),
|
|
),
|
|
Card.filled(
|
|
margin: EdgeInsets.fromLTRB(0, 4, 0, 4),
|
|
shape: BeveledRectangleBorder(borderRadius: BorderRadius.circular(0)),
|
|
color: Theme.of(context).cardTheme.color,
|
|
child: InkWell(
|
|
splashColor: Theme.of(context).splashColor,
|
|
onTap: () {/*TODO*/},
|
|
child: Padding(
|
|
padding: const EdgeInsets.all(16),
|
|
child: Row(
|
|
children: [
|
|
Text('${user.messagesSent}', style: TextStyle(fontWeight: FontWeight.bold, fontSize: 20)),
|
|
const SizedBox(width: 12),
|
|
Text('Messages', style: TextStyle(fontWeight: FontWeight.bold, fontSize: 20)),
|
|
],
|
|
),
|
|
),
|
|
),
|
|
),
|
|
];
|
|
}
|
|
|
|
Widget buildFooter(BuildContext context, User user) {
|
|
return Padding(
|
|
padding: const EdgeInsets.fromLTRB(8, 0, 8, 0),
|
|
child: Row(
|
|
children: [
|
|
Expanded(child: FilledButton(onPressed: () {/*TODO*/}, child: Text('Logout'), style: TextButton.styleFrom(backgroundColor: Colors.orange))),
|
|
const SizedBox(width: 8),
|
|
Expanded(child: FilledButton(onPressed: () {/*TODO*/}, child: Text('Delete Account'), style: TextButton.styleFrom(backgroundColor: Colors.red))),
|
|
],
|
|
),
|
|
);
|
|
}
|
|
}
|