diff --git a/data/document_preview/meson.build b/data/document_preview/meson.build
new file mode 100644
index 0000000..6fe0674
--- /dev/null
+++ b/data/document_preview/meson.build
@@ -0,0 +1,4 @@
+install_data(
+  'preview-style.xml',
+  install_dir: get_option('datadir') / meson.project_name() / 'document_preview',
+)
\ No newline at end of file
diff --git a/data/document_preview/preview-style.xml b/data/document_preview/preview-style.xml
new file mode 100644
index 0000000..0d1cb39
--- /dev/null
+++ b/data/document_preview/preview-style.xml
@@ -0,0 +1,23 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<style-scheme id="preview-style" name="Preview Style" version="1.0">
+  <author>sevonj</author>
+  <_description>Default Theme for Scratchmark</_description>
+
+  <!-- transparent bg -->
+  <style name="text" background="#00000000" />
+
+  <style name="markdown:h1" bold="true" />
+  <style name="markdown:h2" bold="true" />
+  <style name="markdown:h3" bold="true" />
+  <style name="markdown:h4" bold="true" />
+  <style name="markdown:h5" bold="true" />
+  <style name="markdown:h6" bold="true" />
+  <style name="markdown:bold" bold="true" />
+  <style name="markdown:italic" italic="true" />
+  <style name="markdown:bold-italic" bold="true" italic="true" />
+  <style name="markdown:code" />
+  <style name="markdown:strikethrough" strikethrough="true" />
+  <!-- TODO style name="markdown:subscript" /-->
+  <!-- TODO style name="markdown:superscript" /-->
+
+</style-scheme>
\ No newline at end of file
diff --git a/data/meson.build b/data/meson.build
index 34c3f51..378f9d3 100644
--- a/data/meson.build
+++ b/data/meson.build
@@ -36,4 +36,5 @@ test('Validate schema file',
 subdir('icons')
 subdir('resources')
 subdir('editor_schemes')
+subdir('document_preview')
 subdir('language_specs')
diff --git a/data/org.scratchmark.Scratchmark.gschema.xml b/data/org.scratchmark.Scratchmark.gschema.xml
index 5343eea..3321ac3 100644
--- a/data/org.scratchmark.Scratchmark.gschema.xml
+++ b/data/org.scratchmark.Scratchmark.gschema.xml
@@ -19,6 +19,15 @@
     <key name="library-show-sidebar" type="b">
       <default>true</default>
     </key>
+    <key name="library-two-column-sidebar" type="b">
+      <default>true</default>
+    </key>
+    <key name="library-sort-method" type="s">
+      <default>"AlphanumericAsc"</default>
+    </key>
+    <key name="library-details-sort-method" type="s">
+      <default>"AlphanumericAsc"</default>
+    </key>
     <key name="editor-show-sidebar" type="b">
       <default>false</default>
     </key>
diff --git a/data/resources/gresources.xml b/data/resources/gresources.xml
index 61c6255..75aaf3e 100644
--- a/data/resources/gresources.xml
+++ b/data/resources/gresources.xml
@@ -10,6 +10,7 @@
     <file preprocess="xml-stripblanks" compressed="true">ui/library/delete_confirm_dialog.ui</file>
     <file preprocess="xml-stripblanks" compressed="true">ui/library/document_context_menu.ui</file>
     <file preprocess="xml-stripblanks" compressed="true">ui/library/document_row.ui</file>
+    <file preprocess="xml-stripblanks" compressed="true">ui/library/document_preview_row.ui</file>
     <file preprocess="xml-stripblanks" compressed="true">ui/library/document_create_popover.ui</file>
     <file preprocess="xml-stripblanks" compressed="true">ui/library/drafts_context_menu.ui</file>
     <file preprocess="xml-stripblanks" compressed="true">ui/library/err_placeholder_row_context_menu.ui</file>
@@ -17,9 +18,9 @@
     <file preprocess="xml-stripblanks" compressed="true">ui/library/folder_create_popover.ui</file>
     <file preprocess="xml-stripblanks" compressed="true">ui/library/folder_context_menu.ui</file>
     <file preprocess="xml-stripblanks" compressed="true">ui/library/folder_row.ui</file>
+    <file preprocess="xml-stripblanks" compressed="true">ui/library/folder_view.ui</file>
     <file preprocess="xml-stripblanks" compressed="true">ui/library/item_rename_popover.ui</file>
     <file preprocess="xml-stripblanks" compressed="true">ui/library/library_view.ui</file>
-    <file preprocess="xml-stripblanks" compressed="true">ui/library/project_view.ui</file>
     <file preprocess="xml-stripblanks" compressed="true">ui/library/root_context_menu.ui</file>
     <file preprocess="xml-stripblanks" compressed="true">ui/about_dialog.ui</file>
     <file preprocess="xml-stripblanks" compressed="true">ui/editor_placeholder.ui</file>
@@ -40,6 +41,8 @@
     <file preprocess="xml-stripblanks">icons/scalable/actions/folder-symbolic.svg</file>
     <file preprocess="xml-stripblanks">icons/scalable/actions/info-outline-symbolic.svg</file>
     <file preprocess="xml-stripblanks">icons/scalable/actions/library-symbolic.svg</file>
+    <file preprocess="xml-stripblanks">icons/scalable/actions/library-sort-asc-symbolic.svg</file>
+    <file preprocess="xml-stripblanks">icons/scalable/actions/library-sort-desc-symbolic.svg</file>
     <file preprocess="xml-stripblanks">icons/scalable/actions/library-sort-symbolic.svg</file>
     <file preprocess="xml-stripblanks">icons/scalable/actions/list-compact-symbolic.svg</file>
     <file preprocess="xml-stripblanks">icons/scalable/actions/match-words-symbolic.svg</file>
diff --git a/data/resources/icons/scalable/actions/library-sort-asc-symbolic.svg b/data/resources/icons/scalable/actions/library-sort-asc-symbolic.svg
new file mode 100644
index 0000000..5bfb634
--- /dev/null
+++ b/data/resources/icons/scalable/actions/library-sort-asc-symbolic.svg
@@ -0,0 +1,38 @@
+
+  <svg
+          xmlns='http://www.w3.org/2000/svg'
+          width='16'
+          height='16'
+          xmlns:gpa='https://www.gtk.org/grappa'
+          gpa:version='1'
+          gpa:keywords='view-sort-ascending arrow'
+          gpa:state='0'>
+    <style
+            type='text/css'>
+    .not-initial-state {
+      display: none;
+    }
+  </style>
+    <path
+            d='M 7 13 L 15 13 M 7 10 L 13 10 M 7 7 L 11 7'
+            id='items'
+            stroke-width='2'
+            stroke-linecap='round'
+            stroke-linejoin='round'
+            stroke='rgb(0,0,0)'
+            fill='none'
+            class='foreground-stroke transparent-fill'
+            gpa:stroke='foreground'>
+    </path>
+    <path
+            d='M 1 3 L 3 1 L 5 3 M 3 15 L 3 1'
+            id='arrow'
+            stroke-width='2'
+            stroke-linecap='round'
+            stroke-linejoin='round'
+            stroke='rgb(0,0,0)'
+            fill='none'
+            class='foreground-stroke transparent-fill'
+            gpa:stroke='foreground'>
+    </path>
+  </svg>
\ No newline at end of file
diff --git a/data/resources/icons/scalable/actions/library-sort-desc-symbolic.svg b/data/resources/icons/scalable/actions/library-sort-desc-symbolic.svg
new file mode 100644
index 0000000..b325d22
--- /dev/null
+++ b/data/resources/icons/scalable/actions/library-sort-desc-symbolic.svg
@@ -0,0 +1,38 @@
+
+  <svg
+          xmlns='http://www.w3.org/2000/svg'
+          width='16'
+          height='16'
+          xmlns:gpa='https://www.gtk.org/grappa'
+          gpa:version='1'
+          gpa:keywords='view-sort-descending arrow'
+          gpa:state='0'>
+    <style
+            type='text/css'>
+    .not-initial-state {
+      display: none;
+    }
+  </style>
+    <path
+            d='M 7 3 L 15 3 M 7 6 L 13 6 M 7 9 L 11 9'
+            id='items'
+            stroke-width='2'
+            stroke-linecap='round'
+            stroke-linejoin='round'
+            stroke='rgb(0,0,0)'
+            fill='none'
+            class='foreground-stroke transparent-fill'
+            gpa:stroke='foreground'>
+    </path>
+    <path
+            d='M 1 13 L 3 15 L 5 13 M 3 1 L 3 15'
+            id='arrow'
+            stroke-width='2'
+            stroke-linecap='round'
+            stroke-linejoin='round'
+            stroke='rgb(0,0,0)'
+            fill='none'
+            class='foreground-stroke transparent-fill'
+            gpa:stroke='foreground'>
+    </path>
+  </svg>
\ No newline at end of file
diff --git a/data/resources/ui/library/document_preview_row.ui b/data/resources/ui/library/document_preview_row.ui
new file mode 100644
index 0000000..0d1cdf8
--- /dev/null
+++ b/data/resources/ui/library/document_preview_row.ui
@@ -0,0 +1,31 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<interface>
+    <template class="DocumentPreviewRow" parent="GtkListBoxRow">
+        <property name="width-request">192</property>
+        <property name="height-request">96</property>
+        <child>
+            <object class="GtkBox">
+                <property name="orientation">GTK_ORIENTATION_VERTICAL</property>
+                <property name="margin-top">6</property>
+                <property name="margin-bottom">6</property>
+                <child>
+                    <object class="GtkLabel" id="document_name_label">
+                        <property name="label" translatable="no">document-name-here</property>
+                        <property name="xalign">0</property>
+                        <property name="ellipsize">PANGO_ELLIPSIZE_END</property>
+                        <attributes>
+                            <attribute name="weight" value="PANGO_WEIGHT_BOLD" />
+                        </attributes>
+                    </object>
+                </child>
+                <child>
+                    <object class="GtkSourceView" id="view">
+                        <property name="editable">False</property>
+                        <property name="cursor-visible">False</property>
+                        <property name="sensitive">False</property>
+                    </object>
+                </child>
+            </object>
+        </child>
+    </template>
+</interface>
\ No newline at end of file
diff --git a/data/resources/ui/library/document_row.ui b/data/resources/ui/library/document_row.ui
index ece37f5..00bf425 100644
--- a/data/resources/ui/library/document_row.ui
+++ b/data/resources/ui/library/document_row.ui
@@ -1,7 +1,6 @@
 <?xml version="1.0" encoding="UTF-8"?>
 <interface>
     <template class="DocumentRow" parent="GtkListBoxRow">
-
         <child>
             <object class="GtkBox">
                 <property name="orientation">GTK_ORIENTATION_HORIZONTAL</property>
diff --git a/data/resources/ui/library/folder_row.ui b/data/resources/ui/library/folder_row.ui
index e701c45..35f9c1f 100644
--- a/data/resources/ui/library/folder_row.ui
+++ b/data/resources/ui/library/folder_row.ui
@@ -6,12 +6,17 @@
                 <property name="orientation">GTK_ORIENTATION_HORIZONTAL</property>
                 <property name="spacing">4</property>
                 <child>
-                    <object class="GtkImage" id="expand_icon">
-                        <style>
-                            <class name="dim-label" />
-                        </style>
-                        <property name="icon-name">down-small-symbolic</property>
-                        <property name="icon-size">GTK_ICON_SIZE_NORMAL</property>
+                    <object class="AdwBin">
+                        <property name="width-request">16</property>
+                        <child>
+                            <object class="GtkImage" id="expand_icon">
+                                <style>
+                                    <class name="dim-label" />
+                                </style>
+                                <property name="icon-name">down-small-symbolic</property>
+                                <property name="icon-size">GTK_ICON_SIZE_NORMAL</property>
+                            </object>
+                        </child>
                     </object>
                 </child>
                 <child>
diff --git a/data/resources/ui/library/folder_view.ui b/data/resources/ui/library/folder_view.ui
new file mode 100644
index 0000000..e2ae0f4
--- /dev/null
+++ b/data/resources/ui/library/folder_view.ui
@@ -0,0 +1,80 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<interface>
+  <template class="FolderView" parent="AdwNavigationPage">
+    <property name="title" translatable="no">folder-name-here</property>
+    <property name="child">
+      <object class="AdwToolbarView">
+        <child type="top">
+          <object class="AdwHeaderBar">
+            <!--property name="show-title">False</property-->
+            <child type="end">
+              <object class="GtkMenuButton" id="sort_button">
+                <property name="icon-name">library-sort-asc-symbolic</property>
+                <property name="tooltip-text" translatable="yes">Sort</property>
+                <property name="popover">
+                  <object class="GtkPopoverMenu">
+                    <property name="menu-model">sort_menu</property>
+                  </object>
+                </property>
+              </object>
+            </child>
+          </object>
+        </child>
+        <child>
+          <object class="GtkBox">
+            <property name="orientation">GTK_ORIENTATION_VERTICAL</property>
+            <property name="vexpand">True</property>
+            <child>
+              <object class="GtkLabel" id="empty_placeholder">
+                <property name="label" translatable="yes">Folder is empty</property>
+                <style>
+                  <class name="dimmed" />
+                </style>
+              </object>
+            </child>
+            <child>
+              <object class="GtkScrolledWindow">
+                <property name="vexpand">True</property>
+                <property name="hexpand">true</property>
+                <property name="width-request">256</property>
+                <child>
+                  <object class="GtkListBox" id="listbox">
+                    <style>
+                      <class name="navigation-sidebar" />
+                    </style>
+                  </object>
+                </child>
+              </object>
+            </child>
+          </object>
+        </child>
+      </object>
+    </property>
+  </template>
+  <menu id="sort_menu">
+    <section>
+      <attribute name="label" translatable="yes">Sort</attribute>
+      <!-- see SortMethod enum-->
+      <item>
+        <attribute name="label" translatable="yes">A-Z</attribute>
+        <attribute name="action">folder-view.sort-method</attribute>
+        <attribute name="target">AlphanumericAsc</attribute>
+      </item>
+      <item>
+        <attribute name="label" translatable="yes">Z-A</attribute>
+        <attribute name="action">folder-view.sort-method</attribute>
+        <attribute name="target">AlphanumericDesc</attribute>
+      </item>
+      <item>
+        <attribute name="label" translatable="yes">Last Modified</attribute>
+        <attribute name="action">folder-view.sort-method</attribute>
+        <attribute name="target">ModifiedDesc</attribute>
+      </item>
+      <item>
+        <attribute name="label" translatable="yes">First Modified</attribute>
+        <attribute name="action">folder-view.sort-method</attribute>
+        <attribute name="target">ModifiedAsc</attribute>
+      </item>
+    </section>
+  </menu>
+</interface>
\ No newline at end of file
diff --git a/data/resources/ui/library/project_view.ui b/data/resources/ui/library/project_view.ui
deleted file mode 100644
index 4c432b0..0000000
--- a/data/resources/ui/library/project_view.ui
+++ /dev/null
@@ -1,19 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<interface>
-    <template class="ProjectView" parent="AdwBin">
-        <!--child>
-            <object class="GtkBox" id="project_root_vbox">
-                <property name="orientation">GTK_ORIENTATION_VERTICAL</property>
-                <property name="margin-start">6</property>
-                <property name="margin-end">6</property>
-            </object>
-        </child-->
-        <child>
-            <object class="GtkListBox" id="project_vbox">
-                <style>
-                    <class name="navigation-sidebar" />
-                </style>
-            </object>
-        </child>
-    </template>
-</interface>
\ No newline at end of file
diff --git a/data/resources/ui/window.ui b/data/resources/ui/window.ui
index da7c42e..88be542 100644
--- a/data/resources/ui/window.ui
+++ b/data/resources/ui/window.ui
@@ -15,35 +15,50 @@
     <child>
       <object class="AdwOverlaySplitView" id="top_split">
         <property name="sidebar">
-          <object class="AdwNavigationPage" id="sidebar_page">
+          <object class="AdwNavigationPage">
             <property name="title" translatable="yes">Library</property>
             <property name="child">
-              <object class="AdwToolbarView" id="sidebar_toolbar_view">
-                <child type="top">
-                  <object class="AdwHeaderBar">
-                    <child type="start">
-                      <object class="GtkMenuButton">
-                        <property name="icon-name">library-sort-symbolic</property>
-                        <property name="always-show-arrow">True</property>
-                        <property name="tooltip-text" translatable="yes">Sort</property>
-                        <property name="popover">
-                          <object class="GtkPopoverMenu">
-                            <property name="menu-model">sort_menu</property>
-                            <property name="halign">GTK_ALIGN_START</property>
+              <object class="AdwNavigationSplitView" id="inner_view">
+                <property name="min-sidebar-width">290</property>
+                <property name="max-sidebar-width">520</property>
+                <property name="sidebar-width-fraction">0.355</property>
+                <property name="sidebar">
+                  <object class="AdwNavigationPage">
+                    <property name="title" translatable="yes">Library</property>
+                    <property name="child">
+                      <object class="AdwToolbarView" id="sidebar_toolbar_view">
+                        <child type="top">
+                          <object class="AdwHeaderBar">
+                            <child type="start">
+                              <object class="AdwSplitButton" id="sidebar_split_button">
+                                <property name="icon-name">dock-left-symbolic</property>
+                                <property name="tooltip-text" translatable="yes">Hide Sidebar (F9)</property>
+                                <property name="dropdown-tooltip" translatable="yes">Sidebar Options</property>
+                                <property name="popover">
+                                  <object class="GtkPopoverMenu">
+                                    <property name="menu-model">sidebar_menu</property>
+                                    <property name="halign">GTK_ALIGN_START</property>
+                                  </object>
+                                </property>
+                              </object>
+                            </child>
+                            <child type="end">
+                              <object class="GtkMenuButton">
+                                <property name="primary">True</property>
+                                <property name="icon-name">open-menu-symbolic</property>
+                                <property name="tooltip-text" translatable="yes">Menu</property>
+                                <property name="menu-model">primary_menu</property>
+                              </object>
+                            </child>
                           </object>
-                        </property>
-                      </object>
-                    </child>
-                    <child type="end">
-                      <object class="GtkMenuButton">
-                        <property name="primary">True</property>
-                        <property name="icon-name">open-menu-symbolic</property>
-                        <property name="tooltip-text" translatable="yes">Menu</property>
-                        <property name="menu-model">primary_menu</property>
+                        </child>
                       </object>
-                    </child>
+                    </property>
                   </object>
-                </child>
+                </property>
+                <property name="content">
+                  <object class="FolderView" id="library_folder_column" />
+                </property>
               </object>
             </property>
           </object>
@@ -66,9 +81,9 @@
                               <object class="WindowTitle" id="window_title" />
                             </property>
                             <child type="start">
-                              <object class="GtkToggleButton" id="sidebar_toggle">
+                              <object class="GtkButton" id="sidebar_button">
                                 <property name="icon-name">dock-left-symbolic</property>
-                                <property name="tooltip-text" translatable="yes">Toggle Sidebar (F9)</property>
+                                <property name="tooltip-text" translatable="yes">Show Sidebar (F9)</property>
                               </object>
                             </child>
                             <child type="start">
@@ -176,28 +191,34 @@
       </item>
     </section>
   </menu>
-  <menu id="sort_menu">
+  <menu id="sidebar_menu">
+    <section>
+      <item>
+        <attribute name="label" translatable="yes">Two-Column Sidebar</attribute>
+        <attribute name="action">library.two-column-sidebar</attribute>
+      </item>
+    </section>
     <section>
       <attribute name="label" translatable="yes">Sort</attribute>
       <!-- see SortMethod enum-->
       <item>
         <attribute name="label" translatable="yes">A-Z</attribute>
-        <attribute name="action">library.sort-type</attribute>
+        <attribute name="action">library.sort-method</attribute>
         <attribute name="target">AlphanumericAsc</attribute>
       </item>
       <item>
         <attribute name="label" translatable="yes">Z-A</attribute>
-        <attribute name="action">library.sort-type</attribute>
+        <attribute name="action">library.sort-method</attribute>
         <attribute name="target">AlphanumericDesc</attribute>
       </item>
       <item>
         <attribute name="label" translatable="yes">Last Modified</attribute>
-        <attribute name="action">library.sort-type</attribute>
+        <attribute name="action">library.sort-method</attribute>
         <attribute name="target">ModifiedDesc</attribute>
       </item>
       <item>
         <attribute name="label" translatable="yes">First Modified</attribute>
-        <attribute name="action">library.sort-type</attribute>
+        <attribute name="action">library.sort-method</attribute>
         <attribute name="target">ModifiedAsc</attribute>
       </item>
     </section>
diff --git a/src/data/document.rs b/src/data/document.rs
index 2bb7fc8..3316c18 100644
--- a/src/data/document.rs
+++ b/src/data/document.rs
@@ -28,6 +28,8 @@ mod imp {
         pub(super) is_open_in_editor: Cell<bool>,
         pub(super) modified: RefCell<Option<SystemTime>>,
         pub(super) collation_key: OnceLock<CollationKey>,
+        #[property(nullable, get, set)]
+        pub(super) preview: RefCell<Option<String>>,
     }
 
     #[glib::object_subclass]
@@ -50,22 +52,37 @@ mod imp {
                     Signal::builder("trash-requested").build(),
                     Signal::builder("delete-requested").build(),
                     Signal::builder("metadata-changed").build(),
+                    Signal::builder("preview-updated").build(),
                 ]
             })
         }
