Rename app module to ui

Signed-off-by: Harsh Shandilya <me@msfjarvis.dev>

11 files changed, 1036 insertions, 0 deletions

diff --git a/ui/src/main/res/layout/add_tunnels_bottom_sheet.xml b/ui/src/main/res/layout/add_tunnels_bottom_sheet.xml
new file mode 100644
index 00000000..62f168b1
--- /dev/null
+++ b/ui/src/main/res/layout/add_tunnels_bottom_sheet.xml
@@ -0,0 +1,73 @@
+<?xml version="1.0" encoding="utf-8"?>
+<androidx.constraintlayout.widget.ConstraintLayout
+    xmlns:android="http://schemas.android.com/apk/res/android"
+    xmlns:app="http://schemas.android.com/apk/res-auto"
+    android:id="@+id/root"
+    android:layout_width="match_parent"
+    android:layout_height="wrap_content"
+    android:paddingTop="@dimen/bottom_sheet_top_padding">
+
+    <com.google.android.material.button.MaterialButton
+        android:id="@+id/create_empty"
+        android:layout_width="match_parent"
+        android:layout_height="@dimen/bottom_sheet_item_height"
+        android:layout_marginLeft="@dimen/normal_margin"
+        android:layout_marginRight="@dimen/normal_margin"
+        android:layout_marginStart="@dimen/normal_margin"
+        android:layout_marginEnd="@dimen/normal_margin"
+        android:text="@string/create_empty"
+        android:textAlignment="viewStart"
+        android:textColor="?attr/colorOnSurface"
+        app:icon="@drawable/ic_action_edit"
+        app:iconPadding="@dimen/bottom_sheet_icon_padding"
+        app:iconTint="?attr/colorSecondary"
+        app:layout_constraintEnd_toEndOf="parent"
+        app:layout_constraintBottom_toTopOf="@+id/create_from_file"
+        app:layout_constraintTop_toTopOf="parent"
+        app:layout_constraintStart_toStartOf="parent"
+        app:rippleColor="?attr/colorSecondary"
+        style="@style/Widget.MaterialComponents.Button.TextButton.Icon"/>
+
+    <com.google.android.material.button.MaterialButton
+        android:id="@+id/create_from_file"
+        android:layout_width="match_parent"
+        android:layout_height="@dimen/bottom_sheet_item_height"
+        android:layout_marginLeft="@dimen/normal_margin"
+        android:layout_marginRight="@dimen/normal_margin"
+        android:layout_marginStart="@dimen/normal_margin"
+        android:layout_marginEnd="@dimen/normal_margin"
+        android:text="@string/create_from_file"
+        android:textAlignment="viewStart"
+        android:textColor="?attr/colorOnSurface"
+        app:icon="@drawable/ic_action_open_white"
+        app:iconPadding="@dimen/bottom_sheet_icon_padding"
+        app:iconTint="?attr/colorSecondary"
+        app:layout_constraintTop_toBottomOf="@+id/create_empty"
+        app:layout_constraintBottom_toTopOf="@+id/create_from_qrcode"
+        app:layout_constraintEnd_toEndOf="parent"
+        app:layout_constraintStart_toStartOf="parent"
+        app:rippleColor="?attr/colorSecondary"
+        style="@style/Widget.MaterialComponents.Button.TextButton.Icon"/>
+
+    <com.google.android.material.button.MaterialButton
+        android:id="@+id/create_from_qrcode"
+        android:layout_width="match_parent"
+        android:layout_height="@dimen/bottom_sheet_item_height"
+        android:layout_marginLeft="@dimen/normal_margin"
+        android:layout_marginRight="@dimen/normal_margin"
+        android:layout_marginStart="@dimen/normal_margin"
+        android:layout_marginEnd="@dimen/normal_margin"
+        android:text="@string/create_from_qr_code"
+        android:textAlignment="viewStart"
+        android:textColor="?attr/colorOnSurface"
+        app:icon="@drawable/ic_action_scan_qr_code_white"
+        app:iconPadding="@dimen/bottom_sheet_icon_padding"
+        app:iconTint="?attr/colorSecondary"
+        app:layout_constraintTop_toBottomOf="@+id/create_from_file"
+        app:layout_constraintBottom_toBottomOf="parent"
+        app:layout_constraintEnd_toEndOf="parent"
+        app:layout_constraintStart_toStartOf="parent"
+        app:rippleColor="?attr/colorSecondary"
+        style="@style/Widget.MaterialComponents.Button.TextButton.Icon"/>
+
+</androidx.constraintlayout.widget.ConstraintLayout>
diff --git a/ui/src/main/res/layout/app_list_dialog_fragment.xml b/ui/src/main/res/layout/app_list_dialog_fragment.xml
new file mode 100644
index 00000000..c91161e6
--- /dev/null
+++ b/ui/src/main/res/layout/app_list_dialog_fragment.xml
@@ -0,0 +1,47 @@
+<?xml version="1.0" encoding="utf-8"?>
+<layout xmlns:android="http://schemas.android.com/apk/res/android"
+    xmlns:app="http://schemas.android.com/apk/res-auto"
+    xmlns:tools="http://schemas.android.com/tools">
+
+    <data>
+
+        <import type="android.view.View" />
+
+        <import type="com.wireguard.android.model.ApplicationData" />
+
+        <variable
+            name="fragment"
+            type="com.wireguard.android.fragment.AppListDialogFragment" />
+
+        <variable
+            name="appData"
+            type="com.wireguard.android.util.ObservableKeyedList&lt;String, ApplicationData&gt;" />
+    </data>
+
+    <FrameLayout
+        android:layout_width="match_parent"
+        android:layout_height="match_parent"
+        android:minHeight="200dp">
+
+        <ProgressBar
+            android:id="@+id/progress_bar"
+            android:layout_width="wrap_content"
+            android:layout_height="wrap_content"
+            android:layout_gravity="center"
+            android:indeterminate="true"
+            android:visibility="@{appData.isEmpty() ? View.VISIBLE : View.GONE}"
+            tools:visibility="gone" />
+
+        <androidx.recyclerview.widget.RecyclerView
+            android:id="@+id/app_list"
+            android:layout_width="match_parent"
+            android:layout_height="match_parent"
+            app:items="@{appData}"
+            app:layout="@{@layout/app_list_item}"
+            tools:itemCount="10"
+            tools:listitem="@layout/app_list_item" />
+
+    </FrameLayout>
+
+
+</layout>
diff --git a/ui/src/main/res/layout/app_list_item.xml b/ui/src/main/res/layout/app_list_item.xml
new file mode 100644
index 00000000..1e81751b
--- /dev/null
+++ b/ui/src/main/res/layout/app_list_item.xml
@@ -0,0 +1,61 @@
+<?xml version="1.0" encoding="utf-8"?>
+<layout xmlns:android="http://schemas.android.com/apk/res/android"
+    xmlns:tools="http://schemas.android.com/tools">
+
+    <data>
+
+        <import type="com.wireguard.android.model.ApplicationData" />
+
+        <variable
+            name="collection"
+            type="com.wireguard.android.util.ObservableKeyedList&lt;String, com.wireguard.android.model.ApplicationData&gt;" />
+
+        <variable
+            name="key"
+            type="String" />
+
+        <variable
+            name="item"
+            type="com.wireguard.android.model.ApplicationData" />
+    </data>
+
+    <LinearLayout
+        android:layout_width="match_parent"
+        android:layout_height="wrap_content"
+        android:background="@drawable/list_item_background"
+        android:gravity="center_vertical"
+        android:onClick="@{(view) -> item.setExcludedFromTunnel(!item.excludedFromTunnel)}"
+        android:orientation="horizontal"
+        android:paddingTop="8dp"
+        android:paddingBottom="8dp">
+
+        <ImageView
+            android:id="@+id/app_icon"
+            android:layout_width="32dp"
+            android:layout_height="32dp"
+            android:layout_marginStart="16dp"
+            android:src="@{item.icon}"
+            tools:src="@tools:sample/avatars" />
+
+        <TextView
+            android:id="@+id/app_name"
+            style="?android:attr/textAppearanceMedium"
+            android:layout_width="0dp"
+            android:layout_height="wrap_content"
+            android:layout_weight="1"
+            android:ellipsize="end"
+            android:maxLines="1"
+            android:layout_marginStart="16dp"
+            android:layout_marginEnd="16dp"
+            android:text="@{key}"
+            tools:text="@tools:sample/full_names" />
+
+        <CheckBox
+            android:id="@+id/excluded_checkbox"
+            android:layout_width="wrap_content"
+            android:layout_height="wrap_content"
+            android:checked="@={item.excludedFromTunnel}"
+            tools:checked="true" />
+
+    </LinearLayout>
+</layout>
diff --git a/ui/src/main/res/layout/config_naming_dialog_fragment.xml b/ui/src/main/res/layout/config_naming_dialog_fragment.xml
new file mode 100644
index 00000000..a7017804
--- /dev/null
+++ b/ui/src/main/res/layout/config_naming_dialog_fragment.xml
@@ -0,0 +1,33 @@
+<?xml version="1.0" encoding="utf-8"?>
+<layout xmlns:android="http://schemas.android.com/apk/res/android"
+    xmlns:app="http://schemas.android.com/apk/res-auto">
+
+    <data>
+
+        <import type="com.wireguard.android.widget.NameInputFilter" />
+    </data>
+
+    <FrameLayout
+        android:layout_width="match_parent"
+        android:layout_height="match_parent"
+        android:padding="16dp">
+
+        <com.google.android.material.textfield.TextInputLayout
+            android:id="@+id/tunnel_name_text_layout"
+            android:layout_width="match_parent"
+            android:layout_height="wrap_content">
+
+            <EditText
+                android:id="@+id/tunnel_name_text"
+                android:layout_width="match_parent"
+                android:layout_height="wrap_content"
+                android:hint="@string/tunnel_name"
+                android:inputType="textNoSuggestions|textVisiblePassword"
+                app:filter="@{NameInputFilter.newInstance()}" />
+
+        </com.google.android.material.textfield.TextInputLayout>
+
+    </FrameLayout>
+
+
+</layout>
diff --git a/ui/src/main/res/layout/main_activity.xml b/ui/src/main/res/layout/main_activity.xml
new file mode 100644
index 00000000..cf892e45
--- /dev/null
+++ b/ui/src/main/res/layout/main_activity.xml
@@ -0,0 +1,16 @@
+<?xml version="1.0" encoding="utf-8"?>
+<androidx.coordinatorlayout.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
+    xmlns:tools="http://schemas.android.com/tools"
+    android:id="@+id/master_detail_wrapper"
+    android:layout_width="match_parent"
+    android:layout_height="match_parent"
+    tools:context=".activity.MainActivity"
+    android:fitsSystemWindows="true">
+
+    <androidx.fragment.app.FragmentContainerView
+        android:id="@+id/detail_container"
+        android:name="com.wireguard.android.fragment.TunnelListFragment"
+        android:layout_width="match_parent"
+        android:layout_height="match_parent"
+        android:tag="LIST"/>
+</androidx.coordinatorlayout.widget.CoordinatorLayout>
diff --git a/ui/src/main/res/layout/tunnel_detail_fragment.xml b/ui/src/main/res/layout/tunnel_detail_fragment.xml
new file mode 100644
index 00000000..463f8b80
--- /dev/null
+++ b/ui/src/main/res/layout/tunnel_detail_fragment.xml
@@ -0,0 +1,139 @@
+<?xml version="1.0" encoding="utf-8"?>
+<layout xmlns:android="http://schemas.android.com/apk/res/android"
+    xmlns:app="http://schemas.android.com/apk/res-auto"
+    xmlns:tools="http://schemas.android.com/tools">
+
+    <data>
+
+        <import type="com.wireguard.android.backend.Tunnel.State" />
+
+        <import type="com.wireguard.android.util.ClipboardUtils" />
+
+        <variable
+            name="fragment"
+            type="com.wireguard.android.fragment.TunnelDetailFragment" />
+
+        <variable
+            name="tunnel"
+            type="com.wireguard.android.model.ObservableTunnel" />
+
+        <variable
+            name="config"
+            type="com.wireguard.config.Config" />
+    </data>
+
+    <ScrollView
+        android:layout_width="match_parent"
+        android:layout_height="match_parent"
+        android:background="?attr/colorBackground">
+
+        <LinearLayout
+            android:layout_width="match_parent"
+            android:layout_height="wrap_content"
+            android:orientation="vertical">
+
+            <androidx.cardview.widget.CardView
+                android:layout_width="match_parent"
+                android:layout_height="wrap_content"
+                android:layout_marginBottom="4dp"
+                android:layout_marginEnd="8dp"
+                android:layout_marginStart="8dp"
+                android:layout_marginTop="8dp"
+                android:background="?attr/colorBackground"
+                app:cardCornerRadius="4dp"
+                app:cardElevation="2dp"
+                app:contentPadding="8dp">
+
+                <RelativeLayout
+                    android:layout_width="match_parent"
+                    android:layout_height="wrap_content">
+
+                    <TextView
+                        android:id="@+id/interface_title"
+                        style="?android:attr/textAppearanceMedium"
+                        android:layout_width="wrap_content"
+                        android:layout_height="wrap_content"
+                        android:layout_alignParentStart="true"
+                        android:layout_alignParentTop="true"
+                        android:text="@string/interface_title" />
+
+                    <com.wireguard.android.widget.ToggleSwitch
+                        android:id="@+id/tunnel_switch"
+                        android:layout_width="wrap_content"
+                        android:layout_height="wrap_content"
+                        android:layout_alignBaseline="@+id/interface_title"
+                        android:layout_alignParentEnd="true"
+                        app:checked="@{tunnel.state == State.UP}"
+                        app:onBeforeCheckedChanged="@{fragment::setTunnelState}" />
+
+                    <TextView
+                        android:id="@+id/interface_name_label"
+                        android:layout_width="match_parent"
+                        android:layout_height="wrap_content"
+                        android:layout_below="@+id/interface_title"
+                        android:layout_marginTop="8dp"
+                        android:labelFor="@+id/interface_name_text"
+                        android:text="@string/name" />
+
+                    <TextView
+                        android:id="@+id/interface_name_text"
+                        style="?android:attr/textAppearanceMedium"
+                        android:layout_width="match_parent"
+                        android:layout_height="wrap_content"
+                        android:layout_below="@+id/interface_name_label"
+                        android:text="@{tunnel.name}" />
+
+                    <TextView
+                        android:id="@+id/public_key_label"
+                        android:layout_width="match_parent"
+                        android:layout_height="wrap_content"
+                        android:layout_below="@id/interface_name_text"
+                        android:layout_marginTop="8dp"
+                        android:labelFor="@+id/public_key_text"
+                        android:text="@string/public_key" />
+
+                    <TextView
+                        android:id="@+id/public_key_text"
+                        style="?android:attr/textAppearanceMedium"
+                        android:layout_width="match_parent"
+                        android:layout_height="wrap_content"
+                        android:layout_below="@+id/public_key_label"
+                        android:contentDescription="@string/public_key_description"
+                        android:ellipsize="end"
+                        android:maxLines="1"
+                        android:onClick="@{ClipboardUtils::copyTextView}"
+                        android:text="@{config.interface.keyPair.publicKey.toBase64}" />
+
+                    <TextView
+                        android:id="@+id/addresses_label"
+                        android:layout_width="match_parent"
+                        android:layout_height="wrap_content"
+                        android:layout_below="@id/public_key_text"
+                        android:layout_marginTop="8dp"
+                        android:labelFor="@+id/addresses_text"
+                        android:text="@string/addresses" />
+
+                    <TextView
+                        android:id="@+id/addresses_text"
+                        style="?android:attr/textAppearanceMedium"
+                        android:layout_width="match_parent"
+                        android:layout_height="wrap_content"
+                        android:layout_below="@+id/addresses_label"
+                        android:contentDescription="@string/addresses"
+                        android:text="@{config.interface.addresses}" />
+                </RelativeLayout>
+            </androidx.cardview.widget.CardView>
+
+            <LinearLayout
+                android:id="@+id/peers_layout"
+                android:layout_width="match_parent"
+                android:layout_height="wrap_content"
+                android:layout_marginBottom="4dp"
+                android:divider="@null"
+                android:orientation="vertical"
+                app:items="@{config.peers}"
+                app:layout="@{@layout/tunnel_detail_peer}"
+                tools:ignore="UselessLeaf" />
+        </LinearLayout>
+    </ScrollView>
+</layout>
diff --git a/ui/src/main/res/layout/tunnel_detail_peer.xml b/ui/src/main/res/layout/tunnel_detail_peer.xml
new file mode 100644
index 00000000..181a4a21
--- /dev/null
+++ b/ui/src/main/res/layout/tunnel_detail_peer.xml
@@ -0,0 +1,112 @@
+<?xml version="1.0" encoding="utf-8"?>
+<layout xmlns:android="http://schemas.android.com/apk/res/android"
+    xmlns:app="http://schemas.android.com/apk/res-auto">
+
+    <data>
+
+        <import type="com.wireguard.android.util.ClipboardUtils" />
+
+        <variable
+            name="item"
+            type="com.wireguard.config.Peer" />
+    </data>
+
+    <androidx.cardview.widget.CardView
+        android:layout_width="match_parent"
+        android:layout_height="wrap_content"
+        android:layout_marginBottom="4dp"
+        android:layout_marginEnd="8dp"
+        android:layout_marginStart="8dp"
+        android:layout_marginTop="4dp"
+        android:background="?attr/colorBackground"
+        app:cardCornerRadius="4dp"
+        app:cardElevation="2dp"
+        app:contentPadding="8dp">
+
+        <RelativeLayout
+            android:layout_width="match_parent"
+            android:layout_height="wrap_content">
+
+            <TextView
+                android:id="@+id/peer_title"
+                style="?android:attr/textAppearanceMedium"
+                android:layout_width="match_parent"
+                android:layout_height="wrap_content"
+                android:layout_alignParentTop="true"
+                android:text="@string/peer" />
+
+            <TextView
+                android:id="@+id/public_key_label"
+                android:layout_width="match_parent"
+                android:layout_height="wrap_content"
+                android:layout_below="@id/peer_title"
+                android:layout_marginTop="8dp"
+                android:labelFor="@+id/public_key_text"
+                android:text="@string/public_key" />
+
+            <TextView
+                android:id="@+id/public_key_text"
+                style="?android:attr/textAppearanceMedium"
+                android:layout_width="match_parent"
+                android:layout_height="wrap_content"
+                android:layout_below="@+id/public_key_label"
+                android:contentDescription="@string/public_key_description"
+                android:ellipsize="end"
+                android:maxLines="1"
+                android:onClick="@{ClipboardUtils::copyTextView}"
+                android:text="@{item.publicKey.toBase64}" />
+
+            <TextView
+                android:id="@+id/allowed_ips_label"
+                android:layout_width="match_parent"
+                android:layout_height="wrap_content"
+                android:layout_below="@+id/public_key_text"
+                android:layout_marginTop="8dp"
+                android:labelFor="@+id/allowed_ips_text"
+                android:text="@string/allowed_ips" />
+
+            <TextView
+                android:id="@+id/allowed_ips_text"
+                style="?android:attr/textAppearanceMedium"
+                android:layout_width="match_parent"
+                android:layout_height="wrap_content"
+                android:layout_below="@+id/allowed_ips_label"
+                android:text="@{item.allowedIps}" />
+
+            <TextView
+                android:id="@+id/endpoint_label"
+                android:layout_width="match_parent"
+                android:layout_height="wrap_content"
+                android:layout_below="@+id/allowed_ips_text"
+                android:layout_marginTop="8dp"
+                android:labelFor="@+id/endpoint_text"
+                android:text="@string/endpoint" />
+
+            <TextView
+                android:id="@+id/endpoint_text"
+                style="?android:attr/textAppearanceMedium"
+                android:layout_width="match_parent"
+                android:layout_height="wrap_content"
+                android:layout_below="@+id/endpoint_label"
+                android:text="@{item.endpoint}" />
+
+            <TextView
+                android:id="@+id/transfer_label"
+                android:layout_width="match_parent"
+                android:layout_height="wrap_content"
+                android:layout_below="@+id/endpoint_text"
+                android:layout_marginTop="8dp"
+                android:labelFor="@+id/transfer_text"
+                android:text="@string/transfer"
+                android:visibility="gone" />
+
+            <TextView
+                android:id="@+id/transfer_text"
+                style="?android:attr/textAppearanceMedium"
+                android:layout_width="match_parent"
+                android:layout_height="wrap_content"
+                android:layout_below="@+id/transfer_label"
+                android:visibility="gone" />
+        </RelativeLayout>
+    </androidx.cardview.widget.CardView>
+</layout>
diff --git a/ui/src/main/res/layout/tunnel_editor_fragment.xml b/ui/src/main/res/layout/tunnel_editor_fragment.xml
new file mode 100644
index 00000000..887b3bb7
--- /dev/null
+++ b/ui/src/main/res/layout/tunnel_editor_fragment.xml
@@ -0,0 +1,254 @@
+<?xml version="1.0" encoding="utf-8"?>
+<layout xmlns:android="http://schemas.android.com/apk/res/android"
+    xmlns:app="http://schemas.android.com/apk/res-auto"
+    xmlns:tools="http://schemas.android.com/tools">
+
+    <data>
+
+        <import type="com.wireguard.android.util.ClipboardUtils" />
+
+        <import type="com.wireguard.android.widget.KeyInputFilter" />
+
+        <import type="com.wireguard.android.widget.NameInputFilter" />
+
+        <variable
+            name="fragment"
+            type="com.wireguard.android.fragment.TunnelEditorFragment" />
+
+        <variable
+            name="config"
+            type="com.wireguard.android.viewmodel.ConfigProxy" />
+
+        <variable
+            name="name"
+            type="String" />
+    </data>
+
+    <androidx.coordinatorlayout.widget.CoordinatorLayout
+        android:id="@+id/main_container"
+        android:layout_width="match_parent"
+        android:layout_height="match_parent"
+        android:background="?attr/colorBackground">
+
+        <ScrollView
+            android:layout_width="match_parent"
+            android:layout_height="match_parent">
+
+            <LinearLayout
+                android:layout_width="match_parent"
+                android:layout_height="wrap_content"
+                android:orientation="vertical">
+
+                <androidx.cardview.widget.CardView
+                    android:layout_width="match_parent"
+                    android:layout_height="wrap_content"
+                    android:layout_marginBottom="4dp"
+                    android:layout_marginEnd="8dp"
+                    android:layout_marginStart="8dp"
+                    android:layout_marginTop="8dp"
+                    android:background="?attr/colorBackground"
+                    app:cardCornerRadius="4dp"
+                    app:cardElevation="2dp"
+                    app:contentPadding="8dp">
+
+                    <RelativeLayout
+                        android:layout_width="match_parent"
+                        android:layout_height="wrap_content">
+
+                        <TextView
+                            android:id="@+id/interface_title"
+                            style="?android:attr/textAppearanceMedium"
+                            android:layout_width="match_parent"
+                            android:layout_height="wrap_content"
+                            android:layout_alignParentTop="true"
+                            android:text="@string/interface_title" />
+
+                        <TextView
+                            android:id="@+id/interface_name_label"
+                            android:layout_width="match_parent"
+                            android:layout_height="wrap_content"
+                            android:layout_below="@+id/interface_title"
+                            android:layout_marginTop="8dp"
+                            android:labelFor="@+id/interface_name_text"
+                            android:text="@string/name" />
+
+                        <EditText
+                            android:id="@+id/interface_name_text"
+                            android:layout_width="match_parent"
+                            android:layout_height="wrap_content"
+                            android:layout_below="@+id/interface_name_label"
+                            android:inputType="textNoSuggestions|textVisiblePassword"
+                            android:text="@={name}"
+                            app:filter="@{NameInputFilter.newInstance()}" />
+
+                        <TextView
+                            android:id="@+id/private_key_label"
+                            android:layout_width="match_parent"
+                            android:layout_height="wrap_content"
+                            android:layout_below="@+id/interface_name_text"
+                            android:labelFor="@+id/private_key_text"
+                            android:text="@string/private_key" />
+
+                        <EditText
+                            android:id="@+id/private_key_text"
+                            android:layout_width="wrap_content"
+                            android:layout_height="wrap_content"
+                            android:layout_alignParentStart="true"
+                            android:layout_below="@+id/private_key_label"
+                            android:layout_toStartOf="@+id/generate_private_key_button"
+                            android:contentDescription="@string/public_key_description"
+                            android:inputType="textNoSuggestions|textVisiblePassword"
+                            android:text="@={config.interface.privateKey}"
+                            app:filter="@{KeyInputFilter.newInstance()}" />
+
+                        <Button
+                            android:id="@+id/generate_private_key_button"
+                            style="@style/Widget.AppCompat.Button.Borderless.Colored"
+                            android:layout_width="wrap_content"
+                            android:layout_height="wrap_content"
+                            android:layout_alignBottom="@id/private_key_text"
+                            android:layout_alignParentEnd="true"
+                            android:layout_below="@+id/private_key_label"
+                            android:onClick="@{() -> config.interface.generateKeyPair()}"
+                            android:text="@string/generate" />
+
+                        <TextView
+                            android:id="@+id/public_key_label"
+                            android:layout_width="match_parent"
+                            android:layout_height="wrap_content"
+                            android:layout_below="@+id/private_key_text"
+                            android:labelFor="@+id/public_key_text"
+                            android:text="@string/public_key" />
+
+                        <TextView
+                            android:id="@+id/public_key_text"
+                            style="?attr/editTextStyle"
+                            android:layout_width="match_parent"
+                            android:layout_height="wrap_content"
+                            android:layout_below="@+id/public_key_label"
+                            android:contentDescription="@string/public_key_description"
+                            android:ellipsize="end"
+                            android:focusable="false"
+                            android:hint="@string/hint_generated"
+                            android:maxLines="1"
+                            android:onClick="@{ClipboardUtils::copyTextView}"
+                            android:text="@{config.interface.publicKey}" />
+
+                        <TextView
+                            android:id="@+id/addresses_label"
+                            android:layout_width="wrap_content"
+                            android:layout_height="wrap_content"
+                            android:layout_alignParentStart="true"
+                            android:layout_below="@+id/public_key_text"
+                            android:layout_toStartOf="@+id/listen_port_label"
+                            android:labelFor="@+id/addresses_text"
+                            android:text="@string/addresses" />
+
+                        <EditText
+                            android:id="@+id/addresses_text"
+                            android:layout_width="wrap_content"
+                            android:layout_height="wrap_content"
+                            android:layout_alignParentStart="true"
+                            android:layout_below="@+id/addresses_label"
+                            android:layout_toStartOf="@+id/listen_port_text"
+                            android:inputType="textNoSuggestions|textVisiblePassword"
+                            android:text="@={config.interface.addresses}" />
+
+                        <TextView
+                            android:id="@+id/listen_port_label"
+                            android:layout_width="wrap_content"
+                            android:layout_height="wrap_content"
+                            android:layout_alignBaseline="@+id/addresses_label"
+                            android:layout_alignParentEnd="true"
+                            android:layout_alignStart="@+id/generate_private_key_button"
+                            android:labelFor="@+id/listen_port_text"
+                            android:text="@string/listen_port" />
+
+                        <EditText
+                            android:id="@+id/listen_port_text"
+                            android:layout_width="wrap_content"
+                            android:layout_height="wrap_content"
+                            android:layout_alignBaseline="@+id/addresses_text"
+                            android:layout_alignParentEnd="true"
+                            android:layout_alignStart="@+id/generate_private_key_button"
+                            android:hint="@string/hint_random"
+                            android:inputType="number"
+                            android:text="@={config.interface.listenPort}"
+                            android:textAlignment="center" />
+
+                        <TextView
+                            android:id="@+id/dns_servers_label"
+                            android:layout_width="wrap_content"
+                            android:layout_height="wrap_content"
+                            android:layout_alignParentStart="true"
+                            android:layout_below="@+id/addresses_text"
+                            android:layout_toStartOf="@+id/mtu_label"
+                            android:labelFor="@+id/dns_servers_text"
+                            android:text="@string/dns_servers" />
+
+                        <EditText
+                            android:id="@+id/dns_servers_text"
+                            android:layout_width="wrap_content"
+                            android:layout_height="wrap_content"
+                            android:layout_alignParentStart="true"
+                            android:layout_below="@+id/dns_servers_label"
+                            android:layout_toStartOf="@+id/mtu_text"
+                            android:inputType="textNoSuggestions|textVisiblePassword"
+                            android:text="@={config.interface.dnsServers}" />
+
+                        <TextView
+                            android:id="@+id/mtu_label"
+                            android:layout_width="wrap_content"
+                            android:layout_height="wrap_content"
+                            android:layout_alignBaseline="@+id/dns_servers_label"
+                            android:layout_alignParentEnd="true"
+                            android:layout_alignStart="@+id/generate_private_key_button"
+                            android:labelFor="@+id/mtu_text"
+                            android:text="@string/mtu" />
+
+                        <EditText
+                            android:id="@+id/mtu_text"
+                            android:layout_width="wrap_content"
+                            android:layout_height="wrap_content"
+                            android:layout_alignBaseline="@+id/dns_servers_text"
+                            android:layout_alignParentEnd="true"
+                            android:layout_alignStart="@+id/generate_private_key_button"
+                            android:hint="@string/hint_automatic"
+                            android:inputType="number"
+                            android:text="@={config.interface.mtu}"
+                            android:textAlignment="center" />
+
+                        <Button
+                            android:id="@+id/set_excluded_applications"
+                            style="@style/Widget.AppCompat.Button.Borderless.Colored"
+                            android:layout_width="wrap_content"
+                            android:layout_height="wrap_content"
+                            android:layout_below="@+id/dns_servers_text"
+                            android:layout_marginLeft="-8dp"
+                            android:onClick="@{fragment::onRequestSetExcludedApplications}"
+                            android:text="@{@plurals/set_excluded_applications(config.interface.excludedApplications.size, config.interface.excludedApplications.size)}" />
+                    </RelativeLayout>
+                </androidx.cardview.widget.CardView>
+
+                <LinearLayout
+                    android:layout_width="match_parent"
+                    android:layout_height="wrap_content"
+                    android:divider="@null"
+                    android:orientation="vertical"
+                    app:items="@{config.peers}"
+                    app:layout="@{@layout/tunnel_editor_peer}"
+                    tools:ignore="UselessLeaf" />
+
+                <Button
+                    style="@style/Widget.AppCompat.Button.Colored"
+                    android:layout_width="match_parent"
+                    android:layout_height="wrap_content"
+                    android:layout_marginBottom="4dp"
+                    android:layout_marginEnd="4dp"
+                    android:layout_marginStart="4dp"
+                    android:onClick="@{() -> config.addPeer()}"
+                    android:text="@string/add_peer" />
+            </LinearLayout>
+        </ScrollView>
+    </androidx.coordinatorlayout.widget.CoordinatorLayout>
+</layout>
diff --git a/ui/src/main/res/layout/tunnel_editor_peer.xml b/ui/src/main/res/layout/tunnel_editor_peer.xml
new file mode 100644
index 00000000..cf5d6286
--- /dev/null
+++ b/ui/src/main/res/layout/tunnel_editor_peer.xml
@@ -0,0 +1,161 @@
+<?xml version="1.0" encoding="utf-8"?>
+<layout xmlns:android="http://schemas.android.com/apk/res/android"
+    xmlns:app="http://schemas.android.com/apk/res-auto">
+
+    <data>
+
+        <import type="android.view.View" />
+
+        <import type="com.wireguard.android.widget.KeyInputFilter" />
+
+        <variable
+            name="collection"
+            type="androidx.databinding.ObservableList&lt;com.wireguard.android.viewmodel.PeerProxy&gt;" />
+
+        <variable
+            name="item"
+            type="com.wireguard.android.viewmodel.PeerProxy" />
+    </data>
+
+    <androidx.cardview.widget.CardView
+        android:layout_width="wrap_content"
+        android:layout_height="wrap_content"
+        android:layout_marginBottom="4dp"
+        android:layout_marginEnd="8dp"
+        android:layout_marginStart="8dp"
+        android:layout_marginTop="4dp"
+        android:background="?attr/colorBackground"
+        app:cardCornerRadius="4dp"
+        app:cardElevation="2dp"
+        app:contentPadding="8dp">
+
+        <RelativeLayout
+            android:layout_width="match_parent"
+            android:layout_height="wrap_content">
+
+            <TextView
+                android:id="@+id/peer_title"
+                style="?android:attr/textAppearanceMedium"
+                android:layout_width="wrap_content"
+                android:layout_height="wrap_content"
+                android:layout_alignParentStart="true"
+                android:layout_alignParentTop="true"
+                android:layout_marginBottom="8dp"
+                android:layout_toStartOf="@+id/peer_action_delete"
+                android:text="@string/peer" />
+
+            <ImageButton
+                android:id="@+id/peer_action_delete"
+                android:layout_width="wrap_content"
+                android:layout_height="wrap_content"
+                android:layout_alignParentEnd="true"
+                android:layout_alignParentTop="true"
+                android:background="@null"
+                android:contentDescription="@string/delete"
+                android:onClick="@{() -> item.unbind()}"
+                android:src="@drawable/ic_action_delete" />
+
+            <TextView
+                android:id="@+id/public_key_label"
+                android:layout_width="match_parent"
+                android:layout_height="wrap_content"
+                android:layout_below="@id/peer_title"
+                android:labelFor="@+id/public_key_text"
+                android:text="@string/public_key" />
+
+            <EditText
+                android:id="@+id/public_key_text"
+                android:layout_width="match_parent"
+                android:layout_height="wrap_content"
+                android:layout_below="@+id/public_key_label"
+                android:inputType="textNoSuggestions|textVisiblePassword"
+                android:text="@={item.publicKey}"
+                app:filter="@{KeyInputFilter.newInstance()}" />
+
+            <TextView
+                android:id="@+id/pre_shared_key_label"
+                android:layout_width="match_parent"
+                android:layout_height="wrap_content"
+                android:layout_below="@+id/public_key_text"
+                android:labelFor="@+id/pre_shared_key_text"
+                android:text="@string/pre_shared_key" />
+
+            <EditText
+                android:id="@+id/pre_shared_key_text"
+                android:layout_width="match_parent"
+                android:layout_height="wrap_content"
+                android:layout_below="@+id/pre_shared_key_label"
+                android:hint="@string/hint_optional"
+                android:inputType="textNoSuggestions|textVisiblePassword"
+                android:text="@={item.preSharedKey}" />
+
+            <TextView
+                android:id="@+id/allowed_ips_label"
+                android:layout_width="match_parent"
+                android:layout_height="wrap_content"
+                android:layout_below="@+id/pre_shared_key_text"
+                android:layout_toStartOf="@+id/exclude_private_ips"
+                android:labelFor="@+id/allowed_ips_text"
+                android:text="@string/allowed_ips" />
+
+            <CheckBox
+                android:id="@+id/exclude_private_ips"
+                android:layout_width="wrap_content"
+                android:layout_height="wrap_content"
+                android:layout_alignBaseline="@+id/allowed_ips_label"
+                android:layout_alignParentEnd="true"
+                android:checked="@={item.excludingPrivateIps}"
+                android:text="@string/exclude_private_ips"
+                android:visibility="@{item.ableToExcludePrivateIps ? View.VISIBLE : View.GONE}" />
+
+            <EditText
+                android:id="@+id/allowed_ips_text"
+                android:layout_width="match_parent"
+                android:layout_height="wrap_content"
+                android:layout_below="@+id/allowed_ips_label"
+                android:inputType="textNoSuggestions|textVisiblePassword"
+                android:text="@={item.allowedIps}" />
+
+            <TextView
+                android:id="@+id/endpoint_label"
+                android:layout_width="wrap_content"
+                android:layout_height="wrap_content"
+                android:layout_alignParentStart="true"
+                android:layout_below="@+id/allowed_ips_text"
+                android:layout_toStartOf="@+id/persistent_keepalive_label"
+                android:labelFor="@+id/endpoint_text"
+                android:text="@string/endpoint" />
+
+            <EditText
+                android:id="@+id/endpoint_text"
+                android:layout_width="wrap_content"
+                android:layout_height="wrap_content"
+                android:layout_alignParentStart="true"
+                android:layout_below="@+id/endpoint_label"
+                android:layout_toStartOf="@+id/persistent_keepalive_text"
+                android:inputType="textNoSuggestions|textVisiblePassword"
+                android:text="@={item.endpoint}" />
+
+            <TextView
+                android:id="@+id/persistent_keepalive_label"
+                android:layout_width="96dp"
+                android:layout_height="wrap_content"
+                android:layout_alignBaseline="@+id/endpoint_label"
+                android:layout_alignParentEnd="true"
+                android:labelFor="@+id/persistent_keepalive_text"
+                android:text="@string/persistent_keepalive" />
+
+            <EditText
+                android:id="@+id/persistent_keepalive_text"
+                android:layout_width="wrap_content"
+                android:layout_height="wrap_content"
+                android:layout_alignBaseline="@+id/endpoint_text"
+                android:layout_alignParentEnd="true"
+                android:layout_alignStart="@+id/persistent_keepalive_label"
+                android:hint="@string/hint_optional"
+                android:inputType="number"
+                android:text="@={item.persistentKeepalive}"
+                android:textAlignment="center" />
+        </RelativeLayout>
+    </androidx.cardview.widget.CardView>
+</layout>
diff --git a/ui/src/main/res/layout/tunnel_list_fragment.xml b/ui/src/main/res/layout/tunnel_list_fragment.xml
new file mode 100644
index 00000000..c8144dbb
--- /dev/null
+++ b/ui/src/main/res/layout/tunnel_list_fragment.xml
@@ -0,0 +1,78 @@
+<?xml version="1.0" encoding="utf-8"?>
+<layout xmlns:android="http://schemas.android.com/apk/res/android"
+    xmlns:app="http://schemas.android.com/apk/res-auto"
+    xmlns:tools="http://schemas.android.com/tools">
+
+    <data>
+
+        <import type="com.wireguard.android.model.ObservableTunnel" />
+
+        <variable
+            name="fragment"
+            type="com.wireguard.android.fragment.TunnelListFragment" />
+
+        <variable
+            name="rowConfigurationHandler"
+            type="com.wireguard.android.databinding.ObservableKeyedRecyclerViewAdapter.RowConfigurationHandler" />
+
+        <variable
+            name="tunnels"
+            type="com.wireguard.android.util.ObservableKeyedList&lt;String, ObservableTunnel&gt;" />
+    </data>
+
+    <androidx.coordinatorlayout.widget.CoordinatorLayout
+        android:id="@+id/main_container"
+        android:layout_width="match_parent"
+        android:layout_height="match_parent"
+        android:background="?attr/colorBackground"
+        android:clipChildren="false">
+
+        <androidx.recyclerview.widget.RecyclerView
+            android:id="@+id/tunnel_list"
+            android:layout_width="match_parent"
+            android:layout_height="match_parent"
+            android:choiceMode="multipleChoiceModal"
+            android:clipToPadding="false"
+            android:paddingBottom="@{@dimen/design_fab_size_normal * 1.1f}"
+            android:visibility="@{tunnels.size() > 0 ? android.view.View.VISIBLE : android.view.View.GONE}"
+            app:configurationHandler="@{rowConfigurationHandler}"
+            app:items="@{tunnels}"
+            app:layout="@{@layout/tunnel_list_item}"
+            tools:listitem="@layout/tunnel_list_item"
+            tools:itemCount="12" />
+
+        <LinearLayout
+            android:layout_width="match_parent"
+            android:layout_height="wrap_content"
+            android:layout_gravity="center"
+            android:orientation="vertical"
+            android:visibility="@{tunnels.size() == 0 ? android.view.View.VISIBLE : android.view.View.GONE}"
+            tools:visibility="gone">
+
+            <androidx.appcompat.widget.AppCompatImageView
+                android:id="@+id/logo_placeholder"
+                android:layout_width="140dp"
+                android:layout_height="140dp"
+                android:layout_gravity="center"
+                android:layout_marginBottom="20dp"
+                android:alpha="0.3333333"
+                android:src="@mipmap/ic_launcher" />
+
+            <TextView
+                android:layout_width="wrap_content"
+                android:layout_height="wrap_content"
+                android:layout_gravity="center"
+                android:text="@string/tunnel_list_placeholder"
+                android:textSize="20sp" />
+        </LinearLayout>
+        <com.google.android.material.floatingactionbutton.ExtendedFloatingActionButton
+            style="@style/Widget.MaterialComponents.ExtendedFloatingActionButton.Icon"
+            android:id="@+id/create_fab"
+            android:layout_width="wrap_content"
+            android:layout_height="wrap_content"
+            android:layout_gravity="bottom|end"
+            android:layout_margin="@dimen/fab_margin"
+            app:icon="@drawable/ic_action_add_white" />
+
+    </androidx.coordinatorlayout.widget.CoordinatorLayout>
+</layout>
diff --git a/ui/src/main/res/layout/tunnel_list_item.xml b/ui/src/main/res/layout/tunnel_list_item.xml
new file mode 100644
index 00000000..04c0f51e
--- /dev/null
+++ b/ui/src/main/res/layout/tunnel_list_item.xml
@@ -0,0 +1,62 @@
+<?xml version="1.0" encoding="utf-8"?>
+<layout xmlns:android="http://schemas.android.com/apk/res/android"
+    xmlns:app="http://schemas.android.com/apk/res-auto"
+    xmlns:tools="http://schemas.android.com/tools">
+
+    <data>
+
+        <import type="com.wireguard.android.model.ObservableTunnel" />
+
+        <import type="com.wireguard.android.backend.Tunnel.State" />
+
+        <variable
+            name="collection"
+            type="com.wireguard.android.util.ObservableKeyedList&lt;String, ObservableTunnel&gt;" />
+
+        <variable
+            name="key"
+            type="String" />
+
+        <variable
+            name="item"
+            type="com.wireguard.android.model.ObservableTunnel" />
+
+        <variable
+            name="fragment"
+            type="com.wireguard.android.fragment.TunnelListFragment" />
+    </data>
+
+    <com.wireguard.android.widget.MultiselectableRelativeLayout
+        android:id="@+id/tunnel_list_item"
+        android:layout_width="match_parent"
+        android:layout_height="wrap_content"
+        android:background="@drawable/list_item_background"
+        android:descendantFocusability="beforeDescendants"
+        android:focusable="true"
+        android:nextFocusRight="@+id/tunnel_switch"
+        android:padding="16dp">
+
+        <TextView
+            android:id="@+id/tunnel_name"
+            style="?android:attr/textAppearanceMedium"
+            android:layout_width="wrap_content"
+            android:layout_height="wrap_content"
+            android:layout_alignParentStart="true"
+            android:layout_alignParentTop="true"
+            android:ellipsize="end"
+            android:maxLines="1"
+            android:text="@{key}"
+            tools:text="@sample/interface_names.json/names/names/name" />
+
+        <com.wireguard.android.widget.ToggleSwitch
+            android:id="@+id/tunnel_switch"
+            android:layout_width="wrap_content"
+            android:layout_height="wrap_content"
+            android:layout_alignBaseline="@+id/tunnel_name"
+            android:layout_alignParentEnd="true"
+            android:nextFocusLeft="@+id/tunnel_list_item"
+            app:checked="@{item.state == State.UP}"
+            app:onBeforeCheckedChanged="@{fragment::setTunnelState}"
+            tools:checked="@sample/interface_names.json/names/checked/checked" />
+    </com.wireguard.android.widget.MultiselectableRelativeLayout>
+</layout>