logout button

lib/pages/settings/account.dart

@@ -0,0 +1,49 @@
+import 'dart:io';
+
+import 'package:flutter/material.dart';
+import 'package:localization/localization.dart';
+import '../../business_logic/settings.dart' as settings;
+
+class AccountSettings extends StatelessWidget {
+  const AccountSettings({Key? key}) : super(key: key);
+
+  @override
+  Widget build(BuildContext context) {
+    return Row(
+      children: const [LogoutButton()],
+    );
+  }
+}
+
+class LogoutButton extends StatelessWidget {
+  const LogoutButton({Key? key}) : super(key: key);
+
+  @override
+  Widget build(BuildContext context) {
+    return Row(
+      children: [
+        FutureBuilder<String>(
+          future: settings.loadInstanceUrl(),
+          builder: (context, snapshot) {
+            if (snapshot.hasData && snapshot.data != null) {
+              return Text("instance name");
+            } else {
+              return const CircularProgressIndicator();
+            }
+          },
+        ),
+        TextButton.icon(
+            onPressed: () {
+              logout();
+            },
+            icon: const Icon(Icons.logout),
+            label: Text("logout".i18n()))
+      ],
+    );
+  }
+}
+
+void logout() async {
+  await settings.saveAuthCode("");
+  exit(0);
+}

lib/pages/settings/settings.dart

@@ -1,37 +1,56 @@
 import 'package:flutter/material.dart';
+import 'package:localization/localization.dart';
+import './account.dart' as account;
 
 Widget settings(context) {
-  const List<Widget> categories = [
-    SettingsPanel(title: "cool and good settings"),
-    SettingsPanel(title: "evil and bad settings"),
+  final List<Widget> categories = [
+    SettingsPanel(
+        title: "account-settings".i18n(),
+        content: const account.AccountSettings()),
   ];
-  return ListView.separated(
-      itemBuilder: (context, index) {
-        return categories[index];
-      },
-      separatorBuilder: (context, index) {
-        return const Divider(
-          color: Colors.transparent,
-        );
-      },
-      itemCount: categories.length);
+  return Padding(
+    padding: const EdgeInsets.all(24),
+    child: ListView.separated(
+        itemBuilder: (context, index) {
+          return categories[index];
+        },
+        separatorBuilder: (context, index) {
+          return const Divider(
+            color: Colors.transparent,
+          );
+        },
+        itemCount: categories.length),
+  );
 }
 
 class SettingsPanel extends StatelessWidget {
   const SettingsPanel({
     Key? key,
     required this.title,
+    required this.content,
   }) : super(key: key);
 
   final String title;
+  final Widget content;
 
   @override
   Widget build(BuildContext context) {
     return Container(
-      decoration: BoxDecoration(color: Theme.of(context).colorScheme.surface),
-      padding: const EdgeInsets.all(4),
+      decoration: BoxDecoration(
+        color: Theme.of(context).colorScheme.surface,
+        border: Border.all(color: Theme.of(context).colorScheme.secondary),
+        borderRadius: BorderRadius.circular(8),
+      ),
+      padding: const EdgeInsets.all(24),
       child: Column(
-        children: [Text(title)],
+        crossAxisAlignment: CrossAxisAlignment.start,
+        children: [
+          Text(
+            title,
+            style: Theme.of(context).textTheme.headlineMedium,
+          ),
+          content,
+        ],
       ),
     );
   }