+
+        fn constructed(&self) {
+            let obj = self.obj();
+
+            obj.connect_preview_notify(move |obj| {
+                obj.emit_by_name::<()>("preview-updated", &[]);
+            });
+
+            self.parent_constructed();
+        }
     }
 }
 
+use std::fs::File;
+use std::io::BufReader;
+use std::io::Read;
 use std::path::PathBuf;
 use std::time::SystemTime;
 
 use gtk::glib;
-use gtk::glib::CollationKey;
 use gtk::prelude::*;
 use gtk::subclass::prelude::*;
 
 use gtk::gio::Cancellable;
 use gtk::gio::FileCopyFlags;
+use gtk::glib::CollationKey;
+use gtk::glib::MainContext;
 use gtk::glib::Object;
 use gtk::glib::object::ObjectExt;
 
@@ -140,6 +157,22 @@ impl Document {
         self.imp().modified.borrow_mut().replace(modified);
         self.emit_by_name::<()>("metadata-changed", &[]);
     }
+
+    pub fn refresh_preview(&self) {
+        let obj = self.clone();
+        MainContext::default().spawn_local(async move {
+            let Ok(file) = File::open(obj.path()) else {
+                return;
+            };
+            let mut reader = BufReader::new(file);
+            let mut buffer = vec![0; 100];
+            let Ok(n) = reader.read(&mut buffer) else {
+                return;
+            };
+            buffer.truncate(n);
+            obj.set_preview(Some(String::from_utf8_lossy(&buffer).to_string()));
+        });
+    }
 }
 
 #[cfg(test)]
diff --git a/src/data/folder.rs b/src/data/folder.rs
index 0b231ca..a02c028 100644
--- a/src/data/folder.rs
+++ b/src/data/folder.rs
@@ -67,6 +67,7 @@ mod imp {
                         .param_types([String::static_type()])
                         .build(),
                     Signal::builder("metadata-changed").build(),
+                    Signal::builder("contents-changed").build(),
                 ]
             })
         }
@@ -200,6 +201,7 @@ impl Folder {
             ),
         );
         self.imp().documents.borrow_mut().insert(doc.path(), doc);
+        self.emit_by_name::<()>("contents-changed", &[]);
     }
 
     pub fn add_subfolder(&self, folder: Folder) {
@@ -219,14 +221,17 @@ impl Folder {
             .subfolders
             .borrow_mut()
             .insert(folder.path(), folder);
+        self.emit_by_name::<()>("contents-changed", &[]);
     }
 
     pub fn remove_document(&self, path: &Path) {
         self.imp().documents.borrow_mut().remove(path);
+        self.emit_by_name::<()>("contents-changed", &[]);
     }
 
     pub fn remove_subfolder(&self, path: &Path) {
         self.imp().subfolders.borrow_mut().remove(path);
+        self.emit_by_name::<()>("contents-changed", &[]);
     }
 
     pub fn select(&self) {
diff --git a/src/data/markdown_buffer/mod.rs b/src/data/markdown_buffer/mod.rs
index 6fe817e..cdffd85 100644
--- a/src/data/markdown_buffer/mod.rs
+++ b/src/data/markdown_buffer/mod.rs
@@ -180,9 +180,8 @@ mod imp {
 
 use adw::subclass::prelude::*;
 use gtk::glib;
-use sourceview5::prelude::*;
+use sourceview5::{StyleSchemeManager, prelude::*};
 
-use gtk::glib::GString;
 use gtk::glib::Object;
 use sourceview5::LanguageManager;
 
@@ -198,13 +197,22 @@ glib::wrapper! {
 impl Default for MarkdownBuffer {
     fn default() -> Self {
         let obj: Self = Object::builder().build();
-        let lm = Self::language_manager();
+        let lm = LanguageManager::default();
         obj.set_language(Some(&lm.language("markdown").unwrap()));
         obj
     }
 }
 
 impl MarkdownBuffer {
+    pub fn with_style_scheme(self, scheme_id: &str) -> Self {
+        if let Some(style_scheme) = StyleSchemeManager::default().scheme(scheme_id) {
+            self.set_style_scheme(Some(&style_scheme));
+        } else {
+            println!("MarkdownBuffer: Failed to load scheme with id '{scheme_id}'.")
+        }
+        self
+    }
+
     pub fn stats(&self) -> DocumentStats {
         let num_lines = self.line_count();
         let num_chars = self.char_count();
@@ -265,27 +273,6 @@ impl MarkdownBuffer {
     pub fn format_code(&self) {
         formatting::format_code(self);
     }
-
-    fn language_manager() -> LanguageManager {
-        let lm = LanguageManager::default();
-        let mut search_path = lm.search_path();
-
-        #[cfg(feature = "installed")]
-        {
-            let lang_spec_dir = &format!("{PKGDATADIR}/language_specs");
-            search_path.insert(0, lang_spec_dir.into());
-        }
-        #[cfg(not(feature = "installed"))]
-        {
-            const MANIFEST_DIR: &str = env!("CARGO_MANIFEST_DIR");
-            let lang_spec_dir = format!("{MANIFEST_DIR}/data/language_specs");
-            search_path.insert(0, lang_spec_dir.into());
-        }
-
-        let dirs: Vec<&str> = search_path.iter().map(GString::as_str).collect();
-        lm.set_search_path(&dirs);
-        lm
-    }
 }
 
 /*
diff --git a/src/data/project.rs b/src/data/project.rs
index 83b9f40..ad65048 100644
--- a/src/data/project.rs
+++ b/src/data/project.rs
@@ -247,6 +247,9 @@ mod imp {
                 .expect("Tried to add a document, but couldn't find its parent.");
             parent.add_document(doc.clone());
 
+            drop(documents);
+            drop(folders);
+
             self.obj().emit_by_name::<()>("document-added", &[&doc]);
         }
 
@@ -267,6 +270,8 @@ mod imp {
                 parent.add_subfolder(folder.clone());
             }
 
+            drop(folders);
+
             self.obj().emit_by_name::<()>("folder-added", &[&folder]);
 
             /*
diff --git a/src/data/sort.rs b/src/data/sort.rs
index 641f57f..c969e1b 100644
--- a/src/data/sort.rs
+++ b/src/data/sort.rs
@@ -56,12 +56,11 @@ mod imp {
 
             loop {
                 let Some(item_a) = sort_cache.get(path_a) else {
-                    unreachable!();
-                    // if self.sort_cache.borrow().get(path_b).is_none() {
-                    //     return gtk::Ordering::Equal;
-                    // } else {
-                    //     return gtk::Ordering::Smaller;
-                    // }
+                    if sort_cache.get(path_b).is_none() {
+                        return gtk::Ordering::Equal;
+                    } else {
+                        return gtk::Ordering::Smaller;
+                    }
                 };
                 let Some(item_b) = sort_cache.get(path_b) else {
                     unreachable!();
@@ -87,8 +86,7 @@ mod imp {
                     }
                 };
                 let Some(next_b) = iter_b.next() else {
-                    unreachable!();
-                    // return gtk::Ordering::Larger;
+                    return gtk::Ordering::Larger;
                 };
                 path_a = *next_a;
                 path_b = *next_b;
@@ -165,6 +163,15 @@ impl TryFrom<&str> for SortMethod {
     }
 }
 
+impl SortMethod {
+    pub fn is_ascending(&self) -> bool {
+        match self {
+            SortMethod::AlphanumericAsc | SortMethod::ModifiedAsc => true,
+            SortMethod::AlphanumericDesc | SortMethod::ModifiedDesc => false,
+        }
+    }
+}
+
 glib::wrapper! {
     pub struct ProjectSorter(ObjectSubclass<imp::ProjectSorter>);
 }
@@ -188,6 +195,10 @@ impl ProjectSorter {
         self.imp().sort_cache.borrow_mut().remove(path);
     }
 
+    pub fn clear(&self) {
+        self.imp().sort_cache.borrow_mut().clear();
+    }
+
     pub fn sort(&self, a: PathBuf, b: PathBuf) -> gtk::Ordering {
         self.imp().sort(a, b)
     }
diff --git a/src/main.rs b/src/main.rs
index 93702b0..9d523a7 100644
--- a/src/main.rs
+++ b/src/main.rs
@@ -7,6 +7,11 @@ mod widgets;
 use gtk::glib;
 use gtk::prelude::*;
 
+use gtk::glib::GString;
+use sourceview5::LanguageManager;
+use sourceview5::StyleSchemeManager;
+
+use config::PKGDATADIR;
 use util::file_actions;
 use widgets::Window;
 
@@ -40,6 +45,9 @@ fn main() -> glib::ExitCode {
     setup_accels(&app);
 
     app.connect_activate(|app| {
+        setup_buffer_styles();
+        setup_language_manager();
+
         let window = Window::new(app);
         window.set_title(Some("Scratchmark"));
         window.present();
@@ -76,6 +84,40 @@ fn setup_accels(app: &adw::Application) {
     app.set_accels_for_action("win.preferences", &["<ctrl>comma"]);
 }
 
+fn setup_buffer_styles() {
+    StyleSchemeManager::default().append_search_path(&format!("{PKGDATADIR}/editor_schemes"));
+    StyleSchemeManager::default().append_search_path(&format!("{PKGDATADIR}/document_preview"));
+
+    #[cfg(not(feature = "installed"))]
+    {
+        const MANIFEST_DIR: &str = env!("CARGO_MANIFEST_DIR");
+        StyleSchemeManager::default()
+            .append_search_path(format!("{MANIFEST_DIR}/data/editor_schemes").as_str());
+        StyleSchemeManager::default()
+            .append_search_path(format!("{MANIFEST_DIR}/data/document_preview").as_str());
+    }
+}
+
+fn setup_language_manager() {
+    let lm = LanguageManager::default();
+    let mut search_path = lm.search_path();
+
+    #[cfg(feature = "installed")]
+    {
+        let lang_spec_dir = &format!("{PKGDATADIR}/language_specs");
+        search_path.insert(0, lang_spec_dir.into());
+    }
+    #[cfg(not(feature = "installed"))]
+    {
+        const MANIFEST_DIR: &str = env!("CARGO_MANIFEST_DIR");
+        let lang_spec_dir = format!("{MANIFEST_DIR}/data/language_specs");
+        search_path.insert(0, lang_spec_dir.into());
+    }
+
+    let dirs: Vec<&str> = search_path.iter().map(GString::as_str).collect();
+    lm.set_search_path(&dirs);
+}
+
 #[cfg(test)]
 mod tests {
     use crate::config;
diff --git a/src/widgets/editor/mod.rs b/src/widgets/editor/mod.rs
index a192676..eb59567 100644
--- a/src/widgets/editor/mod.rs
+++ b/src/widgets/editor/mod.rs
@@ -446,9 +446,7 @@ use gtk::gio::FileCreateFlags;
 use gtk::glib::Object;
 use sourceview5::SearchContext;
 use sourceview5::SearchSettings;
-use sourceview5::StyleSchemeManager;
 
-use crate::config::PKGDATADIR;
 use crate::data::DocumentStats;
 use crate::data::MarkdownBuffer;
 use crate::error::ScratchmarkError;
@@ -466,7 +464,7 @@ impl Editor {
     pub fn new(path: PathBuf, max_width_px: i32) -> Result<Self, ScratchmarkError> {
         let file = gtk::gio::File::for_path(&path);
         let text = file_actions::read_file_to_string(&file)?;
-        let buffer = MarkdownBuffer::default();
+        let buffer = MarkdownBuffer::default().with_style_scheme("scratchmark");
         buffer.set_text(&text);
 
         let search_settings = SearchSettings::default();
@@ -476,7 +474,6 @@ impl Editor {
         let obj: Self = Object::builder().build();
         let imp = obj.imp();
         imp.buffer.set(buffer.clone()).unwrap();
-        Self::load_buffer_style_scheme(&buffer);
         imp.file.replace(Some(file));
         imp.path.replace(Some(path));
         imp.source_view.set_monospace(true);
@@ -587,32 +584,6 @@ impl Editor {
         self.emit_by_name::<()>("stats-changed", &[]);
     }
 
-    fn load_buffer_style_scheme(buffer: &MarkdownBuffer) {
-        let scheme_id = "scratchmark";
-
-        // Try fetching the scheme
-        if let Some(style_scheme) = StyleSchemeManager::default().scheme(scheme_id) {
-            buffer.set_style_scheme(Some(&style_scheme));
-            return;
-        }
-
-        // Fetch failed, add paths and try again
-        StyleSchemeManager::default().append_search_path(&format!("{PKGDATADIR}/editor_schemes"));
-        #[cfg(not(feature = "installed"))]
-        {
-            const MANIFEST_DIR: &str = env!("CARGO_MANIFEST_DIR");
-            StyleSchemeManager::default()
-                .append_search_path(format!("{MANIFEST_DIR}/data/editor_schemes").as_str());
-        }
-
-        if let Some(style_scheme) = StyleSchemeManager::default().scheme(scheme_id) {
-            buffer.set_style_scheme(Some(&style_scheme));
-            return;
-        }
-
-        println!("Failed to load scheme with id '{scheme_id}'.")
-    }
-
     fn on_buffer_changed(&self, buffer: &MarkdownBuffer) {
         self.refresh_document_stats(buffer);
         self.set_unsaved_changes(true);
diff --git a/src/widgets/library/document_preview_row.rs b/src/widgets/library/document_preview_row.rs
new file mode 100644
index 0000000..2b48c76
--- /dev/null
+++ b/src/widgets/library/document_preview_row.rs
@@ -0,0 +1,377 @@
+mod imp {
+    use std::cell::RefCell;
+    use std::path::PathBuf;
+    use std::sync::OnceLock;
+
+    use adw::subclass::prelude::*;
+    use glib::clone;
+    use glib::closure_local;
+    use gtk::gdk;
+    use gtk::gio;
+    use gtk::glib;
+    use gtk::glib::subclass::*;
+    use gtk::prelude::*;
+
+    use gtk::Builder;
+    use gtk::CompositeTemplate;
+    use gtk::DragSource;
+    use gtk::DropTarget;
+    use gtk::FileLauncher;
+    use gtk::Label;
+    use gtk::ListBoxRow;
+    use gtk::PopoverMenu;
+    use gtk::TemplateChild;
+    use gtk::gdk::DragAction;
+    use gtk::gdk::Rectangle;
+    use gtk::gio::MenuModel;
+    use gtk::gio::SimpleActionGroup;
+    use gtk::glib::Binding;
+    use sourceview5::View;
+
+    use crate::data::Document;
+    use crate::data::MarkdownBuffer;
+    use crate::widgets::library::folder_row::FolderRow;
+    use crate::widgets::library::item_rename_popover::ItemRenamePopover;
+
+    #[derive(CompositeTemplate, Default)]
+    #[template(resource = "/org/scratchmark/Scratchmark/ui/library/document_preview_row.ui")]
+    pub struct DocumentPreviewRow {
+        #[template_child]
+        pub(super) document_name_label: TemplateChild<Label>,
+        #[template_child]
+        pub(super) view: TemplateChild<View>,
+
+        pub(super) document: OnceLock<Document>,
+        pub(super) bindings: RefCell<Vec<Binding>>,
+
+        pub(super) drag_source: RefCell<Option<DragSource>>,
+    }
+
+    #[glib::object_subclass]
+    impl ObjectSubclass for DocumentPreviewRow {
+        const NAME: &'static str = "DocumentPreviewRow";
+        type Type = super::DocumentPreviewRow;
+        type ParentType = ListBoxRow;
+
+        fn class_init(klass: &mut Self::Class) {
+            klass.bind_template();
+        }
+
+        fn instance_init(obj: &glib::subclass::InitializingObject<Self>) {
+            obj.init_template();
+        }
+    }
+
+    impl ObjectImpl for DocumentPreviewRow {
+        fn signals() -> &'static [Signal] {
+            static SIGNALS: OnceLock<Vec<Signal>> = OnceLock::new();
+            SIGNALS.get_or_init(|| vec![Signal::builder("needs-attention").build()])
+        }
+
+        fn constructed(&self) {
+            self.setup_context_menu();
+            self.setup_drag();
+            self.setup_drop();
+            self.setup_actions();
+
+            self.view.set_buffer(Some(
+                &MarkdownBuffer::default().with_style_scheme("preview-style"),
+            ));
+
+            self.parent_constructed();
+        }
+    }
+
+    impl WidgetImpl for DocumentPreviewRow {}
+    impl ListBoxRowImpl for DocumentPreviewRow {}
+
+    impl DocumentPreviewRow {
+        pub(super) fn document(&self) -> &Document {
+            self.document.get().unwrap()
+        }
+
+        pub(super) fn prompt_rename(&self) {
+            let obj = self.obj();
+            obj.emit_by_name::<()>("needs-attention", &[]);
+
+            let popover = ItemRenamePopover::for_document();
+            popover.set_parent(&*obj);
+            popover.set_path(self.document.get().unwrap().path());
+            popover.connect_closure(
+                "committed",
+                false,
+                closure_local!(
+                    #[weak(rename_to = imp)]
+                    self,
+                    move |_popover: ItemRenamePopover, path: PathBuf| {
+                        if let Err(e) = imp.document().rename(path) {
+                            imp.document().notify(&e.to_string())
+                        }
+                    }
+                ),
+            );
+            popover.connect_closed(move |popover| {
+                popover.unparent();
+            });
+        }
+
+        pub(super) fn bind(&self, document: &Document) {
+            self.document.set(document.clone()).unwrap();
+
+            // let open_in_editor_indicator: &Label = self.open_in_editor_indicator.as_ref();
+            // document
+            //     .bind_property("is_open_in_editor", open_in_editor_indicator, "visible")
+            //     .sync_create()
+            //     .build();
+
+            if let Some(preview) = document.preview() {
+                self.set_text(&preview);
+            } else {
+                document.refresh_preview();
+            }
+
+            document.connect_preview_notify(clone!(
+                #[weak(rename_to = imp)]
+                self,
+                move |doc| {
+                    let preview = doc.preview().unwrap_or_default();
+                    imp.set_text(&preview);
+                }
+            ));
+
+            let title_label = self.document_name_label.get();
+            let mut bindings = self.bindings.borrow_mut();
+
+            let title_binding = document
+                .bind_property("stem", &title_label, "label")
+                .sync_create()
+                .build();
+            bindings.push(title_binding);
+        }
+
+        fn setup_context_menu(&self) {
+            let obj = self.obj();
+
+            let gesture = gtk::GestureClick::new();
+            gesture.set_button(gdk::ffi::GDK_BUTTON_SECONDARY as u32);
+            gesture.connect_released(clone!(
+                #[weak(rename_to = imp)]
+                self,
+                move |gesture, _n, x, y| {
+                    gesture.set_state(gtk::EventSequenceState::Claimed);
+                    imp.show_context_menu(x as i32, y as i32);
+                }
+            ));
+            obj.add_controller(gesture);
+        }
+
+        fn setup_drag(&self) {
+            let obj = self.obj();
+
+            let drag_source = DragSource::new();
+            drag_source.set_actions(DragAction::MOVE);
+            drag_source.set_content(Some(&gdk::ContentProvider::for_value(&obj.to_value())));
+
+            obj.add_controller(drag_source.clone());
+            let _ = self.drag_source.replace(Some(drag_source));
+        }
+
+        pub fn setup_drop(&self) {
+            let obj = self.obj();
+
+            let drop_target = DropTarget::new(glib::types::Type::INVALID, DragAction::MOVE);
+            drop_target.set_types(&[
+                super::DocumentPreviewRow::static_type(),
+                FolderRow::static_type(),
+            ]);
+            drop_target.connect_drop(clone!(
+                #[weak]
+                obj,
+                #[upgrade_or]
+                false,
+                move |_: &DropTarget, value: &glib::Value, _: f64, _: f64| {
+                    if let Ok(doc) = value.get::<super::DocumentPreviewRow>() {
+                        let old_path = doc.path();
+                        let filename = old_path.file_name().unwrap();
+                        let target_path = obj.document().path().parent().unwrap().to_path_buf();
+                        let new_path = target_path.join(filename);
+                        if new_path == old_path {
+                            return true;
+                        }
+                        doc.rename(new_path);
+                        return true;
+                    } else if let Ok(other) = value.get::<FolderRow>() {
+                        // Under no circumstance accept the library root folder
+                        if other.folder().is_root() {
+                            return true;
+                        }
+                        let old_path = other.folder().path();
+                        let filename = old_path.file_name().unwrap();
+                        let target_path = obj.document().path().parent().unwrap().to_path_buf();
+                        if target_path.starts_with(&old_path) {
+                            return true;
+                        }
+                        let new_path = target_path.join(filename);
+                        if new_path == old_path {
+                            return true;
+                        }
+                        other.rename(new_path);
+                        return true;
+                    }
+                    false
+                }
+            ));
+
+            obj.add_controller(drop_target);
+        }
+
+        fn setup_actions(&self) {
+            let obj = self.obj();
+            let actions = SimpleActionGroup::new();
+            obj.insert_action_group("document", Some(&actions));
+
+            let action = gio::SimpleAction::new("filemanager", None);
+
+            action.connect_activate(clone!(
+                #[weak]
+                obj,
+                move |_action, _parameter| {
+                    let file = gio::File::for_path(obj.path());
+                    FileLauncher::new(Some(&file)).open_containing_folder(
+                        None::<&adw::ApplicationWindow>,
+                        None::<&gio::Cancellable>,
+                        |_| {},
+                    );
+                }
+            ));
+            actions.add_action(&action);
+
+            let action = gio::SimpleAction::new("rename-begin", None);
+            action.connect_activate(clone!(
+                #[weak]
+                obj,
+                move |_action, _parameter| obj.prompt_rename()
+            ));
+            actions.add_action(&action);
+
+            let action = gio::SimpleAction::new("duplicate", None);
+            action.connect_activate(clone!(
+                #[weak(rename_to = imp)]
+                self,
+                move |_action, _parameter| {
+                    imp.document().duplicate();
+                }
+            ));
+            actions.add_action(&action);
+
+            let action = gio::SimpleAction::new("trash", None);
+            action.connect_activate(clone!(
+                #[weak(rename_to = imp)]
+                self,
+                move |_action, _parameter| {
+                    imp.document().trash();
+                }
+            ));
+            actions.add_action(&action);
+
+            let action = gio::SimpleAction::new("delete", None);
+            action.connect_activate(clone!(
+                #[weak(rename_to = imp)]
+                self,
+                move |_action, _parameter| {
+                    imp.document().delete();
+                }
+            ));
+            actions.add_action(&action);
+        }
+
+        fn show_context_menu(&self, x: i32, y: i32) {
+            let obj = self.obj();
+
+            let builder = Builder::from_resource(
+                "/org/scratchmark/Scratchmark/ui/library/document_context_menu.ui",
+            );
+            let model = builder.object::<MenuModel>("context-menu").unwrap();
+            let popover = PopoverMenu::builder()
+                .menu_model(&model)
+                .has_arrow(false)
+                .build();
+
+            popover.set_halign(gtk::Align::Start);
+
+            popover.connect_closed(move |popover| {
+                popover.unparent();
+            });
+
+            popover.set_parent(&*obj);
+            popover.set_pointing_to(Some(&Rectangle::new(x, y, 1, 1)));
+            popover.popup();
+        }
+
+        fn set_text(&self, text: &str) {
+            let buffer = self.view.buffer();
+            buffer.set_text(text);
+
+            // truncate to 3 rows
+            let mut iter = buffer.start_iter();
+            for _ in 0..3 {
+                iter.forward_visible_line();
+            }
+            if !iter.is_end() {
+                buffer.delete(&mut iter, &mut buffer.end_iter());
+            }
+        }
+    }
+}
+
+use std::path::PathBuf;
+
+use adw::subclass::prelude::*;
+use gtk::ListBoxRow;
+use gtk::glib;
+use gtk::prelude::*;
+
+use glib::Object;
+
+use crate::data::Document;
+
+glib::wrapper! {
+pub struct DocumentPreviewRow(ObjectSubclass<imp::DocumentPreviewRow>)
+    @extends ListBoxRow, gtk::Widget,
+    @implements gtk::Accessible, gtk::Actionable, gtk::Buildable, gtk::ConstraintTarget;
+}
+
+impl DocumentPreviewRow {
+    pub fn new(data: &Document) -> Self {
+        let obj: Self = Object::builder().build();
+        let imp = obj.imp();
+        imp.bind(data);
+        obj
+    }
+
+    pub fn document(&self) -> &Document {
+        self.imp().document()
+    }
+
+    pub fn path(&self) -> PathBuf {
+        self.document().path()
+    }
+
+    pub fn stem(&self) -> String {
+        self.document().stem()
+    }
+
+    pub fn on_click(&self) {
+        self.document().open();
+    }
+
+    pub fn prompt_rename(&self) {
+        self.imp().prompt_rename();
+    }
+
+    pub fn rename(&self, path: PathBuf) {
+        if let Err(e) = self.document().rename(path) {
+            self.document().notify(&e.to_string())
+        }
+    }
+}
diff --git a/src/widgets/library/folder_row.rs b/src/widgets/library/folder_row.rs
index d09919c..012b61f 100644
--- a/src/widgets/library/folder_row.rs
+++ b/src/widgets/library/folder_row.rs
@@ -50,7 +50,9 @@ mod imp {
         pub(super) folder: OnceLock<Folder>,
         pub(super) bindings: RefCell<Vec<Binding>>,
         #[property(get, set)]
-        pub(super) is_expanded: Cell<bool>,
+        is_expanded: Cell<bool>,
+        #[property(get, set)]
+        two_column_sidebar: Cell<bool>,
 
         pub(super) context_menu_popover: OnceLock<PopoverMenu>,
         pub(super) document_create_popover: OnceLock<DocumentCreatePopover>,
@@ -79,9 +81,8 @@ mod imp {
         fn constructed(&self) {
             let obj = self.obj();
 
-            obj.connect_notify(Some("is-expanded"), move |obj, _| {
-                obj.imp().on_expanded_changed();
-            });
+            obj.connect_is_expanded_notify(move |obj| obj.imp().refresh_icons());
+            obj.connect_two_column_sidebar_notify(move |obj| obj.imp().refresh_icons());
 
             self.parent_constructed();
         }
@@ -106,16 +107,23 @@ mod imp {
             self.folder.get().unwrap()
         }
 
-        fn on_expanded_changed(&self) {
-            if self.is_expanded.get() {
+        fn refresh_icons(&self) {
+            let obj = self.obj();
+            let is_empty = self.folder().subfolders().is_empty() && obj.two_column_sidebar();
+            let is_expanded = self.is_expanded.get();
+
+            self.expand_icon.set_visible(!is_empty);
+            if is_expanded {
                 self.expand_icon.set_icon_name("down-small-symbolic".into());
-                if !self.folder().is_root() {
-                    self.folder_icon.set_icon_name(Some("folder-open-symbolic"));
-                }
             } else {
                 self.expand_icon
                     .set_icon_name("right-small-symbolic".into());
-                if !self.folder().is_root() {
+            }
+
+            if !self.folder().is_root() {
+                if is_expanded && !is_empty {
+                    self.folder_icon.set_icon_name(Some("folder-open-symbolic"));
+                } else {
                     self.folder_icon.set_icon_name(Some("folder-symbolic"));
                 }
             }
@@ -391,6 +399,17 @@ mod imp {
                 .sync_create()
                 .build();
             bindings.push(title_binding);
+
+            folder.connect_closure(
+                "contents-changed",
+                true,
+                closure_local!(
+                    #[weak(rename_to = imp)]
+                    self,
+                    move |_: Folder| { imp.refresh_icons() }
+                ),
+            );
+            self.refresh_icons();
         }
     }
 }
diff --git a/src/widgets/library/folder_view.rs b/src/widgets/library/folder_view.rs
new file mode 100644
index 0000000..2575fea
--- /dev/null
+++ b/src/widgets/library/folder_view.rs
@@ -0,0 +1,234 @@
+mod imp {
+    use std::cell::RefCell;
+    use std::collections::HashMap;
+    use std::path::Path;
+    use std::path::PathBuf;
+
+    use adw::prelude::*;
+    use adw::subclass::prelude::*;
+    use gtk::Label;
+    use gtk::ListBoxRow;
+    use gtk::glib;
+    use gtk::glib::clone;
+
+    use adw::NavigationPage;
+    use gtk::CompositeTemplate;
+    use gtk::ListBox;
+    use gtk::MenuButton;
+    use gtk::gio::SimpleAction;
+    use gtk::gio::SimpleActionGroup;
+    use gtk::glib::Properties;
+    use gtk::glib::VariantTy;
+
+    use crate::data::Document;
+    use crate::data::Folder;
+    use crate::data::SortMethod;
+    use crate::widgets::library::document_preview_row::DocumentPreviewRow;
+
+    #[derive(CompositeTemplate, Default, Properties)]
+    #[properties(wrapper_type = super::FolderView)]
+    #[template(resource = "/org/scratchmark/Scratchmark/ui/library/folder_view.ui")]
+    pub struct FolderView {
+        #[template_child]
+        listbox: TemplateChild<ListBox>,
+        #[template_child]
+        empty_placeholder: TemplateChild<Label>,
+        #[template_child]
+        sort_button: TemplateChild<MenuButton>,
+        rows: RefCell<HashMap<PathBuf, DocumentPreviewRow>>,
+        // pub(super) project: OnceLock<Project>,
+
+        //  #[property(nullable, get, set)]
+        //  open_document_path: RefCell<Option<PathBuf>>,
+        //  #[property(nullable, get, set)]
+        //  selected_item_path: RefCell<Option<PathBuf>>,
+        //   previous_open_document: RefCell<Option<Document>>,
+
+        // Props are bound one-way, from library to here.
+        #[property(nullable, get, set)]
+        open_document: RefCell<Option<PathBuf>>,
+        #[property(nullable, get, set)]
+        folder: RefCell<Option<Folder>>,
+        #[property(get, set)]
+        sort_method: RefCell<String>,
+    }
+
+    #[glib::object_subclass]
+    impl ObjectSubclass for FolderView {
+        const NAME: &'static str = "FolderView";
+        type Type = super::FolderView;
+        type ParentType = NavigationPage;
+
+        fn class_init(klass: &mut Self::Class) {
+            klass.bind_template();
+        }
+
+        fn instance_init(obj: &glib::subclass::InitializingObject<Self>) {
+            obj.init_template();
+        }
+    }
+
+    #[glib::derived_properties]
+    impl ObjectImpl for FolderView {
+        fn constructed(&self) {
+            let obj = self.obj();
+
+            obj.connect_open_document_notify(move |obj| obj.imp().on_document_changed());
+            obj.connect_folder_notify(move |obj| obj.imp().on_folder_changed());
+            obj.connect_sort_method_notify(move |obj| obj.imp().on_sort_method_changed());
+
+            self.listbox.connect_row_activated(move |_, row| {
+                row.clone()
+                    .downcast::<DocumentPreviewRow>()
+                    .unwrap()
+                    .on_click()
+            });
+
+            let actions = SimpleActionGroup::new();
+            obj.insert_action_group("folder-view", Some(&actions));
+            let action = SimpleAction::new_stateful(
+                "sort-method",
+                Some(VariantTy::STRING),
+                &SortMethod::default().to_string().to_variant(),
+            );
+            action.connect_activate(clone!(
+                #[weak]
+                obj,
+                move |action, param| {
+                    let param = param.unwrap();
+                    action.set_state(param);
+                    obj.set_sort_method(param.get::<String>().unwrap());
+                }
+            ));
+            actions.add_action(&action);
+
+            self.parent_constructed();
+        }
+    }
+
+    impl WidgetImpl for FolderView {}
+    impl NavigationPageImpl for FolderView {}
+
+    impl FolderView {
+        fn on_document_changed(&self) {
+            let obj = self.obj();
+            let rows = self.rows.borrow();
+            if let Some(path) = obj.open_document()
+                && let Some(row) = rows.get(&path)
+            {
+                self.listbox.select_row(Some(row));
+            } else {
+                self.listbox.unselect_all();
+            }
+        }
+
+        fn on_folder_changed(&self) {
+            let obj = self.obj();
+            self.clear();
+            if let Some(folder) = self.folder.borrow().as_ref() {
+                for doc in folder.documents().values() {
+                    self.add_document(doc);
+                }
+                obj.set_title(&folder.name());
+            } else {
+                obj.set_title("");
+            }
+            self.refresh_empty_placeholder();
+        }
+
+        fn clear(&self) {
+            self.rows.borrow_mut().clear();
+            self.listbox.remove_all();
+            self.refresh_empty_placeholder();
+        }
+
+        fn on_sort_method_changed(&self) {
+            let obj = self.obj();
+            let sort_method_str = obj.sort_method();
+            let sort_method = SortMethod::try_from(sort_method_str.as_str()).unwrap();
+
+            self.listbox.invalidate_sort();
+            if sort_method.is_ascending() {
+                self.sort_button.set_icon_name("library-sort-asc-symbolic");
+            } else {
+                self.sort_button.set_icon_name("library-sort-desc-symbolic");
+            }
+
+            fn to_doc(row: &ListBoxRow) -> Document {
+                row.clone()
+                    .downcast::<DocumentPreviewRow>()
+                    .unwrap()
+                    .document()
+                    .clone()
+            }
+
+            fn sort_alphanumeric_asc(a: &ListBoxRow, b: &ListBoxRow) -> gtk::Ordering {
+                to_doc(a)
+                    .collation_key()
+                    .cmp(to_doc(b).collation_key())
+                    .into()
+            }
+            fn sort_alphanumeric_desc(a: &ListBoxRow, b: &ListBoxRow) -> gtk::Ordering {
+                to_doc(b)
+                    .collation_key()
+                    .cmp(to_doc(a).collation_key())
+                    .into()
+            }
+            fn sort_modified_asc(a: &ListBoxRow, b: &ListBoxRow) -> gtk::Ordering {
+                to_doc(a).modified().cmp(&to_doc(b).modified()).into()
+            }
+            fn sort_modified_desc(a: &ListBoxRow, b: &ListBoxRow) -> gtk::Ordering {
+                to_doc(b).modified().cmp(&to_doc(a).modified()).into()
+            }
+
+            self.listbox.set_sort_func(match sort_method {
+                SortMethod::AlphanumericAsc => sort_alphanumeric_asc,
+                SortMethod::AlphanumericDesc => sort_alphanumeric_desc,
+                SortMethod::ModifiedAsc => sort_modified_asc,
+                SortMethod::ModifiedDesc => sort_modified_desc,
+            });
+        }
+
+        fn add_document(&self, document: &Document) {
+            let is_selected = self.obj().open_document() == Some(document.path());
+
+            let row = DocumentPreviewRow::new(document);
+            self.listbox.insert(&row, 0);
+            self.rows
+                .borrow_mut()
+                .insert(row.document().path(), row.clone());
+            if is_selected {
+                self.listbox.select_row(Some(&row));
+            }
+            self.refresh_empty_placeholder();
+        }
+
+        fn remove_document(&self, path: &Path) {
+            if let Some(row) = self.rows.borrow_mut().remove(path) {
+                self.listbox.remove(&row);
+            }
+            self.refresh_empty_placeholder();
+        }
+
+        fn refresh_empty_placeholder(&self) {
+            self.empty_placeholder
+                .set_visible(self.rows.borrow().is_empty());
+        }
+    }
+}
+
+use gtk::glib;
+
+use glib::Object;
+
+glib::wrapper! {
+    pub struct FolderView(ObjectSubclass<imp::FolderView>)
+        @extends adw::NavigationPage, gtk::Widget,
+        @implements gtk::Accessible, gtk::Buildable, gtk::ConstraintTarget;
+}
+
+impl FolderView {
+    pub fn new() -> Self {
+        Object::builder().build()
+    }
+}
diff --git a/src/widgets/library/library_view.rs b/src/widgets/library/library_view.rs
index 777bffb..c0d46af 100644
--- a/src/widgets/library/library_view.rs
+++ b/src/widgets/library/library_view.rs
@@ -41,6 +41,8 @@ mod imp {
         open_document_path: RefCell<Option<PathBuf>>,
         #[property(nullable, get, set)]
         selected_item_path: RefCell<Option<PathBuf>>,
+        #[property(nullable, get, set)]
+        selected_folder: RefCell<Option<Folder>>,
 
         pub(super) projects: RefCell<HashMap<PathBuf, ProjectView>>,
 
@@ -48,6 +50,8 @@ mod imp {
         ignore_hidden_files: Cell<bool>,
         #[property(get, set)]
         sort_method: RefCell<String>,
+        #[property(get, set)]
+        two_column_sidebar: Cell<bool>,
     }
 
     #[glib::object_subclass]
@@ -69,7 +73,13 @@ mod imp {
     impl ObjectImpl for LibraryView {
         fn constructed(&self) {
             let obj = self.obj();
-            self.parent_constructed();
+
+            obj.connect_selected_item_path_notify(move |obj| {
+                obj.imp().refresh_selected_folder();
+            });
+            obj.connect_two_column_sidebar_notify(move |obj| {
+                obj.imp().refresh_selected_folder();
+            });
 
             let actions = SimpleActionGroup::new();
             obj.insert_action_group("library", Some(&actions));
@@ -90,7 +100,8 @@ mod imp {
                                 if let Ok(file) = result
                                     && let Some(path) = file.path()
                                 {
-                                    obj.add_project(path);
+                                    obj.add_project(path.clone());
+                                    obj.set_selected_item_path(Some(path));
                                 }
                             }
                         ),
@@ -103,6 +114,7 @@ mod imp {
             let drafts_path = drafts.project().path();
             self.load_project(drafts);
             obj.set_selected_item_path(Some(drafts_path));
+            self.parent_constructed();
         }
 
         fn signals() -> &'static [Signal] {
@@ -137,37 +149,80 @@ mod imp {
 
     impl LibraryView {
         pub(super) fn folder_item(&self, path: &Path) -> Option<FolderRow> {
-            for project in self.projects.borrow().deref().values() {
-                if path.starts_with(project.project().path()) {
-                    return project.folder_item(path);
+            for project_view in self.projects.borrow().deref().values() {
+                if path.starts_with(project_view.project().path()) {
+                    return project_view.folder_item(path);
                 }
             }
             None
         }
 
         pub(super) fn document_item(&self, path: &Path) -> Option<DocumentRow> {
-            for project in self.projects.borrow().deref().values() {
-                if path.starts_with(project.project().path()) {
-                    return project.document_item(path);
+            for project_view in self.projects.borrow().deref().values() {
+                if path.starts_with(project_view.project().path()) {
+                    return project_view.document_item(path);
                 }
             }
             None
         }
 
+        pub(super) fn has_document(&self, path: &Path) -> bool {
+            for project_view in self.projects.borrow().deref().values() {
+                let project = project_view.project();
+                if path.starts_with(project.path()) {
+                    return project.has_document(path);
+                }
+            }
+            false
+        }
+
+        pub(super) fn has_folder(&self, path: &Path) -> bool {
+            for project_view in self.projects.borrow().deref().values() {
+                let project = project_view.project();
+                if path.starts_with(project.path()) {
+                    return project.has_folder(path);
+                }
+            }
+            false
+        }
+
         pub(super) fn refresh_content(&self) {
-            for project in self.projects.borrow().deref().values() {
-                project.refresh_content();
+            for project_view in self.projects.borrow().deref().values() {
+                project_view.project().refresh_content();
             }
         }
 
         pub(super) fn add_project(&self, path: PathBuf) {
-            for project in self.projects.borrow().deref().values() {
-                let compare = project.project().path();
+            for project_view in self.projects.borrow().deref().values() {
+                let compare = project_view.project().path();
                 if path.starts_with(&compare) || compare.starts_with(&path) {
                     return;
                 }
             }
-            self.load_project(ProjectView::new(&Project::new(path)).clone());
+            self.load_project(ProjectView::new(&Project::new(path)));
+        }
+
+        fn refresh_selected_folder(&self) {
+            let obj = self.obj();
+
+            let path = obj.selected_item_path().map(|path| {
+                if self.has_document(&path) {
+                    path.parent().unwrap().to_path_buf()
+                } else {
+                    path
+                }
+            });
+
+            let Some(folder_row) = path.and_then(|path| self.folder_item(&path)) else {
+                obj.set_selected_folder(None::<Folder>);
+                return;
+            };
+
+            let folder = folder_row.folder();
+
+            if obj.selected_folder().as_ref() != Some(folder) {
+                obj.set_selected_folder(Some(folder.clone()));
+            }
         }
 
         fn load_project(&self, project_view: ProjectView) {
@@ -231,9 +286,11 @@ mod imp {
             obj.bind_property("sort_method", &project_view, "sort_method")
                 .sync_create()
                 .build();
+            obj.bind_property("two_column_sidebar", &project_view, "two_column_sidebar")
+                .sync_create()
+                .build();
 
             project.refresh_content();
-            obj.set_selected_item_path(Some(project.path()));
         }
 
         fn connect_folder(&self, folder: &Folder) {
@@ -397,8 +454,9 @@ mod imp {
             obj.emit_by_name::<()>("path-removed", &[&path]);
             obj.emit_by_name::<()>("toast", &[&"Moved to trash"]);
 
-            for project in self.projects.borrow().deref().values() {
-                if path.starts_with(project.project().path()) {
+            for project_view in self.projects.borrow().deref().values() {
+                let project = project_view.project();
+                if path.starts_with(project.path()) {
                     project.refresh_content();
                     break;
                 }
@@ -417,8 +475,9 @@ mod imp {
             obj.emit_by_name::<()>("path-removed", &[&path]);
             obj.emit_by_name::<()>("toast", &[&"Moved to trash"]);
 
-            for project in self.projects.borrow().deref().values() {
-                if path.starts_with(project.project().path()) {
+            for project_view in self.projects.borrow().deref().values() {
+                let project = project_view.project();
+                if path.starts_with(project.path()) {
                     project.refresh_content();
                     break;
                 }
@@ -448,8 +507,9 @@ mod imp {
                             obj.emit_by_name::<()>("path-removed", &[&path]);
                             obj.emit_by_name::<()>("toast", &[&"Permanently deleted"]);
 
-                            for project in imp.projects.borrow().deref().values() {
-                                if path.starts_with(project.project().path()) {
+                            for project_view in imp.projects.borrow().deref().values() {
+                                let project = project_view.project();
+                                if path.starts_with(project.path()) {
                                     project.refresh_content();
                                     break;
                                 }
@@ -485,8 +545,9 @@ mod imp {
                             obj.emit_by_name::<()>("path-removed", &[&path]);
                             obj.emit_by_name::<()>("toast", &[&"Permanently deleted"]);
 
-                            for project in imp.projects.borrow().deref().values() {
-                                if path.starts_with(project.project().path()) {
+                            for project_view in imp.projects.borrow().deref().values() {
+                                let project = project_view.project();
+                                if path.starts_with(project.path()) {
                                     project.refresh_content();
                                     break;
                                 }
diff --git a/src/widgets/library/mod.rs b/src/widgets/library/mod.rs
index aaf68ca..bce5d2d 100644
--- a/src/widgets/library/mod.rs
+++ b/src/widgets/library/mod.rs
@@ -1,11 +1,15 @@
 mod delete_confirm_dialog;
 mod document_create_popover;
+mod document_preview_row;
 mod document_row;
 mod err_placeholder_row;
 mod folder_create_popover;
 mod folder_row;
+mod folder_view;
 mod item_rename_popover;
 mod library_view;
+mod project_list_box;
 mod project_view;
 
+pub use folder_view::FolderView;
 pub use library_view::LibraryView;
diff --git a/src/widgets/library/project_list_box.rs b/src/widgets/library/project_list_box.rs
new file mode 100644
index 0000000..b84f946
--- /dev/null
+++ b/src/widgets/library/project_list_box.rs
@@ -0,0 +1,212 @@
+mod imp {
+    use std::cell::RefCell;
+    use std::collections::HashMap;
+    use std::path::PathBuf;
+
+    use adw::prelude::BinExt;
+    use adw::subclass::prelude::*;
+    use gtk::ListBoxRow;
+    use gtk::glib;
+    use gtk::glib::clone;
+    use gtk::prelude::*;
+
+    use gtk::ListBox;
+    use gtk::glib::Properties;
+
+    use super::ProjectRow;
+    use crate::data::ProjectSorter;
+    use crate::data::SortMethod;
+    use crate::widgets::library::document_row::DocumentRow;
+    use crate::widgets::library::folder_row::FolderRow;
+
+    #[derive(Default, Properties)]
+    #[properties(wrapper_type = super::ProjectListBox)]
+    pub struct ProjectListBox {
+        pub(super) listbox: ListBox,
+        pub(super) rows: RefCell<HashMap<PathBuf, ProjectRow>>,
+        pub(super) sorter: ProjectSorter,
+
+        #[property(get, set)]
+        sort_method: RefCell<String>,
+    }
+
+    #[glib::object_subclass]
+    impl ObjectSubclass for ProjectListBox {
+        const NAME: &'static str = "ProjectListBox";
+        type Type = super::ProjectListBox;
+        type ParentType = adw::Bin;
+    }
+
+    #[glib::derived_properties]
+    impl ObjectImpl for ProjectListBox {
+        fn constructed(&self) {
+            let obj = self.obj();
+
+            obj.set_child(Some(&self.listbox));
+            self.listbox.set_focusable(false);
+            self.listbox.add_css_class("navigation-sidebar");
+
+            let sorter = self.sorter.clone();
+            obj.connect_sort_method_notify(move |obj| obj.imp().refresh_sort_method());
+
+            self.listbox.set_sort_func(clone!(
+                #[strong]
+                sorter,
+                move |a, b| {
+                    fn row_to_path(row: &ListBoxRow) -> Option<PathBuf> {
+                        if let Ok(row) = row.clone().downcast::<DocumentRow>() {
+                            Some(row.document().path())
+                        } else if let Ok(row) = row.clone().downcast::<FolderRow>() {
+                            Some(row.folder().path())
+                        } else {
+                            None
+                        }
+                    }
+                    sorter.sort(row_to_path(a).unwrap(), row_to_path(b).unwrap())
+                }
+            ));
+
+            self.listbox.connect_row_activated(move |_vbox, row| {
+                if let Ok(folder_item) = row.clone().downcast::<FolderRow>() {
+                    folder_item.on_click();
+                } else if let Ok(document_item) = row.clone().downcast::<DocumentRow>() {
+                    document_item.on_click();
+                };
+            });
+
+            /*
+            obj.connect_selected_rows_changed(clone!(
+                #[weak(rename_to = imp)]
+                self,
+                move |_| {
+                    imp.refresh_listbox_selection();
+                }
+            ));
+            */
+
+            self.parent_constructed();
+        }
+    }
+
+    impl WidgetImpl for ProjectListBox {}
+    impl BinImpl for ProjectListBox {}
+
+    impl ProjectListBox {
+        fn refresh_sort_method(&self) {
+            let sort_method_str = self.obj().sort_method();
+            if let Ok(sort_method) = SortMethod::try_from(sort_method_str.as_str()) {
+                self.sorter.set_sort_method(sort_method);
+                self.listbox.invalidate_sort();
+            };
+        }
+    }
+}
+
+use std::cell::Ref;
+use std::collections::HashMap;
+use std::path::Path;
+use std::path::PathBuf;
+
+use adw::prelude::*;
+use adw::subclass::prelude::*;
+use gtk::glib;
+
+use glib::Object;
+use gtk::ListBoxRow;
+
+use crate::data::ProjectItem;
+use crate::widgets::library::document_row::DocumentRow;
+use crate::widgets::library::folder_row::FolderRow;
+
+glib::wrapper! {
+    pub struct ProjectListBox(ObjectSubclass<imp::ProjectListBox>)
+        @extends adw::Bin, gtk::Widget,
+        @implements gtk::Accessible, gtk::Buildable, gtk::ConstraintTarget;
+}
+
+impl Default for ProjectListBox {
+    fn default() -> Self {
+        Object::builder().build()
+    }
+}
+
+impl ProjectListBox {
+    pub fn get(&self, path: &Path) -> Option<ProjectRow> {
+        self.imp().rows.borrow().get(path).cloned()
+    }
+
+    pub fn has(&self, path: &Path) -> bool {
+        self.imp().rows.borrow().contains_key(path)
+    }
+
+    pub fn rows(&self) -> Ref<'_, HashMap<PathBuf, ProjectRow>> {
+        self.imp().rows.borrow()
+    }
+
+    pub fn insert(&self, row: ProjectRow) {
+        self.imp().sorter.insert(match &row {
+            ProjectRow::Doc(row) => ProjectItem::Doc(row.document().clone()),
+            ProjectRow::Dir(row) => ProjectItem::Dir(row.folder().clone()),
+        });
+        self.imp().listbox.insert(&row.to_list_box_row(), 0);
+        self.imp().rows.borrow_mut().insert(row.path(), row);
+    }
+
+    pub fn remove(&self, path: &Path) -> Option<ProjectRow> {
+        let opt = self.imp().rows.borrow_mut().remove(path);
+        if let Some(row) = &opt {
+            self.imp().listbox.remove(&row.to_list_box_row());
+            self.imp().sorter.remove(path);
+        }
+        opt
+    }
+
+    pub fn clear(&self) {
+        self.imp().listbox.remove_all();
+        self.imp().rows.borrow_mut().clear();
+        self.imp().sorter.clear();
+    }
+
+    pub fn select_row(&self, path: &Path) {
+        self.imp()
+            .listbox
+            .select_row(self.get(path).map(|v| v.to_list_box_row()).as_ref());
+    }
+
+    pub fn unselect_all(&self) {
+        self.imp().listbox.unselect_all();
+    }
+
+    pub fn invalidate_sort(&self) {
+        self.imp().listbox.invalidate_sort();
+    }
+}
+
+#[derive(Debug, Clone)]
+pub enum ProjectRow {
+    Doc(DocumentRow),
+    Dir(FolderRow),
+}
+
+impl ProjectRow {
+    pub fn is_selected(&self) -> bool {
+        match self {
+            ProjectRow::Doc(document_row) => document_row.is_selected(),
+            ProjectRow::Dir(folder_row) => folder_row.is_selected(),
+        }
+    }
+
+    pub fn path(&self) -> PathBuf {
+        match self {
+            ProjectRow::Doc(document_row) => document_row.document().path(),
+            ProjectRow::Dir(folder_row) => folder_row.folder().path(),
+        }
+    }
+
+    pub fn to_list_box_row(&self) -> ListBoxRow {
+        match self {
+            ProjectRow::Doc(document_row) => document_row.clone().upcast(),
+            ProjectRow::Dir(folder_row) => folder_row.clone().upcast(),
+        }
+    }
+}
diff --git a/src/widgets/library/project_view.rs b/src/widgets/library/project_view.rs
index e2a3f59..cc8c2e0 100644
--- a/src/widgets/library/project_view.rs
+++ b/src/widgets/library/project_view.rs
@@ -1,74 +1,48 @@
-#[derive(Debug, Clone)]
-pub enum ProjectRow {
-    Doc(DocumentRow),
-    Dir(FolderRow),
-}
-
-impl ProjectRow {
-    pub fn is_selected(&self) -> bool {
-        match self {
-            ProjectRow::Doc(document_row) => document_row.is_selected(),
-            ProjectRow::Dir(folder_row) => folder_row.is_selected(),
-        }
-    }
-
-    pub fn to_list_box_row(&self) -> ListBoxRow {
-        match self {
-            ProjectRow::Doc(document_row) => document_row.clone().upcast(),
-            ProjectRow::Dir(folder_row) => folder_row.clone().upcast(),
-        }
-    }
-}
-
 mod imp {
+    use std::cell::Cell;
     use std::cell::RefCell;
-    use std::collections::HashMap;
     use std::collections::HashSet;
     use std::path::Path;
     use std::path::PathBuf;
     use std::sync::OnceLock;
 
+    use adw::prelude::BinExt;
     use adw::subclass::prelude::*;
-    use gtk::ListBoxRow;
     use gtk::glib;
     use gtk::glib::clone;
     use gtk::glib::closure_local;
     use gtk::glib::subclass::*;
     use gtk::prelude::*;
 
-    use gtk::CompositeTemplate;
-    use gtk::ListBox;
     use gtk::glib::Properties;
 
     use crate::data::Document;
     use crate::data::Folder;
     use crate::data::Project;
     use crate::data::ProjectItem;
-    use crate::data::ProjectSorter;
-    use crate::data::SortMethod;
     use crate::widgets::library::document_row::DocumentRow;
     use crate::widgets::library::err_placeholder_row::ErrPlaceholderRow;
     use crate::widgets::library::folder_row::FolderRow;
-    use crate::widgets::library::project_view::ProjectRow;
+    use crate::widgets::library::project_list_box::ProjectListBox;
+    use crate::widgets::library::project_list_box::ProjectRow;
 
-    #[derive(CompositeTemplate, Default, Properties)]
+    #[derive(Default, Properties)]
     #[properties(wrapper_type = super::ProjectView)]
-    #[template(resource = "/org/scratchmark/Scratchmark/ui/library/project_view.ui")]
     pub struct ProjectView {
-        #[template_child]
-        pub(super) project_vbox: TemplateChild<ListBox>,
-        pub(super) project_rows: RefCell<HashMap<PathBuf, ProjectRow>>,
+        pub(super) listbox: ProjectListBox,
         pub(super) project: OnceLock<Project>,
 
         #[property(nullable, get, set)]
         open_document_path: RefCell<Option<PathBuf>>,
         #[property(nullable, get, set)]
         selected_item_path: RefCell<Option<PathBuf>>,
+
         previous_open_document: RefCell<Option<Document>>,
         expanded_folders_queue: RefCell<HashSet<PathBuf>>,
-        pub(super) sorter: RefCell<ProjectSorter>,
         #[property(get, set)]
         sort_method: RefCell<String>,
+        #[property(get, set)]
+        two_column_sidebar: Cell<bool>,
     }
 
     #[glib::object_subclass]
@@ -76,14 +50,6 @@ mod imp {
         const NAME: &'static str = "ProjectView";
         type Type = super::ProjectView;
         type ParentType = adw::Bin;
-
-        fn class_init(klass: &mut Self::Class) {
-            klass.bind_template();
-        }
-
-        fn instance_init(obj: &InitializingObject<Self>) {
-            obj.init_template();
-        }
     }
 
     #[glib::derived_properties]
@@ -91,76 +57,14 @@ mod imp {
         fn constructed(&self) {
             let obj = self.obj();
 
-            self.project_vbox.set_focusable(false);
-            let sorter = self.sorter.borrow().clone();
-            self.project_vbox.set_sort_func(clone!(
-                #[strong]
-                sorter,
-                move |a, b| {
-                    fn row_to_path(row: &ListBoxRow) -> Option<PathBuf> {
-                        if let Ok(row) = row.clone().downcast::<DocumentRow>() {
-                            Some(row.document().path())
-                        } else if let Ok(row) = row.clone().downcast::<FolderRow>() {
-                            Some(row.folder().path())
-                        } else {
-                            None
-                        }
-                    }
-                    sorter.sort(row_to_path(a).unwrap(), row_to_path(b).unwrap())
-                }
-            ));
+            obj.set_child(Some(&self.listbox));
+            obj.bind_property("sort_method", &self.listbox, "sort_method")
+                .sync_create()
+                .build();
 
-            obj.connect_sort_method_notify(clone!(move |obj| {
-                let sort_method_str = obj.sort_method();
-                let Ok(sort_method) = SortMethod::try_from(sort_method_str.as_str()) else {
-                    return;
-                };
-                let imp = obj.imp();
-                imp.sorter.borrow().set_sort_method(sort_method);
-                imp.project_vbox.invalidate_sort();
-            }));
-
-            self.project_vbox.connect_row_activated(clone!(
-                #[weak]
-                obj,
-                move |_vbox, row| {
-                    if let Ok(folder_item) = row.clone().downcast::<FolderRow>() {
-                        folder_item.on_click();
-                        obj.set_selected_item_path(Some(folder_item.folder().path()));
-                    } else if let Ok(document_item) = row.clone().downcast::<DocumentRow>() {
-                        document_item.on_click();
-                        obj.set_selected_item_path(Some(document_item.document().path()));
-                    };
-                }
-            ));
-
-            obj.connect_open_document_path_notify(move |obj| {
-                let imp = obj.imp();
-                if let Some(prev) = imp.previous_open_document.borrow().as_ref() {
-                    prev.set_is_open_in_editor(false);
-                }
-                let new = obj
-                    .open_document_path()
-                    .and_then(|path| imp.document_item(&path));
-                if let Some(row) = &new {
-                    row.document().set_is_open_in_editor(true);
-                    obj.imp().project_vbox.select_row(Some(row));
-                }
-                imp.previous_open_document
-                    .replace(new.map(|row| row.document().clone()));
-            });
-
-            obj.connect_selected_item_path_notify(move |obj| {
-                obj.imp().refresh_selection();
-            });
-
-            self.project_vbox.connect_selected_rows_changed(clone!(
-                #[weak(rename_to = imp)]
-                self,
-                move |_| {
-                    imp.refresh_selection();
-                }
-            ));
+            obj.connect_open_document_path_notify(move |obj| obj.imp().on_open_document_changed());
+            obj.connect_selected_item_path_notify(move |obj| obj.imp().refresh_listbox_selection());
+            obj.connect_two_column_sidebar_notify(move |obj| obj.imp().refresh_listbox_selection());
 
             self.parent_constructed();
         }
@@ -170,45 +74,46 @@ mod imp {
     impl BinImpl for ProjectView {}
 
     impl ProjectView {
-        pub(super) fn project(&self) -> &Project {
-            self.project.get().unwrap()
-        }
-
-        pub(super) fn project_row(&self, path: &Path) -> Option<ProjectRow> {
-            self.project_rows.borrow().get(path).cloned()
-        }
-
         pub(super) fn document_item(&self, path: &Path) -> Option<DocumentRow> {
-            self.project_row(path).and_then(|item| match item {
+            self.listbox.get(path).and_then(|item| match item {
                 ProjectRow::Doc(document_row) => Some(document_row),
                 _ => None,
             })
         }
 
         pub(super) fn folder_item(&self, path: &Path) -> Option<FolderRow> {
-            self.project_row(path).and_then(|item| match item {
+            self.listbox.get(path).and_then(|item| match item {
                 ProjectRow::Dir(folder_row) => Some(folder_row),
                 _ => None,
             })
         }
 
-        fn refresh_selection(&self) {
+        fn refresh_listbox_selection(&self) {
             let obj = self.obj();
-            if let Some(path) = obj.selected_item_path()
-                && let Some(item) = self.project_row(&path)
+
+            let path_or_parent_path = obj.selected_item_path().map(|path| {
+                if !obj.two_column_sidebar() || self.project.get().unwrap().has_folder(&path) {
+                    path
+                } else {
+                    path.parent().unwrap().to_path_buf()
+                }
+            });
+
+            if let Some(path) = path_or_parent_path
+                && let Some(item) = self.listbox.get(&path)
             {
                 if !item.is_selected() {
-                    self.project_vbox.select_row(Some(&item.to_list_box_row()));
+                    self.listbox.select_row(&path);
                 }
             } else {
-                self.project_vbox.unselect_all();
-            };
+                self.listbox.unselect_all();
+            }
         }
 
         fn insert_item(&self, item: ProjectItem) {
             let obj = self.obj();
             let path = item.path();
-            if self.has_item(&path) || !self.is_item_visible(&path) {
+            if self.listbox.has(&path) || !self.is_item_visible(&path) {
                 return;
             }
 
@@ -221,21 +126,25 @@ mod imp {
                 ProjectItem::Dir(dir) => {
                     let folder_row = FolderRow::new(dir);
                     self.connect_folder_row(&folder_row);
+                    if obj
+                        .open_document_path()
+                        .is_some_and(|p| p.starts_with(&path))
+                        || obj
+                            .selected_item_path()
+                            .is_some_and(|p| p.starts_with(&path))
+                    {
+                        folder_row.set_is_expanded(true);
+                    }
                     ProjectRow::Dir(folder_row)
                 }
             };
 
-            self.sorter.borrow().insert(item.clone());
-            self.project_rows
-                .borrow_mut()
-                .insert(path.clone(), project_row.clone());
-            self.project_vbox.insert(&project_row.to_list_box_row(), -1);
+            self.listbox.insert(project_row);
 
             let is_selected = obj.selected_item_path().is_some_and(|sel| sel == path);
 
             if is_selected {
-                self.project_vbox
-                    .select_row(Some(&project_row.to_list_box_row()));
+                self.listbox.select_row(&path);
             }
 
             match item {
@@ -260,7 +169,7 @@ mod imp {
                                 #[weak(rename_to = imp)]
                                 self,
                                 move |_: Folder| {
-                                    imp.project_vbox.invalidate_sort();
+                                    imp.listbox.invalidate_sort();
                                 }
                             ),
                         );
@@ -270,6 +179,12 @@ mod imp {
         }
 
         fn connect_document_row(&self, document_row: &DocumentRow) {
+            self.obj()
+                .bind_property("two_column_sidebar", document_row, "visible")
+                .invert_boolean()
+                .sync_create()
+                .build();
+
             document_row.connect_closure(
                 "needs-attention",
                 true,
@@ -286,6 +201,11 @@ mod imp {
 
         fn connect_folder_row(&self, folder_row: &FolderRow) {
             let obj = self.obj();
+
+            obj.bind_property("two-column-sidebar", folder_row, "two-column-sidebar")
+                .sync_create()
+                .build();
+
             let folder = folder_row.folder();
             folder_row.connect_is_expanded_notify(clone!(
                 #[weak(rename_to = imp)]
@@ -360,11 +280,9 @@ mod imp {
         }
 
         fn remove_item(&self, path: &Path) {
-            let Some(item) = self.project_rows.borrow_mut().remove(path) else {
+            let Some(item) = self.listbox.remove(path) else {
                 return;
             };
-            self.project_vbox.remove(&item.to_list_box_row());
-            self.sorter.borrow().remove(path);
 
             if let ProjectRow::Dir(folder_row) = item {
                 for path in folder_row.folder().subfolders().keys() {
@@ -378,14 +296,14 @@ mod imp {
 
         /// Expand all parents
         pub(super) fn make_visible(&self, path: &Path) {
-            if !path.starts_with(self.project().path()) {
+            if !path.starts_with(self.project.get().unwrap().path()) {
                 return;
             }
 
-            if !self.has_item(path) {
-                if let Some(folder) = self.project().get_folder(path) {
+            if !self.listbox.has(path) {
+                if let Some(folder) = self.project.get().unwrap().get_folder(path) {
                     self.insert_item(ProjectItem::Dir(folder));
-                } else if let Some(document) = self.project().get_document(path) {
+                } else if let Some(document) = self.project.get().unwrap().get_document(path) {
                     self.insert_item(ProjectItem::Doc(document));
                 }
             }
@@ -396,7 +314,7 @@ mod imp {
         }
 
         pub(super) fn expand_folder(&self, path: &Path) {
-            if let Some(ProjectRow::Dir(folder_view)) = self.project_row(path) {
+            if let Some(ProjectRow::Dir(folder_view)) = self.listbox.get(path) {
                 folder_view.set_is_expanded(true);
                 self.expanded_folders_queue.borrow_mut().remove(path);
             } else {
@@ -406,17 +324,13 @@ mod imp {
             }
         }
 
-        fn has_item(&self, path: &Path) -> bool {
-            self.project_rows.borrow().contains_key(path)
-        }
-
         fn is_item_visible(&self, path: &Path) -> bool {
             let components = path.parent().unwrap().components();
             let mut check_path = PathBuf::new();
             for component in components {
                 check_path.push(component);
 
-                if let Some(item) = self.project_rows.borrow().get(&check_path)
+                if let Some(item) = self.listbox.get(&check_path)
                     && let ProjectRow::Dir(folder_row) = item
                     && !folder_row.is_expanded()
                 {
@@ -426,13 +340,9 @@ mod imp {
             true
         }
 
-        pub(super) fn refresh_content(&self) {
-            self.project().refresh_content();
-            self.project_vbox.invalidate_sort();
-        }
-
         fn mark_invalid(&self) {
-            let err_placeholder: ErrPlaceholderRow = ErrPlaceholderRow::new(&self.project().path());
+            let err_placeholder: ErrPlaceholderRow =
+                ErrPlaceholderRow::new(&self.project.get().unwrap().path());
             err_placeholder.connect_closure(
                 "close-project-requested",
                 false,
@@ -444,9 +354,8 @@ mod imp {
                     }
                 ),
             );
-            self.project_rows.borrow_mut().clear();
-            self.project_vbox.remove_all();
-            self.project_vbox.append(&err_placeholder);
+            self.listbox.clear();
+            //self.listbox.append(&err_placeholder);
         }
 
         pub(super) fn bind(&self, project: &Project) {
@@ -503,6 +412,23 @@ mod imp {
                 self.insert_item(ProjectItem::Doc(doc.clone()));
             }
         }
+
+        fn on_open_document_changed(&self) {
+            if let Some(prev) = self.previous_open_document.borrow_mut().take() {
+                prev.set_is_open_in_editor(false);
+            }
+
+            if let Some(path) = self.obj().open_document_path()
+                && let Some(row) = self.document_item(&path)
+            {
+                let doc = row.document().clone();
+                doc.set_is_open_in_editor(true);
+                self.listbox.select_row(&path);
+                self.previous_open_document.replace(Some(doc));
+            } else {
+                self.listbox.unselect_all();
+            }
+        }
     }
 }
 
@@ -519,6 +445,7 @@ use glib::Object;
 use crate::data::Project;
 use crate::widgets::library::document_row::DocumentRow;
 use crate::widgets::library::folder_row::FolderRow;
+use crate::widgets::library::project_list_box::ProjectRow;
 
 glib::wrapper! {
     pub struct ProjectView(ObjectSubclass<imp::ProjectView>)
@@ -535,7 +462,7 @@ impl ProjectView {
     }
 
     pub fn project(&self) -> &Project {
-        self.imp().project()
+        self.imp().project.get().unwrap()
     }
 
     pub fn document_item(&self, path: &Path) -> Option<DocumentRow> {
@@ -546,13 +473,9 @@ impl ProjectView {
         self.imp().folder_item(path)
     }
 
-    pub fn refresh_content(&self) {
-        self.imp().refresh_content();
-    }
-
     pub fn expanded_folder_paths(&self) -> Vec<String> {
         let mut paths = vec![];
-        for (path, item) in self.imp().project_rows.borrow().iter() {
+        for (path, item) in self.imp().listbox.rows().iter() {
             if !self.project().has_item(path) {
                 continue;
             }
diff --git a/src/widgets/window.rs b/src/widgets/window.rs
index 295badf..4d79816 100644
--- a/src/widgets/window.rs
+++ b/src/widgets/window.rs
@@ -4,6 +4,7 @@ mod imp {
     use std::cell::RefCell;
     use std::path::PathBuf;
 
+    use adw::SplitButton;
     use adw::prelude::*;
     use adw::subclass::prelude::*;
     use glib::clone;
@@ -45,6 +46,7 @@ mod imp {
     use crate::widgets::MarkdownFormatBar;
     use crate::widgets::PreferencesDialog;
     use crate::widgets::WindowTitle;
+    use crate::widgets::library::FolderView;
 
     #[derive(CompositeTemplate, Default, Properties)]
     #[properties(wrapper_type = super::Window)]
@@ -53,17 +55,16 @@ mod imp {
         #[template_child]
         top_split: TemplateChild<OverlaySplitView>,
 
-        #[template_child]
-        sidebar_page: TemplateChild<NavigationPage>,
         #[template_child]
         sidebar_toolbar_view: TemplateChild<ToolbarView>,
         #[template_child]
-        sidebar_toggle: TemplateChild<ToggleButton>,
-        /// Bound to setting. Does not directly map to sidebar visibility, because even when this
-        /// is true, the sidebar can be hidden by focus mode or too narrow window.
-        #[property(get, set)]
-        show_sidebar: Cell<bool>,
-
+        sidebar_button: TemplateChild<Button>,
+        #[template_child]
+        sidebar_split_button: TemplateChild<SplitButton>,
+        // /// Bound to setting. Does not directly map to sidebar visibility, because even when this
+        // /// is true, the sidebar can be hidden by focus mode or too narrow window.
+        // #[property(get, set)]
+        // show_sidebar: Cell<bool>,
         #[template_child]
         main_page: TemplateChild<NavigationPage>,
         #[template_child]
@@ -88,6 +89,8 @@ mod imp {
         editor_sidebar_toggle: TemplateChild<ToggleButton>,
 
         library_view: LibraryView,
+        #[template_child]
+        library_folder_column: TemplateChild<FolderView>,
         editor: RefCell<Option<Editor>>,
 
         motion_controller: EventControllerMotion,
@@ -108,6 +111,7 @@ mod imp {
         type ParentType = ApplicationWindow;
 
         fn class_init(klass: &mut Self::Class) {
+            FolderView::ensure_type();
             MarkdownFormatBar::ensure_type();
             WindowTitle::ensure_type();
 
@@ -144,9 +148,9 @@ mod imp {
                 settings
                     .bind("win-is-maximized", obj.as_ref(), "maximized")
                     .build();
-                settings
-                    .bind("library-show-sidebar", obj.as_ref(), "show-sidebar")
-                    .build();
+                // settings
+                //     .bind("library-show-sidebar", obj.as_ref(), "show-sidebar")
+                //     .build();
                 let editor_sidebar_toggle: &ToggleButton = self.editor_sidebar_toggle.as_ref();
                 settings
                     .bind("editor-show-sidebar", editor_sidebar_toggle, "active")
@@ -171,6 +175,20 @@ mod imp {
                     )
                     .get()
                     .build();
+                settings
+                    .bind(
+                        "library-two-column-sidebar",
+                        library_view,
+                        "two-column-sidebar",
+                    )
+                    .build();
+                settings
+                    .bind("library-sort-method", library_view, "sort-method")
+                    .build();
+                let folder_column: &FolderView = &self.library_folder_column;
+                settings
+                    .bind("library-details-sort-method", folder_column, "sort-method")
+                    .build();
             }
             #[cfg(feature = "generatescreenshots")]
             {
@@ -255,6 +273,16 @@ mod imp {
                 obj.add_controller(key_controller);
             }
 
+            let folder_column: &FolderView = &self.library_folder_column;
+            self.library_view
+                .bind_property("selected_folder", folder_column, "folder")
+                .sync_create()
+                .build();
+            self.library_view
+                .bind_property("two_column_sidebar", folder_column, "visible")
+                .sync_create()
+                .build();
+
             obj.connect_notify(Some("focus-mode-enabled"), move |obj, _| {
                 let focus_mode_enabled = obj.focus_mode_enabled();
                 obj.action_set_enabled("win.enable-focus", !focus_mode_enabled);
@@ -455,42 +483,43 @@ mod imp {
                 ),
             );
 
-            if !self.top_split.is_collapsed() {
-                // Get initial state from setting.
-                self.top_split.set_show_sidebar(obj.show_sidebar());
-            }
+            // if !self.top_split.is_collapsed() {
+            //     // Get initial state from setting.
+            //     self.top_split.set_show_sidebar(obj.show_sidebar());
+            // }
 
-            self.sidebar_toggle.connect_active_notify(clone!(
+            self.sidebar_split_button.connect_clicked(clone!(
                 #[weak]
                 obj,
-                move |sidebar_toggle| {
-                    // Sidebar toggle clicked
-                    if obj.imp().top_split.is_collapsed() {
-                        // Window is narrow, sidebar is an overlay. Do not change the setting.
-                        return;
-                    }
-                    if obj.focus_mode_active() {
-                        return;
-                    }
-                    obj.set_show_sidebar(sidebar_toggle.is_active())
-                }
+                move |_| obj.imp().set_sidebar_open(false)
             ));
 
-            self.top_split.connect_collapsed_notify(clone!(
+            self.sidebar_button.connect_clicked(clone!(
                 #[weak]
                 obj,
-                move |top_split| {
-                    if !top_split.is_collapsed() {
-                        // Sidebar was uncollapsed, get uncollapsed state from setting again.
-                        top_split.set_show_sidebar(obj.show_sidebar());
-                    }
+                move |_| {
+                    // // Sidebar toggle clicked
+                    // if obj.imp().top_split.is_collapsed() {
+                    //     // Window is narrow, sidebar is an overlay. Do not change the setting.
+                    //     return;
+                    // }
+                    // if obj.focus_mode_active() {
+                    //     return;
+                    // }
+                    obj.imp().set_sidebar_open(true);
                 }
             ));
 
-            let sidebar_toggle: &ToggleButton = self.sidebar_toggle.as_ref();
+            self.top_split.connect_collapsed_notify(clone!(
+                #[weak(rename_to = imp)]
+                self,
+                move |_| imp.on_sidebar_collapse_changed()
+            ));
+
+            let sidebar_button: &Button = &self.sidebar_button;
             self.top_split
-                .bind_property("show-sidebar", sidebar_toggle, "active")
-                .bidirectional()
+                .bind_property("show-sidebar", sidebar_button, "visible")
+                .invert_boolean()
                 .sync_create()
                 .build();
 
@@ -640,20 +669,15 @@ mod imp {
             action.connect_activate(clone!(
                 #[weak(rename_to = imp)]
                 self,
-                move |_, _| {
-                    imp.library_view.refresh_content();
-                }
+                move |_, _| imp.library_view.refresh_content()
             ));
             obj.add_action(&action);
 
             let action = SimpleAction::new("toggle-sidebar", None);
             action.connect_activate(clone!(
-                #[weak]
-                top_split,
-                move |_, _| {
-                    let show = !top_split.shows_sidebar();
-                    top_split.set_show_sidebar(show);
-                }
+                #[weak(rename_to = imp)]
+                self,
+                move |_, _| imp.set_sidebar_open(!top_split.shows_sidebar())
             ));
             obj.add_action(&action);
 
@@ -684,7 +708,7 @@ mod imp {
             let library_actions = SimpleActionGroup::new();
             obj.insert_action_group("library", Some(&library_actions));
             let action = SimpleAction::new_stateful(
-                "sort-type",
+                "sort-method",
                 Some(VariantTy::STRING),
                 &SortMethod::default().to_string().to_variant(),
             );
@@ -700,6 +724,20 @@ mod imp {
             ));
             library_actions.add_action(&action);
 
+            let action =
+                SimpleAction::new_stateful("two-column-sidebar", None, &false.to_variant());
+            action.connect_activate(clone!(
+                #[weak(rename_to = imp)]
+                self,
+                move |action, _| {
+                    let show = !action.state().unwrap().get::<bool>().unwrap();
+                    imp.library_view.set_two_column_sidebar(show);
+                    action.set_state(&show.to_variant());
+                }
+            ));
+            action.set_state(&self.library_view.two_column_sidebar().to_variant());
+            library_actions.add_action(&action);
+
             let editor_actions = SimpleActionGroup::new();
             obj.insert_action_group("editor", Some(&editor_actions));
 
@@ -825,12 +863,32 @@ mod imp {
                 active = false;
             }
             obj.set_focus_mode_active(active);
-            self.top_split
-                .set_show_sidebar(obj.show_sidebar() && !active);
+            // self.top_split
+            //     .set_show_sidebar(obj.show_sidebar() && !active);
             self.update_toolbar_visibility();
             self.update_toolbar_style();
         }
 
+        fn set_sidebar_open(&self, open: bool) {
+            if self.top_split.is_collapsed() {
+                self.top_split.set_show_sidebar(open);
+            } else {
+                let settings = self.settings();
+                settings.set_boolean("library-show-sidebar", open).unwrap();
+                self.top_split.set_show_sidebar(open);
+            }
+        }
+
+        fn on_sidebar_collapse_changed(&self) {
+            if self.top_split.is_collapsed() {
+                self.top_split.set_show_sidebar(false);
+            } else {
+                let settings = self.settings();
+                let setting = settings.boolean("library-show-sidebar");
+                self.top_split.set_show_sidebar(setting);
+            }
+        }
+
         fn update_toolbar_visibility(&self) {
             let obj = self.obj();
             let focus_mode_active = obj.focus_mode_active();
@@ -1022,6 +1080,8 @@ mod imp {
                 .bind("editor-show-minimap", &editor, "show-minimap")
                 .build();
 
+            self.library_folder_column
+                .set_open_document(Some(path.clone()));
             self.main_toolbar_view.set_content(Some(&editor));
             self.format_bar.bind_editor(Some(editor.clone()));
             self.editor.replace(Some(editor));
@@ -1044,6 +1104,8 @@ mod imp {
 
         fn close_editor_without_saving(&self) {
             self.editor.replace(None);
+            self.library_folder_column
+                .set_open_document(None::<PathBuf>);
             self.main_toolbar_view
                 .set_content(Some(&EditorPlaceholder::default()));
             self.update_window_title();