Bump version

* Added linkdy entry to readme

* Fix alphabetic order

---------

Co-authored-by: Sascha Ißbrücker <sascha.issbruecker@googlemail.com>

.devcontainer/devcontainer.json

@@ -14,7 +14,7 @@
 	"forwardPorts": [8000],
 
 	// Use 'postCreateCommand' to run commands after the container is created.
-	"postCreateCommand": "pip3 install --user -r requirements.txt && npm install && mkdir -p data && python3 manage.py migrate",
+	"postCreateCommand": "pip3 install --user -r requirements.txt -r requirements.dev.txt && npm install && mkdir -p data && python3 manage.py migrate",
 
 	// Configure tool-specific properties.
 	"customizations": {

.dockerignore

@@ -1,34 +1,22 @@
-# Remove project files, data, tmp files, build files
-/.env
-/.idea
-/data
-/node_modules
-/tmp
-/docs
-/static
-/scripts
-/build
-/out
-/.git
-/.devcontainer
+# Ignore everything
+*
 
-/.dockerignore
-/.gitignore
-/.gitattributes
-/Dockerfile
-/docker-compose.yml
-/*.sh
-/*.iml
-/*.patch
-/*.md
-/*.js
-/*.log
-/*.pid
+# Include files required for build or at runtime
+!/bookmarks
+!/siteroot
 
-# Whitelist files needed in build or prod image
-!/rollup.config.js
-!/bootstrap.sh
 !/background-tasks-wrapper.sh
+!/bootstrap.sh
+!/LICENSE.txt
+!/manage.py
+!/package.json
+!/package-lock.json
+!/requirements.dev.txt
+!/requirements.txt
+!/rollup.config.js
+!/supervisord.conf
+!/uwsgi.ini
+!/version.txt
 
-# Remove development settings
+ # Remove dev settings
 /siteroot/settings/dev.py

.github/workflows/main.yaml

@@ -1,6 +1,6 @@
 name: linkding CI
 
-on: [push]
+on: [push, pull_request]
 
 jobs:
   unit_tests:
@@ -19,7 +19,7 @@ jobs:
       - name: Install Node dependencies
         run: npm install
       - name: Setup Python environment
-        run: pip install -r requirements.txt
+        run: pip install -r requirements.txt -r requirements.dev.txt
       - name: Run tests
         run: python manage.py test bookmarks.tests
   e2e_tests:
@@ -39,7 +39,7 @@ jobs:
         run: npm install
       - name: Setup Python environment
         run: |
-          pip install -r requirements.txt
+          pip install -r requirements.txt -r requirements.dev.txt
           playwright install chromium
       - name: Run build
         run: |

CHANGELOG.md

@@ -1,5 +1,147 @@
 # Changelog
 
+## v1.24.0 (27/01/2024)
+
+### What's Changed
+* Support Open Graph description by @jonathan-s in https://github.com/sissbruecker/linkding/pull/602
+* Add tooltip to truncated bookmark titles by @jonathan-s in https://github.com/sissbruecker/linkding/pull/607
+* Improve bulk tag performance by @sissbruecker in https://github.com/sissbruecker/linkding/pull/612
+* Increase tag limit in tag autocomplete by @hypebeast in https://github.com/sissbruecker/linkding/pull/581
+* Add CapRover as managed hosting option by @adamshand in https://github.com/sissbruecker/linkding/pull/585
+* Bump playwright dependencies by @jonathan-s in https://github.com/sissbruecker/linkding/pull/601
+* Adjust archive.org donation link in general.html by @JnsDornbusch in https://github.com/sissbruecker/linkding/pull/603
+
+### New Contributors
+* @hypebeast made their first contribution in https://github.com/sissbruecker/linkding/pull/581
+* @adamshand made their first contribution in https://github.com/sissbruecker/linkding/pull/585
+* @jonathan-s made their first contribution in https://github.com/sissbruecker/linkding/pull/601
+* @JnsDornbusch made their first contribution in https://github.com/sissbruecker/linkding/pull/603
+
+**Full Changelog**: https://github.com/sissbruecker/linkding/compare/v1.23.1...v1.24.0
+
+---
+
+## v1.23.1 (08/12/2023)
+
+### What's Changed
+* Properly encode search query param by @sissbruecker in https://github.com/sissbruecker/linkding/pull/587
+
+> [!WARNING] 
+> *This resolves a security vulnerability in linkding. Everyone is encouraged to upgrade to the latest version as soon as possible.*
+
+**Full Changelog**: https://github.com/sissbruecker/linkding/compare/v1.23.0...v1.23.1
+
+---
+
+## v1.23.0 (24/11/2023)
+
+### What's Changed
+* Add Alpine based Docker image (experimental) by @sissbruecker in https://github.com/sissbruecker/linkding/pull/570
+* Add backup CLI command by @sissbruecker in https://github.com/sissbruecker/linkding/pull/571
+* Update browser extension links by @OPerepadia in https://github.com/sissbruecker/linkding/pull/574
+* Include archived bookmarks in export by @sissbruecker in https://github.com/sissbruecker/linkding/pull/579
+
+### New Contributors
+* @OPerepadia made their first contribution in https://github.com/sissbruecker/linkding/pull/574
+
+**Full Changelog**: https://github.com/sissbruecker/linkding/compare/v1.22.3...v1.23.0
+
+---
+
+## v1.22.3 (04/11/2023)
+
+### What's Changed
+* Fix RSS feed not handling None values  by @vitormarcal in https://github.com/sissbruecker/linkding/pull/569
+* Bump django from 4.1.10 to 4.1.13 by @dependabot in https://github.com/sissbruecker/linkding/pull/567
+
+### New Contributors
+* @vitormarcal made their first contribution in https://github.com/sissbruecker/linkding/pull/569
+
+**Full Changelog**: https://github.com/sissbruecker/linkding/compare/v1.22.2...v1.22.3
+
+---
+
+## v1.22.2 (27/10/2023)
+
+### What's Changed
+* Fix search options not opening on iOS by @sissbruecker in https://github.com/sissbruecker/linkding/pull/549
+* Bump urllib3 from 1.26.11 to 1.26.17 by @dependabot in https://github.com/sissbruecker/linkding/pull/542
+* Add iOS shortcut to community section by @andrewdolphin in https://github.com/sissbruecker/linkding/pull/550
+* Disable editing of search preferences in user admin by @sissbruecker in https://github.com/sissbruecker/linkding/pull/555
+* Add feed2linkding to community section by @Strubbl in https://github.com/sissbruecker/linkding/pull/544
+* Sanitize RSS feed to remove control characters by @sissbruecker in https://github.com/sissbruecker/linkding/pull/565
+* Bump urllib3 from 1.26.17 to 1.26.18 by @dependabot in https://github.com/sissbruecker/linkding/pull/560
+
+### New Contributors
+* @andrewdolphin made their first contribution in https://github.com/sissbruecker/linkding/pull/550
+* @Strubbl made their first contribution in https://github.com/sissbruecker/linkding/pull/544
+
+**Full Changelog**: https://github.com/sissbruecker/linkding/compare/v1.22.1...v1.22.2
+
+---
+
+## v1.22.1 (06/10/2023)
+
+### What's Changed
+* Fix memory leak with SQLite by @sissbruecker in https://github.com/sissbruecker/linkding/pull/548
+
+
+**Full Changelog**: https://github.com/sissbruecker/linkding/compare/v1.22.0...v1.22.1
+
+---
+
+## v1.22.0 (01/10/2023)
+
+### What's Changed
+* Fix case-insensitive search for unicode characters in SQLite by @sissbruecker in https://github.com/sissbruecker/linkding/pull/520
+* Add sort option to bookmark list by @sissbruecker in https://github.com/sissbruecker/linkding/pull/522
+* Add button to show tags on smaller screens by @sissbruecker in https://github.com/sissbruecker/linkding/pull/529
+* Make code blocks in notes scrollable by @sissbruecker in https://github.com/sissbruecker/linkding/pull/530
+* Add filter for shared state by @sissbruecker in https://github.com/sissbruecker/linkding/pull/531
+* Add support for exporting/importing bookmark notes by @sissbruecker in https://github.com/sissbruecker/linkding/pull/532
+* Add filter for unread state by @sissbruecker in https://github.com/sissbruecker/linkding/pull/535
+* Allow saving search preferences by @sissbruecker in https://github.com/sissbruecker/linkding/pull/540
+* Add user profile endpoint by @sissbruecker in https://github.com/sissbruecker/linkding/pull/541
+
+
+**Full Changelog**: https://github.com/sissbruecker/linkding/compare/v1.21.0...v1.22.0
+
+---
+
+## v1.21.1 (26/09/2023)
+
+### What's Changed
+* Fix bulk edit to respect searched tags by @sissbruecker in https://github.com/sissbruecker/linkding/pull/537
+
+
+**Full Changelog**: https://github.com/sissbruecker/linkding/compare/v1.21.0...v1.21.1
+
+---
+
+## v1.21.0 (25/08/2023)
+
+### What's Changed
+* Make search autocomplete respect link target setting by @sissbruecker in https://github.com/sissbruecker/linkding/pull/513
+* Various CSS improvements by @sissbruecker in https://github.com/sissbruecker/linkding/pull/514
+* Display shared state in bookmark list by @sissbruecker in https://github.com/sissbruecker/linkding/pull/515
+* Allow bulk editing unread and shared state of bookmarks by @sissbruecker in https://github.com/sissbruecker/linkding/pull/517
+* Bump uwsgi from 2.0.20 to 2.0.22 by @dependabot in https://github.com/sissbruecker/linkding/pull/516
+
+
+**Full Changelog**: https://github.com/sissbruecker/linkding/compare/v1.20.1...v1.21.0
+
+---
+
+## v1.20.1 (23/08/2023)
+
+### What's Changed
+* Update cached styles and scripts after version change by @sissbruecker in https://github.com/sissbruecker/linkding/pull/510
+
+
+**Full Changelog**: https://github.com/sissbruecker/linkding/compare/v1.20.0...v1.20.1
+
+---
+
 ## v1.20.0 (22/08/2023)
 
 ### What's Changed

Dockerfile

@@ -1,58 +0,0 @@
-FROM node:18.13.0-alpine AS node-build
-WORKDIR /etc/linkding
-# install build dependencies
-COPY package.json package-lock.json ./
-RUN npm install -g npm && \
-    npm install
-# compile JS components
-COPY . .
-RUN npm run build
-
-
-FROM python:3.10.6-slim-buster AS python-base
-RUN apt-get update && apt-get -y install build-essential libpq-dev
-WORKDIR /etc/linkding
-
-
-FROM python-base AS python-build
-# install build dependencies
-COPY requirements.txt requirements.txt
-RUN pip install -U pip && pip install -Ur requirements.txt
-# run Django part of the build
-COPY --from=node-build /etc/linkding .
-RUN python manage.py compilescss && \
-    python manage.py collectstatic --ignore=*.scss && \
-    python manage.py compilescss --delete-files
-
-
-FROM python-base AS prod-deps
-COPY requirements.prod.txt ./requirements.txt
-RUN mkdir /opt/venv && \
-    python -m venv --upgrade-deps --copies /opt/venv && \
-    /opt/venv/bin/pip install --upgrade pip wheel && \
-    /opt/venv/bin/pip install -Ur requirements.txt
-
-
-FROM python:3.10.6-slim-buster as final
-RUN apt-get update && apt-get -y install mime-support libpq-dev curl
-WORKDIR /etc/linkding
-# copy prod dependencies
-COPY --from=prod-deps /opt/venv /opt/venv
-# copy output from build stage
-COPY --from=python-build /etc/linkding/static static/
-# copy application code
-COPY . .
-# Expose uwsgi server at port 9090
-EXPOSE 9090
-# Activate virtual env
-ENV VIRTUAL_ENV /opt/venv
-ENV PATH /opt/venv/bin:$PATH
-# Allow running containers as an an arbitrary user in the root group, to support deployment scenarios like OpenShift, Podman
-RUN ["chmod", "g+w", "."]
-# Run bootstrap logic
-RUN ["chmod", "+x", "./bootstrap.sh"]
-
-HEALTHCHECK --interval=30s --retries=3 --timeout=1s \
-CMD curl -f http://localhost:${LD_SERVER_PORT:-9090}/${LD_CONTEXT_PATH}health || exit 1
-
-CMD ["./bootstrap.sh"]

Makefile

@@ -0,0 +1,15 @@
+.PHONY: serve
+
+serve:
+	python manage.py runserver
+
+tasks:
+	python manage.py process_tasks
+
+test:
+	pytest
+
+format:
+	black bookmarks
+	black siteroot
+	npx prettier bookmarks/frontend --write

README.md

@@ -17,7 +17,7 @@
 - [Documentation](#documentation)
 - [Browser Extension](#browser-extension)
 - [Community](#community)
-- [Acknowledgements](#acknowledgements)
+- [Acknowledgements + Donations](#acknowledgements--donations)
 - [Development](#development)
 
 ##  Introduction
@@ -40,7 +40,7 @@ The name comes from:
 - Automatically provides titles, descriptions and icons of bookmarked websites
 - Automatically creates snapshots of bookmarked websites on [the Internet Archive Wayback Machine](https://archive.org/web/)
 - Import and export bookmarks in Netscape HTML format
-- Extensions for [Firefox](https://addons.mozilla.org/de/firefox/addon/linkding-extension/) and [Chrome](https://chrome.google.com/webstore/detail/linkding-extension/beakmhbijpdhipnjhnclmhgjlddhidpe), as well as a bookmarklet
+- Extensions for [Firefox](https://addons.mozilla.org/firefox/addon/linkding-extension/) and [Chrome](https://chrome.google.com/webstore/detail/linkding-extension/beakmhbijpdhipnjhnclmhgjlddhidpe), as well as a bookmarklet
 - Light and dark themes
 - REST API for developing 3rd party apps
 - Admin panel for user self-service and raw data access
@@ -58,9 +58,27 @@ The name comes from:
 linkding is designed to be run with container solutions like [Docker](https://docs.docker.com/get-started/).
 The Docker image is compatible with ARM platforms, so it can be run on a Raspberry Pi.
 
-By default, linkding uses SQLite as a database.
+linkding uses an SQLite database by default.
 Alternatively linkding supports PostgreSQL, see the [database options](docs/Options.md#LD_DB_ENGINE) for more information.
 
+<details>
+
+<summary>🧪 Alpine-based image</summary>
+
+The default Docker image (`latest` tag) is based on a slim variant of Debian Linux.
+Alternatively, there is an image based on Alpine Linux (`latest-alpine` tag) which has a smaller size, resulting in a smaller download and less disk space required.
+The Alpine image is currently about 45 MB in compressed size, compared to about 130 MB for the Debian image.
+
+To use it, replace the `latest` tag with `latest-alpine`, either in the CLI command below when using Docker, or in the `docker-compose.yml` file when using docker-compose.
+
+> [!WARNING]
+> The image is currently considered experimental in order to gather feedback and iron out any issues.
+> Only use it if you are comfortable running experimental software or want to help out with testing.
+> While there should be no issues with creating new installations, there might be issues when migrating existing installations.
+> If you plan to migrate your existing installation, make sure to create proper [backups](https://github.com/sissbruecker/linkding/blob/master/docs/backup.md) first.
+
+</details>
+
 ###  Using Docker
 
 To install linkding using Docker you can just run the [latest image](https://hub.docker.com/repository/docker/sissbruecker/linkding) from Docker Hub:
@@ -85,7 +103,7 @@ docker-compose up -d
 
 To complete the setup, you still have to [create an initial user](#user-setup), so that you can access your installation.
 
-### User setup
+### User Setup
 
 For security reasons, the linkding Docker image does not provide an initial user, so you have to create one after setting up an installation. To do so, replace the credentials in the following command and run it:
 
@@ -160,10 +178,11 @@ Instead of configuring header forwarding in your proxy, you can also configure t
 
 ### Managed Hosting Options
 
-Self-hosting web applications still requires a lot of technical know-how, and commitment to maintenance, with regard to keeping everything up-to-date and secure. This can be a huge entry barrier for people who are interested in self-hosting, but lack the technical knowledge to do so. This section is intended to provide alternatives in form of managed hosting solutions. Note that these options are usually commercial offerings, that require paying a fee for the convenience of being managed by another party. The technical knowledge required to make use of individual options is going to vary, and no guarantees can be made that every option is accessible for everyone. That being said, I hope this section helps in making the application accessible to a wider audience.
+Self-hosting web applications still requires a lot of technical know-how and commitment to maintenance, in order to keep everything up-to-date and secure. This section is intended to provide simple alternatives in form of managed hosting solutions.
 
 - [linkding on fly.io](https://github.com/fspoettel/linkding-on-fly) - Guide for hosting a linkding installation on [fly.io](https://fly.io). By [fspoettel](https://github.com/fspoettel)
-- [PikaPods.com](https://www.pikapods.com/) - Managed hosting for linkding, EU and US regions available. [1-click setup link](https://www.pikapods.com/pods?run=linkding)
+- [PikaPods.com](https://www.pikapods.com/) - Managed hosting for linkding, EU and US regions available. [1-click setup link](https://www.pikapods.com/pods?run=linkding) ([Disclosure](#pikapods))
+- [CapRover](https://caprover.com/) - Linkding is included as a default one-click app
 
 ## Documentation
 
@@ -180,7 +199,7 @@ Self-hosting web applications still requires a lot of technical know-how, and co
 ## Browser Extension
 
 linkding comes with an official browser extension that allows to quickly add bookmarks, and search bookmarks through the browser's address bar. You can get the extension here:
-- [Mozilla Addon Store](https://addons.mozilla.org/de/firefox/addon/linkding-extension/)
+- [Mozilla Addon Store](https://addons.mozilla.org/firefox/addon/linkding-extension/)
 - [Chrome Web Store](https://chrome.google.com/webstore/detail/linkding-extension/beakmhbijpdhipnjhnclmhgjlddhidpe)
 
 The extension is open-source as well, and can be found [here](https://github.com/sissbruecker/linkding-extension).
@@ -190,18 +209,34 @@ The extension is open-source as well, and can be found [here](https://github.com
 This section lists community projects around using linkding, in alphabetical order. If you have a project that you want to share with the linkding community, feel free to submit a PR to add your project to this section.
 
 - [aiolinkding](https://github.com/bachya/aiolinkding) A Python3, async library to interact with the linkding REST API. By [bachya](https://github.com/bachya)
+- [feed2linkding](https://codeberg.org/strubbl/feed2linkding) A commandline utility to add all web feed item links to linkding via API call. By [Strubbl](https://github.com/Strubbl)
 - [Helm Chart](https://charts.pascaliske.dev/charts/linkding/) Helm Chart for deploying linkding inside a Kubernetes cluster. By [pascaliske](https://github.com/pascaliske)
+- [iOS Shortcut using API and Tagging](https://gist.github.com/andrewdolphin/a7dff49505e588d940bec55132fab8ad) An iOS shortcut using the Linkding API (no extra logins required) that pulls previously used tags and allows tagging at the time of link creation.
+- [k8s + s3](https://github.com/jzck/linkding-k8s-s3) - Setup for hosting stateless linkding on k8s with sqlite replicated to s3. By [jzck](https://github.com/jzck)
 - [Linka!](https://github.com/cmsax/linka) Web app (also a PWA) for quickly searching & opening bookmarks in linkding, support multi keywords, exclude mode and other advance options. By [cmsax](https://github.com/cmsax)
 - [linkding-cli](https://github.com/bachya/linkding-cli) A command-line interface (CLI) to interact with the linkding REST API. Powered by [aiolinkding](https://github.com/bachya/aiolinkding). By [bachya](https://github.com/bachya)
 - [linkding-extension](https://github.com/jeroenpardon/linkding-extension) Chromium compatible extension that wraps the linkding bookmarklet. Tested with Chrome, Edge, Brave. By [jeroenpardon](https://github.com/jeroenpardon)
 - [linkding-injector](https://github.com/Fivefold/linkding-injector) Injects search results from linkding into the sidebar of search pages like google and duckduckgo. Tested with Firefox and Chrome. By [Fivefold](https://github.com/Fivefold)
+- [Linkdy](https://github.com/JGeek00/linkdy): An open source mobile and desktop (not yet) client created with Flutter. Available at the [Google Play Store](https://play.google.com/store/apps/details?id=com.jgeek00.linkdy). By [JGeek00](https://github.com/JGeek00).
 - [LinkThing](https://apps.apple.com/us/app/linkthing/id1666031776) An iOS client for linkding. By [amoscardino](https://github.com/amoscardino)
 - [Open all links bookmarklet](https://gist.github.com/ukcuddlyguy/336dd7339e6d35fc64a75ccfc9323c66) A browser bookmarklet to open all links on the current Linkding page in new tabs. By [ukcuddlyguy](https://github.com/ukcuddlyguy)
 - [Postman collection](https://gist.github.com/gingerbeardman/f0b42502f3bc9344e92ce63afd4360d3) a group of saved request templates for API testing. By [gingerbeardman](https://github.com/gingerbeardman)
 
-## Acknowledgements
+## Acknowledgements + Donations
 
-JetBrains provides an open-source license of [IntelliJ IDEA](https://www.jetbrains.com/idea/) for the development of linkding.
+### PikaPods
+
+[PikaPods](https://www.pikapods.com/) has a revenue sharing agreement with this project, sharing some of their revenue from hosting linkding instances. I do not intend to profit from this project financially, so I am in turn donating that revenue. Big thanks to PikaPods for making this possible.
+
+See the table below for a list of donations.
+
+| Source                                | Description                                 | Amount  | Donated to                                                          |
+|---------------------------------------|---------------------------------------------|---------|---------------------------------------------------------------------|
+| [PikaPods](https://www.pikapods.com/) | Linkding hosting June 2022 - September 2023 | $163.50 | [Internet Archive](/docs/donations/2023-10-11-internet-archive.png) |
+
+### JetBrains
+
+JetBrains has previously provided an open-source license of [IntelliJ IDEA](https://www.jetbrains.com/idea/) for the development of linkding.
 
 ## Development
 
@@ -223,7 +258,7 @@ source ~/environments/linkding/bin/activate[.csh|.fish]
 ```
 Within the active environment install the application dependencies from the application folder:
 ```
-pip3 install -Ur requirements.txt
+pip3 install -r requirements.txt -r requirements.dev.txt
 ```
 Install frontend dependencies:
 ```
@@ -248,6 +283,20 @@ python3 manage.py runserver
 ```
 The frontend is now available under http://localhost:8000
 
+### Tests
+
+Run all tests with pytest:
+```
+pytest
+```
+
+### Formatting
+
+Format Python code with black, and JavaScript code with prettier:
+```
+make format
+```
+
 ### DevContainers
 
 This repository also supports DevContainers: [![Open in Remote - Containers](https://img.shields.io/static/v1?label=Remote%20-%20Containers&message=Open&color=blue&logo=visualstudiocode)](https://vscode.dev/redirect?url=vscode://ms-vscode-remote.remote-containers/cloneInVolume?url=git@github.com:sissbruecker/linkding.git)

bookmarks/admin.py

@@ -14,80 +14,123 @@ from bookmarks.services.bookmarks import archive_bookmark, unarchive_bookmark
 
 
 class LinkdingAdminSite(AdminSite):
-    site_header = 'linkding administration'
-    site_title = 'linkding Admin'
+    site_header = "linkding administration"
+    site_title = "linkding Admin"
 
 
 class AdminBookmark(admin.ModelAdmin):
-    list_display = ('resolved_title', 'url', 'is_archived', 'owner', 'date_added')
-    search_fields = ('title', 'description', 'website_title', 'website_description', 'url', 'tags__name')
-    list_filter = ('owner__username', 'is_archived', 'unread', 'tags',)
-    ordering = ('-date_added',)
-    actions = ['delete_selected_bookmarks', 'archive_selected_bookmarks', 'unarchive_selected_bookmarks', 'mark_as_read', 'mark_as_unread']
+    list_display = ("resolved_title", "url", "is_archived", "owner", "date_added")
+    search_fields = (
+        "title",
+        "description",
+        "website_title",
+        "website_description",
+        "url",
+        "tags__name",
+    )
+    list_filter = (
+        "owner__username",
+        "is_archived",
+        "unread",
+        "tags",
+    )
+    ordering = ("-date_added",)
+    actions = [
+        "delete_selected_bookmarks",
+        "archive_selected_bookmarks",
+        "unarchive_selected_bookmarks",
+        "mark_as_read",
+        "mark_as_unread",
+    ]
 
     def get_actions(self, request):
         actions = super().get_actions(request)
         # Remove default delete action, which gets replaced by delete_selected_bookmarks below
         # The default action shows a confirmation page which can fail in production when selecting all bookmarks and the
         # number of objects to delete exceeds the value in DATA_UPLOAD_MAX_NUMBER_FIELDS (1000 by default)
-        del actions['delete_selected']
+        del actions["delete_selected"]
         return actions
 
     def delete_selected_bookmarks(self, request, queryset: QuerySet):
         bookmarks_count = queryset.count()
         for bookmark in queryset:
             bookmark.delete()
-        self.message_user(request, ngettext(
-            '%d bookmark was successfully deleted.',
-            '%d bookmarks were successfully deleted.',
+        self.message_user(
+            request,
+            ngettext(
+                "%d bookmark was successfully deleted.",
+                "%d bookmarks were successfully deleted.",
                 bookmarks_count,
-        ) % bookmarks_count, messages.SUCCESS)
+            )
+            % bookmarks_count,
+            messages.SUCCESS,
+        )
 
     def archive_selected_bookmarks(self, request, queryset: QuerySet):
         for bookmark in queryset:
             archive_bookmark(bookmark)
         bookmarks_count = queryset.count()
-        self.message_user(request, ngettext(
-            '%d bookmark was successfully archived.',
-            '%d bookmarks were successfully archived.',
+        self.message_user(
+            request,
+            ngettext(
+                "%d bookmark was successfully archived.",
+                "%d bookmarks were successfully archived.",
                 bookmarks_count,
-        ) % bookmarks_count, messages.SUCCESS)
+            )
+            % bookmarks_count,
+            messages.SUCCESS,
+        )
 
     def unarchive_selected_bookmarks(self, request, queryset: QuerySet):
         for bookmark in queryset:
             unarchive_bookmark(bookmark)
         bookmarks_count = queryset.count()
-        self.message_user(request, ngettext(
-            '%d bookmark was successfully unarchived.',
-            '%d bookmarks were successfully unarchived.',
+        self.message_user(
+            request,
+            ngettext(
+                "%d bookmark was successfully unarchived.",
+                "%d bookmarks were successfully unarchived.",
                 bookmarks_count,
-        ) % bookmarks_count, messages.SUCCESS)
+            )
+            % bookmarks_count,
+            messages.SUCCESS,
+        )
 
     def mark_as_read(self, request, queryset: QuerySet):
         bookmarks_count = queryset.count()
         queryset.update(unread=False)
-        self.message_user(request, ngettext(
-            '%d bookmark marked as read.',
-            '%d bookmarks marked as read.',
+        self.message_user(
+            request,
+            ngettext(
+                "%d bookmark marked as read.",
+                "%d bookmarks marked as read.",
                 bookmarks_count,
-        ) % bookmarks_count, messages.SUCCESS)
+            )
+            % bookmarks_count,
+            messages.SUCCESS,
+        )
 
     def mark_as_unread(self, request, queryset: QuerySet):
         bookmarks_count = queryset.count()
         queryset.update(unread=True)
-        self.message_user(request, ngettext(
-            '%d bookmark marked as unread.',
-            '%d bookmarks marked as unread.',
+        self.message_user(
+            request,
+            ngettext(
+                "%d bookmark marked as unread.",
+                "%d bookmarks marked as unread.",
                 bookmarks_count,
-        ) % bookmarks_count, messages.SUCCESS)
+            )
+            % bookmarks_count,
+            messages.SUCCESS,
+        )
 
 
 class AdminTag(admin.ModelAdmin):
-    list_display = ('name', 'bookmarks_count', 'owner', 'date_added')
-    search_fields = ('name', 'owner__username')
-    list_filter = ('owner__username',)
-    ordering = ('-date_added',)
-    actions = ['delete_unused_tags']
+    list_display = ("name", "bookmarks_count", "owner", "date_added")
+    search_fields = ("name", "owner__username")
+    list_filter = ("owner__username",)
+    ordering = ("-date_added",)
+    actions = ["delete_unused_tags"]
 
     def get_queryset(self, request):
         queryset = super().get_queryset(request)
@@ -97,7 +140,7 @@ class AdminTag(admin.ModelAdmin):
     def bookmarks_count(self, obj):
         return obj.bookmarks_count
 
-    bookmarks_count.admin_order_field = 'bookmarks_count'
+    bookmarks_count.admin_order_field = "bookmarks_count"
 
     def delete_unused_tags(self, request, queryset: QuerySet):
         unused_tags = queryset.filter(bookmark__isnull=True)
@@ -106,22 +149,32 @@ class AdminTag(admin.ModelAdmin):
             tag.delete()
 
         if unused_tags_count > 0:
-            self.message_user(request, ngettext(
-                '%d unused tag was successfully deleted.',
-                '%d unused tags were successfully deleted.',
+            self.message_user(
+                request,
+                ngettext(
+                    "%d unused tag was successfully deleted.",
+                    "%d unused tags were successfully deleted.",
                     unused_tags_count,
-            ) % unused_tags_count, messages.SUCCESS)
+                )
+                % unused_tags_count,
+                messages.SUCCESS,
+            )
         else:
-            self.message_user(request, gettext(
-                'There were no unused tags in the selection',
-            ), messages.SUCCESS)
+            self.message_user(
+                request,
+                gettext(
+                    "There were no unused tags in the selection",
+                ),
+                messages.SUCCESS,
+            )
 
 
 class AdminUserProfileInline(admin.StackedInline):
     model = UserProfile
     can_delete = False
-    verbose_name_plural = 'Profile'
-    fk_name = 'user'
+    verbose_name_plural = "Profile"
+    fk_name = "user"
+    readonly_fields = ("search_preferences",)
 
 
 class AdminCustomUser(UserAdmin):
@@ -134,15 +187,15 @@ class AdminCustomUser(UserAdmin):
 
 
 class AdminToast(admin.ModelAdmin):
-    list_display = ('key', 'message', 'owner', 'acknowledged')
-    search_fields = ('key', 'message')
-    list_filter = ('owner__username',)
+    list_display = ("key", "message", "owner", "acknowledged")
+    search_fields = ("key", "message")
+    list_filter = ("owner__username",)
 
 
 class AdminFeedToken(admin.ModelAdmin):
-    list_display = ('key', 'user')
-    search_fields = ['key']
-    list_filter = ('user__username',)
+    list_display = ("key", "user")
+    search_fields = ["key"]
+    list_filter = ("user__username",)
 
 
 linkding_admin_site = LinkdingAdminSite()

bookmarks/api/routes.py

@@ -5,18 +5,28 @@ from rest_framework.response import Response
 from rest_framework.routers import DefaultRouter
 
 from bookmarks import queries
-from bookmarks.api.serializers import BookmarkSerializer, TagSerializer
-from bookmarks.models import Bookmark, BookmarkFilters, Tag, User
-from bookmarks.services.bookmarks import archive_bookmark, unarchive_bookmark, website_loader
+from bookmarks.api.serializers import (
+    BookmarkSerializer,
+    TagSerializer,
+    UserProfileSerializer,
+)
+from bookmarks.models import Bookmark, BookmarkSearch, Tag, User
+from bookmarks.services.bookmarks import (
+    archive_bookmark,
+    unarchive_bookmark,
+    website_loader,
+)
 from bookmarks.services.website_loader import WebsiteMetadata
 
 
-class BookmarkViewSet(viewsets.GenericViewSet,
+class BookmarkViewSet(
+    viewsets.GenericViewSet,
     mixins.ListModelMixin,
     mixins.RetrieveModelMixin,
     mixins.CreateModelMixin,
     mixins.UpdateModelMixin,
-                      mixins.DestroyModelMixin):
+    mixins.DestroyModelMixin,
+):
     serializer_class = BookmarkSerializer
 
     def get_permissions(self):
@@ -24,7 +34,7 @@ class BookmarkViewSet(viewsets.GenericViewSet,
         # The shared action should still filter bookmarks so that
         # unauthenticated users only see bookmarks from users that have public
         # sharing explicitly enabled
-        if self.action == 'shared':
+        if self.action == "shared":
             return [AllowAny()]
 
         # Otherwise use default permissions which should require authentication
@@ -33,71 +43,79 @@ class BookmarkViewSet(viewsets.GenericViewSet,
     def get_queryset(self):
         user = self.request.user
         # For list action, use query set that applies search and tag projections
-        if self.action == 'list':
-            query_string = self.request.GET.get('q')
-            return queries.query_bookmarks(user, user.profile, query_string)
+        if self.action == "list":
+            search = BookmarkSearch.from_request(self.request.GET)
+            return queries.query_bookmarks(user, user.profile, search)
 
         # For single entity actions use default query set without projections
         return Bookmark.objects.all().filter(owner=user)
 
     def get_serializer_context(self):
-        return {'user': self.request.user}
+        return {"user": self.request.user}
 
-    @action(methods=['get'], detail=False)
+    @action(methods=["get"], detail=False)
     def archived(self, request):
         user = request.user
-        query_string = request.GET.get('q')
-        query_set = queries.query_archived_bookmarks(user, user.profile, query_string)
+        search = BookmarkSearch.from_request(request.GET)
+        query_set = queries.query_archived_bookmarks(user, user.profile, search)
         page = self.paginate_queryset(query_set)
         serializer = self.get_serializer_class()
         data = serializer(page, many=True).data
         return self.get_paginated_response(data)
 
-    @action(methods=['get'], detail=False)
+    @action(methods=["get"], detail=False)
     def shared(self, request):
-        filters = BookmarkFilters(request)
-        user = User.objects.filter(username=filters.user).first()
+        search = BookmarkSearch.from_request(request.GET)
+        user = User.objects.filter(username=search.user).first()
         public_only = not request.user.is_authenticated
-        query_set = queries.query_shared_bookmarks(user, request.user_profile, filters.query, public_only)
+        query_set = queries.query_shared_bookmarks(
+            user, request.user_profile, search, public_only
+        )
         page = self.paginate_queryset(query_set)
         serializer = self.get_serializer_class()
         data = serializer(page, many=True).data
         return self.get_paginated_response(data)
 
-    @action(methods=['post'], detail=True)
+    @action(methods=["post"], detail=True)
     def archive(self, request, pk):
         bookmark = self.get_object()
         archive_bookmark(bookmark)
         return Response(status=status.HTTP_204_NO_CONTENT)
 
-    @action(methods=['post'], detail=True)
+    @action(methods=["post"], detail=True)
     def unarchive(self, request, pk):
         bookmark = self.get_object()
         unarchive_bookmark(bookmark)
         return Response(status=status.HTTP_204_NO_CONTENT)
 
-    @action(methods=['get'], detail=False)
+    @action(methods=["get"], detail=False)
     def check(self, request):
-        url = request.GET.get('url')
+        url = request.GET.get("url")
         bookmark = Bookmark.objects.filter(owner=request.user, url=url).first()
-        existing_bookmark_data = self.get_serializer(bookmark).data if bookmark else None
+        existing_bookmark_data = (
+            self.get_serializer(bookmark).data if bookmark else None
+        )
 
         # Either return metadata from existing bookmark, or scrape from URL
         if bookmark:
-            metadata = WebsiteMetadata(url, bookmark.website_title, bookmark.website_description)
+            metadata = WebsiteMetadata(
+                url, bookmark.website_title, bookmark.website_description
+            )
         else:
             metadata = website_loader.load_website_metadata(url)
 
-        return Response({
-            'bookmark': existing_bookmark_data,
-            'metadata': metadata.to_dict()
-        }, status=status.HTTP_200_OK)
+        return Response(
+            {"bookmark": existing_bookmark_data, "metadata": metadata.to_dict()},
+            status=status.HTTP_200_OK,
+        )
 
 
-class TagViewSet(viewsets.GenericViewSet,
+class TagViewSet(
+    viewsets.GenericViewSet,
     mixins.ListModelMixin,
     mixins.RetrieveModelMixin,
-                 mixins.CreateModelMixin):
+    mixins.CreateModelMixin,
+):
     serializer_class = TagSerializer
 
     def get_queryset(self):
@@ -105,9 +123,16 @@ class TagViewSet(viewsets.GenericViewSet,
         return Tag.objects.all().filter(owner=user)
 
     def get_serializer_context(self):
-        return {'user': self.request.user}
+        return {"user": self.request.user}
+
+
+class UserViewSet(viewsets.GenericViewSet):
+    @action(methods=["get"], detail=False)
+    def profile(self, request):
+        return Response(UserProfileSerializer(request.user.profile).data)
 
 
 router = DefaultRouter()
-router.register(r'bookmarks', BookmarkViewSet, basename='bookmark')
-router.register(r'tags', TagViewSet, basename='tag')
+router.register(r"bookmarks", BookmarkViewSet, basename="bookmark")
+router.register(r"tags", TagViewSet, basename="tag")
+router.register(r"user", UserViewSet, basename="user")

bookmarks/api/serializers.py

@@ -2,7 +2,7 @@ from django.db.models import prefetch_related_objects
 from rest_framework import serializers
 from rest_framework.serializers import ListSerializer
 
-from bookmarks.models import Bookmark, Tag, build_tag_string
+from bookmarks.models import Bookmark, Tag, build_tag_string, UserProfile
 from bookmarks.services.bookmarks import create_bookmark, update_bookmark
 from bookmarks.services.tags import get_or_create_tag
 
@@ -14,7 +14,7 @@ class TagListField(serializers.ListField):
 class BookmarkListSerializer(ListSerializer):
     def to_representation(self, data):
         # Prefetch nested relations to avoid n+1 queries
-        prefetch_related_objects(data, 'tags')
+        prefetch_related_objects(data, "tags")
 
         return super().to_representation(data)
 
@@ -23,32 +23,32 @@ class BookmarkSerializer(serializers.ModelSerializer):
     class Meta:
         model = Bookmark
         fields = [
-            'id',
-            'url',
-            'title',
-            'description',
-            'notes',
-            'website_title',
-            'website_description',
-            'is_archived',
-            'unread',
-            'shared',
-            'tag_names',
-            'date_added',
-            'date_modified'
+            "id",
+            "url",
+            "title",
+            "description",
+            "notes",
+            "website_title",
+            "website_description",
+            "is_archived",
+            "unread",
+            "shared",
+            "tag_names",
+            "date_added",
+            "date_modified",
         ]
         read_only_fields = [
-            'website_title',
-            'website_description',
-            'date_added',
-            'date_modified'
+            "website_title",
+            "website_description",
+            "date_added",
+            "date_modified",
         ]
         list_serializer_class = BookmarkListSerializer
 
     # Override optional char fields to provide default value
-    title = serializers.CharField(required=False, allow_blank=True, default='')
-    description = serializers.CharField(required=False, allow_blank=True, default='')
-    notes = serializers.CharField(required=False, allow_blank=True, default='')
+    title = serializers.CharField(required=False, allow_blank=True, default="")
+    description = serializers.CharField(required=False, allow_blank=True, default="")
+    notes = serializers.CharField(required=False, allow_blank=True, default="")
     is_archived = serializers.BooleanField(required=False, default=False)
     unread = serializers.BooleanField(required=False, default=False)
     shared = serializers.BooleanField(required=False, default=False)
@@ -57,35 +57,53 @@ class BookmarkSerializer(serializers.ModelSerializer):
 
     def create(self, validated_data):
         bookmark = Bookmark()
-        bookmark.url = validated_data['url']
-        bookmark.title = validated_data['title']
-        bookmark.description = validated_data['description']
-        bookmark.notes = validated_data['notes']
-        bookmark.is_archived = validated_data['is_archived']
-        bookmark.unread = validated_data['unread']
-        bookmark.shared = validated_data['shared']
-        tag_string = build_tag_string(validated_data['tag_names'])
-        return create_bookmark(bookmark, tag_string, self.context['user'])
+        bookmark.url = validated_data["url"]
+        bookmark.title = validated_data["title"]
+        bookmark.description = validated_data["description"]
+        bookmark.notes = validated_data["notes"]
+        bookmark.is_archived = validated_data["is_archived"]
+        bookmark.unread = validated_data["unread"]
+        bookmark.shared = validated_data["shared"]
+        tag_string = build_tag_string(validated_data["tag_names"])
+        return create_bookmark(bookmark, tag_string, self.context["user"])
 
     def update(self, instance: Bookmark, validated_data):
         # Update fields if they were provided in the payload
-        for key in ['url', 'title', 'description', 'notes', 'unread', 'shared']:
+        for key in ["url", "title", "description", "notes", "unread", "shared"]:
             if key in validated_data:
                 setattr(instance, key, validated_data[key])
 
         # Use tag string from payload, or use bookmark's current tags as fallback
         tag_string = build_tag_string(instance.tag_names)
-        if 'tag_names' in validated_data:
-            tag_string = build_tag_string(validated_data['tag_names'])
+        if "tag_names" in validated_data:
+            tag_string = build_tag_string(validated_data["tag_names"])
 
-        return update_bookmark(instance, tag_string, self.context['user'])
+        return update_bookmark(instance, tag_string, self.context["user"])
 
 
 class TagSerializer(serializers.ModelSerializer):
     class Meta:
         model = Tag
-        fields = ['id', 'name', 'date_added']
-        read_only_fields = ['date_added']
+        fields = ["id", "name", "date_added"]
+        read_only_fields = ["date_added"]
 
     def create(self, validated_data):
-        return get_or_create_tag(validated_data['name'], self.context['user'])
+        return get_or_create_tag(validated_data["name"], self.context["user"])
+
+
+class UserProfileSerializer(serializers.ModelSerializer):
+    class Meta:
+        model = UserProfile
+        fields = [
+            "theme",
+            "bookmark_date_display",
+            "bookmark_link_target",
+            "web_archive_integration",
+            "tag_search",
+            "enable_sharing",
+            "enable_public_sharing",
+            "enable_favicons",
+            "display_url",
+            "permanent_notes",
+            "search_preferences",
+        ]

bookmarks/apps.py

@@ -2,7 +2,7 @@ from django.apps import AppConfig
 
 
 class BookmarksConfig(AppConfig):
-    name = 'bookmarks'
+    name = "bookmarks"
 
     def ready(self):
         # Register signal handlers

bookmarks/context_processors.py

@@ -1,32 +1,36 @@
 from bookmarks import queries
-from bookmarks.models import Toast
+from bookmarks.models import BookmarkSearch, Toast
 from bookmarks import utils
 
 
 def toasts(request):
     user = request.user
-    toast_messages = Toast.objects.filter(owner=user, acknowledged=False) if user.is_authenticated else []
+    toast_messages = (
+        Toast.objects.filter(owner=user, acknowledged=False)
+        if user.is_authenticated
+        else []
+    )
     has_toasts = len(toast_messages) > 0
 
     return {
-        'has_toasts': has_toasts,
-        'toast_messages': toast_messages,
+        "has_toasts": has_toasts,
+        "toast_messages": toast_messages,
     }
 
 
 def public_shares(request):
     # Only check for public shares for anonymous users
     if not request.user.is_authenticated:
-        query_set = queries.query_shared_bookmarks(None, request.user_profile, '', True)
+        query_set = queries.query_shared_bookmarks(
+            None, request.user_profile, BookmarkSearch(), True
+        )
         has_public_shares = query_set.count() > 0
         return {
-            'has_public_shares': has_public_shares,
+            "has_public_shares": has_public_shares,
         }
 
     return {}
 
 
 def app_version(request):
-    return {
-        'app_version': utils.app_version
-    }
+    return {"app_version": utils.app_version}

bookmarks/e2e/e2e_test_bookmark_form.py

@@ -6,38 +6,54 @@ from bookmarks.e2e.helpers import LinkdingE2ETestCase
 
 class BookmarkFormE2ETestCase(LinkdingE2ETestCase):
     def test_create_should_check_for_existing_bookmark(self):
-        existing_bookmark = self.setup_bookmark(title='Existing title',
-                                                description='Existing description',
-                                                notes='Existing notes',
-                                                tags=[self.setup_tag(name='tag1'), self.setup_tag(name='tag2')],
-                                                website_title='Existing website title',
-                                                website_description='Existing website description',
-                                                unread=True)
-        tag_names = ' '.join(existing_bookmark.tag_names)
+        existing_bookmark = self.setup_bookmark(
+            title="Existing title",
+            description="Existing description",
+            notes="Existing notes",
+            tags=[self.setup_tag(name="tag1"), self.setup_tag(name="tag2")],
+            website_title="Existing website title",
+            website_description="Existing website description",
+            unread=True,
+        )
+        tag_names = " ".join(existing_bookmark.tag_names)
 
         with sync_playwright() as p:
             browser = self.setup_browser(p)
             page = browser.new_page()
-            page.goto(self.live_server_url + reverse('bookmarks:new'))
+            page.goto(self.live_server_url + reverse("bookmarks:new"))
 
             # Enter bookmarked URL
-            page.get_by_label('URL').fill(existing_bookmark.url)
+            page.get_by_label("URL").fill(existing_bookmark.url)
             # Already bookmarked hint should be visible
-            page.get_by_text('This URL is already bookmarked.').wait_for(timeout=2000)
+            page.get_by_text("This URL is already bookmarked.").wait_for(timeout=2000)
             # Form should be pre-filled with data from existing bookmark
-            self.assertEqual(existing_bookmark.title, page.get_by_label('Title').input_value())
-            self.assertEqual(existing_bookmark.description, page.get_by_label('Description').input_value())
-            self.assertEqual(existing_bookmark.notes, page.get_by_label('Notes').input_value())
-            self.assertEqual(existing_bookmark.website_title, page.get_by_label('Title').get_attribute('placeholder'))
-            self.assertEqual(existing_bookmark.website_description,
-                             page.get_by_label('Description').get_attribute('placeholder'))
-            self.assertEqual(tag_names, page.get_by_label('Tags').input_value())
-            self.assertTrue(tag_names, page.get_by_label('Mark as unread').is_checked())
+            self.assertEqual(
+                existing_bookmark.title, page.get_by_label("Title").input_value()
+            )
+            self.assertEqual(
+                existing_bookmark.description,
+                page.get_by_label("Description").input_value(),
+            )
+            self.assertEqual(
+                existing_bookmark.notes, page.get_by_label("Notes").input_value()
+            )
+            self.assertEqual(
+                existing_bookmark.website_title,
+                page.get_by_label("Title").get_attribute("placeholder"),
+            )
+            self.assertEqual(
+                existing_bookmark.website_description,
+                page.get_by_label("Description").get_attribute("placeholder"),
+            )
+            self.assertEqual(tag_names, page.get_by_label("Tags").input_value())
+            self.assertTrue(tag_names, page.get_by_label("Mark as unread").is_checked())
 
             # Enter non-bookmarked URL
-            page.get_by_label('URL').fill('https://example.com/unknown')
+            page.get_by_label("URL").fill("https://example.com/unknown")
             # Already bookmarked hint should be hidden
-            page.get_by_text('This URL is already bookmarked.').wait_for(state='hidden', timeout=2000)
+            page.get_by_text("This URL is already bookmarked.").wait_for(
+                state="hidden", timeout=2000
+            )
 
             browser.close()
 
@@ -47,21 +63,25 @@ class BookmarkFormE2ETestCase(LinkdingE2ETestCase):
         with sync_playwright() as p:
             browser = self.setup_browser(p)
             page = browser.new_page()
-            page.goto(self.live_server_url + reverse('bookmarks:edit', args=[bookmark.id]))
+            page.goto(
+                self.live_server_url + reverse("bookmarks:edit", args=[bookmark.id])
+            )
 
             page.wait_for_timeout(timeout=1000)
-            page.get_by_text('This URL is already bookmarked.').wait_for(state='hidden')
+            page.get_by_text("This URL is already bookmarked.").wait_for(state="hidden")
 
     def test_enter_url_of_existing_bookmark_should_show_notes(self):
-        bookmark = self.setup_bookmark(notes='Existing notes', description='Existing description')
+        bookmark = self.setup_bookmark(
+            notes="Existing notes", description="Existing description"
+        )
 
         with sync_playwright() as p:
             browser = self.setup_browser(p)
             page = browser.new_page()
-            page.goto(self.live_server_url + reverse('bookmarks:new'))
+            page.goto(self.live_server_url + reverse("bookmarks:new"))
 
-            details = page.locator('details.notes')
-            expect(details).not_to_have_attribute('open', value='')
+            details = page.locator("details.notes")
+            expect(details).not_to_have_attribute("open", value="")
 
-            page.get_by_label('URL').fill(bookmark.url)
-            expect(details).to_have_attribute('open', value='')
+            page.get_by_label("URL").fill(bookmark.url)
+            expect(details).to_have_attribute("open", value="")

bookmarks/e2e/e2e_test_bookmark_item.py

@@ -9,15 +9,15 @@ from bookmarks.e2e.helpers import LinkdingE2ETestCase
 class BookmarkItemE2ETestCase(LinkdingE2ETestCase):
     @skip("Fails in CI, needs investigation")
     def test_toggle_notes_should_show_hide_notes(self):
-        bookmark = self.setup_bookmark(notes='Test notes')
+        bookmark = self.setup_bookmark(notes="Test notes")
 
         with sync_playwright() as p:
-            page = self.open(reverse('bookmarks:index'), p)
+            page = self.open(reverse("bookmarks:index"), p)
 
-            notes = self.locate_bookmark(bookmark.title).locator('.notes')
+            notes = self.locate_bookmark(bookmark.title).locator(".notes")
             expect(notes).to_be_hidden()
 
-            toggle_notes = page.locator('li button.toggle-notes')
+            toggle_notes = page.locator("li button.toggle-notes")
             toggle_notes.click()
             expect(notes).to_be_visible()
 

bookmarks/e2e/e2e_test_bookmark_page_bulk_edit.py

@@ -0,0 +1,320 @@
+from django.urls import reverse
+from playwright.sync_api import sync_playwright, expect
+
+from bookmarks.e2e.helpers import LinkdingE2ETestCase
+from bookmarks.models import Bookmark
+
+
+class BookmarkPagePartialUpdatesE2ETestCase(LinkdingE2ETestCase):
+    def setup_test_data(self):
+        self.setup_numbered_bookmarks(50)
+        self.setup_numbered_bookmarks(50, archived=True)
+        self.setup_numbered_bookmarks(50, prefix="foo")
+        self.setup_numbered_bookmarks(50, archived=True, prefix="foo")
+
+        self.assertEqual(
+            50,
+            Bookmark.objects.filter(
+                is_archived=False, title__startswith="Bookmark"
+            ).count(),
+        )
+        self.assertEqual(
+            50,
+            Bookmark.objects.filter(
+                is_archived=True, title__startswith="Archived Bookmark"
+            ).count(),
+        )
+        self.assertEqual(
+            50,
+            Bookmark.objects.filter(is_archived=False, title__startswith="foo").count(),
+        )
+        self.assertEqual(
+            50,
+            Bookmark.objects.filter(is_archived=True, title__startswith="foo").count(),
+        )
+
+    def test_active_bookmarks_bulk_select_across(self):
+        self.setup_test_data()
+
+        with sync_playwright() as p:
+            self.open(reverse("bookmarks:index"), p)
+
+            self.locate_bulk_edit_toggle().click()
+            self.locate_bulk_edit_select_all().click()
+            self.locate_bulk_edit_select_across().click()
+
+            self.select_bulk_action("Delete")
+            self.locate_bulk_edit_bar().get_by_text("Execute").click()
+            self.locate_bulk_edit_bar().get_by_text("Confirm").click()
+
+        self.assertEqual(
+            0,
+            Bookmark.objects.filter(
+                is_archived=False, title__startswith="Bookmark"
+            ).count(),
+        )
+        self.assertEqual(
+            50,
+            Bookmark.objects.filter(
+                is_archived=True, title__startswith="Archived Bookmark"
+            ).count(),
+        )
+        self.assertEqual(
+            0,
+            Bookmark.objects.filter(is_archived=False, title__startswith="foo").count(),
+        )
+        self.assertEqual(
+            50,
+            Bookmark.objects.filter(is_archived=True, title__startswith="foo").count(),
+        )
+
+    def test_archived_bookmarks_bulk_select_across(self):
+        self.setup_test_data()
+
+        with sync_playwright() as p:
+            self.open(reverse("bookmarks:archived"), p)
+
+            self.locate_bulk_edit_toggle().click()
+            self.locate_bulk_edit_select_all().click()
+            self.locate_bulk_edit_select_across().click()
+
+            self.select_bulk_action("Delete")
+            self.locate_bulk_edit_bar().get_by_text("Execute").click()
+            self.locate_bulk_edit_bar().get_by_text("Confirm").click()
+
+        self.assertEqual(
+            50,
+            Bookmark.objects.filter(
+                is_archived=False, title__startswith="Bookmark"
+            ).count(),
+        )
+        self.assertEqual(
+            0,
+            Bookmark.objects.filter(
+                is_archived=True, title__startswith="Archived Bookmark"
+            ).count(),
+        )
+        self.assertEqual(
+            50,
+            Bookmark.objects.filter(is_archived=False, title__startswith="foo").count(),
+        )
+        self.assertEqual(
+            0,
+            Bookmark.objects.filter(is_archived=True, title__startswith="foo").count(),
+        )
+
+    def test_active_bookmarks_bulk_select_across_respects_query(self):
+        self.setup_test_data()
+
+        with sync_playwright() as p:
+            self.open(reverse("bookmarks:index") + "?q=foo", p)
+
+            self.locate_bulk_edit_toggle().click()
+            self.locate_bulk_edit_select_all().click()
+            self.locate_bulk_edit_select_across().click()
+
+            self.select_bulk_action("Delete")
+            self.locate_bulk_edit_bar().get_by_text("Execute").click()
+            self.locate_bulk_edit_bar().get_by_text("Confirm").click()
+
+        self.assertEqual(
+            50,
+            Bookmark.objects.filter(
+                is_archived=False, title__startswith="Bookmark"
+            ).count(),
+        )
+        self.assertEqual(
+            50,
+            Bookmark.objects.filter(
+                is_archived=True, title__startswith="Archived Bookmark"
+            ).count(),
+        )
+        self.assertEqual(
+            0,
+            Bookmark.objects.filter(is_archived=False, title__startswith="foo").count(),
+        )
+        self.assertEqual(
+            50,
+            Bookmark.objects.filter(is_archived=True, title__startswith="foo").count(),
+        )
+
+    def test_archived_bookmarks_bulk_select_across_respects_query(self):
+        self.setup_test_data()
+
+        with sync_playwright() as p:
+            self.open(reverse("bookmarks:archived") + "?q=foo", p)
+
+            self.locate_bulk_edit_toggle().click()
+            self.locate_bulk_edit_select_all().click()
+            self.locate_bulk_edit_select_across().click()
+
+            self.select_bulk_action("Delete")
+            self.locate_bulk_edit_bar().get_by_text("Execute").click()
+            self.locate_bulk_edit_bar().get_by_text("Confirm").click()
+
+        self.assertEqual(
+            50,
+            Bookmark.objects.filter(
+                is_archived=False, title__startswith="Bookmark"
+            ).count(),
+        )
+        self.assertEqual(
+            50,
+            Bookmark.objects.filter(
+                is_archived=True, title__startswith="Archived Bookmark"
+            ).count(),
+        )
+        self.assertEqual(
+            50,
+            Bookmark.objects.filter(is_archived=False, title__startswith="foo").count(),
+        )
+        self.assertEqual(
+            0,
+            Bookmark.objects.filter(is_archived=True, title__startswith="foo").count(),
+        )
+
+    def test_select_all_toggles_all_checkboxes(self):
+        self.setup_numbered_bookmarks(5)
+
+        with sync_playwright() as p:
+            url = reverse("bookmarks:index")
+            page = self.open(url, p)
+
+            self.locate_bulk_edit_toggle().click()
+
+            checkboxes = page.locator("label[ld-bulk-edit-checkbox] input")
+            self.assertEqual(6, checkboxes.count())
+            for i in range(checkboxes.count()):
+                expect(checkboxes.nth(i)).not_to_be_checked()
+
+            self.locate_bulk_edit_select_all().click()
+
+            for i in range(checkboxes.count()):
+                expect(checkboxes.nth(i)).to_be_checked()
+
+            self.locate_bulk_edit_select_all().click()
+
+            for i in range(checkboxes.count()):
+                expect(checkboxes.nth(i)).not_to_be_checked()
+
+    def test_select_all_shows_select_across(self):
+        self.setup_numbered_bookmarks(5)
+
+        with sync_playwright() as p:
+            url = reverse("bookmarks:index")
+            self.open(url, p)
+
+            self.locate_bulk_edit_toggle().click()
+
+            expect(self.locate_bulk_edit_select_across()).not_to_be_visible()
+
+            self.locate_bulk_edit_select_all().click()
+            expect(self.locate_bulk_edit_select_across()).to_be_visible()
+
+            self.locate_bulk_edit_select_all().click()
+            expect(self.locate_bulk_edit_select_across()).not_to_be_visible()
+
+    def test_select_across_is_unchecked_when_toggling_all(self):
+        self.setup_numbered_bookmarks(5)
+
+        with sync_playwright() as p:
+            url = reverse("bookmarks:index")
+            self.open(url, p)
+
+            self.locate_bulk_edit_toggle().click()
+
+            # Show select across, check it
+            self.locate_bulk_edit_select_all().click()
+            self.locate_bulk_edit_select_across().click()
+            expect(self.locate_bulk_edit_select_across()).to_be_checked()
+
+            # Hide select across by toggling select all
+            self.locate_bulk_edit_select_all().click()
+            expect(self.locate_bulk_edit_select_across()).not_to_be_visible()
+
+            # Show select across again, verify it is unchecked
+            self.locate_bulk_edit_select_all().click()
+            expect(self.locate_bulk_edit_select_across()).not_to_be_checked()
+
+    def test_select_across_is_unchecked_when_toggling_bookmark(self):
+        self.setup_numbered_bookmarks(5)
+
+        with sync_playwright() as p:
+            url = reverse("bookmarks:index")
+            self.open(url, p)
+
+            self.locate_bulk_edit_toggle().click()
+
+            # Show select across, check it
+            self.locate_bulk_edit_select_all().click()
+            self.locate_bulk_edit_select_across().click()
+            expect(self.locate_bulk_edit_select_across()).to_be_checked()
+
+            # Hide select across by toggling a single bookmark
+            self.locate_bookmark("Bookmark 1").locator(
+                "label[ld-bulk-edit-checkbox]"
+            ).click()
+            expect(self.locate_bulk_edit_select_across()).not_to_be_visible()
+
+            # Show select across again, verify it is unchecked
+            self.locate_bookmark("Bookmark 1").locator(
+                "label[ld-bulk-edit-checkbox]"
+            ).click()
+            expect(self.locate_bulk_edit_select_across()).not_to_be_checked()
+
+    def test_execute_resets_all_checkboxes(self):
+        self.setup_numbered_bookmarks(100)
+
+        with sync_playwright() as p:
+            url = reverse("bookmarks:index")
+            page = self.open(url, p)
+
+            # Select all bookmarks, enable select across
+            self.locate_bulk_edit_toggle().click()
+            self.locate_bulk_edit_select_all().click()
+            self.locate_bulk_edit_select_across().click()
+
+            # Get reference for bookmark list
+            bookmark_list = page.locator("ul[ld-bookmark-list]")
+
+            # Execute bulk action
+            self.select_bulk_action("Mark as unread")
+            self.locate_bulk_edit_bar().get_by_text("Execute").click()
+            self.locate_bulk_edit_bar().get_by_text("Confirm").click()
+
+            # Wait until bookmark list is updated (old reference becomes invisible)
+            expect(bookmark_list).not_to_be_visible()
+
+            # Verify bulk edit checkboxes are reset
+            checkboxes = page.locator("label[ld-bulk-edit-checkbox] input")
+            self.assertEqual(31, checkboxes.count())
+            for i in range(checkboxes.count()):
+                expect(checkboxes.nth(i)).not_to_be_checked()
+
+            # Toggle select all and verify select across is reset
+            self.locate_bulk_edit_select_all().click()
+            expect(self.locate_bulk_edit_select_across()).not_to_be_checked()
+
+    def test_update_select_across_bookmark_count(self):
+        self.setup_numbered_bookmarks(100)
+
+        with sync_playwright() as p:
+            url = reverse("bookmarks:index")
+            self.open(url, p)
+
+            self.locate_bulk_edit_toggle().click()
+            self.locate_bulk_edit_select_all().click()
+
+            expect(
+                self.locate_bulk_edit_bar().get_by_text("All pages (100 bookmarks)")
+            ).to_be_visible()
+
+            self.select_bulk_action("Delete")
+            self.locate_bulk_edit_bar().get_by_text("Execute").click()
+            self.locate_bulk_edit_bar().get_by_text("Confirm").click()
+
+            self.locate_bulk_edit_select_all().click()
+
+            expect(
+                self.locate_bulk_edit_bar().get_by_text("All pages (70 bookmarks)")
+            ).to_be_visible()

bookmarks/e2e/e2e_test_bookmark_page_partial_updates.py

@@ -16,13 +16,15 @@ class BookmarkPagePartialUpdatesE2ETestCase(LinkdingE2ETestCase):
         # verify correct data is loaded on update
         self.setup_numbered_bookmarks(3, with_tags=True)
         self.setup_numbered_bookmarks(3, with_tags=True, archived=True)
-        self.setup_numbered_bookmarks(3,
+        self.setup_numbered_bookmarks(
+            3,
             shared=True,
             prefix="Joe's Bookmark",
-                                      user=self.setup_user(enable_sharing=True))
+            user=self.setup_user(enable_sharing=True),
+        )
 
     def assertVisibleBookmarks(self, titles: List[str]):
-        bookmark_tags = self.page.locator('li[ld-bookmark-item]')
+        bookmark_tags = self.page.locator("li[ld-bookmark-item]")
         expect(bookmark_tags).to_have_count(len(titles))
 
         for title in titles:
@@ -30,7 +32,7 @@ class BookmarkPagePartialUpdatesE2ETestCase(LinkdingE2ETestCase):
             expect(matching_tag).to_be_visible()
 
     def assertVisibleTags(self, titles: List[str]):
-        tag_tags = self.page.locator('.tag-cloud .unselected-tags a')
+        tag_tags = self.page.locator(".tag-cloud .unselected-tags a")
         expect(tag_tags).to_have_count(len(titles))
 
         for title in titles:
@@ -38,50 +40,67 @@ class BookmarkPagePartialUpdatesE2ETestCase(LinkdingE2ETestCase):
             expect(matching_tag).to_be_visible()
 
     def test_partial_update_respects_query(self):
-        self.setup_numbered_bookmarks(5, prefix='foo')
-        self.setup_numbered_bookmarks(5, prefix='bar')
+        self.setup_numbered_bookmarks(5, prefix="foo")
+        self.setup_numbered_bookmarks(5, prefix="bar")
 
         with sync_playwright() as p:
-            url = reverse('bookmarks:index') + '?q=foo'
+            url = reverse("bookmarks:index") + "?q=foo"
             self.open(url, p)
 
-            self.assertVisibleBookmarks(['foo 1', 'foo 2', 'foo 3', 'foo 4', 'foo 5'])
+            self.assertVisibleBookmarks(["foo 1", "foo 2", "foo 3", "foo 4", "foo 5"])
 
-            self.locate_bookmark('foo 2').get_by_text('Archive').click()
-            self.assertVisibleBookmarks(['foo 1', 'foo 3', 'foo 4', 'foo 5'])
+            self.locate_bookmark("foo 2").get_by_text("Archive").click()
+            self.assertVisibleBookmarks(["foo 1", "foo 3", "foo 4", "foo 5"])
+
+    def test_partial_update_respects_sort(self):
+        self.setup_numbered_bookmarks(5, prefix="foo")
+
+        with sync_playwright() as p:
+            url = reverse("bookmarks:index") + "?sort=title_asc"
+            page = self.open(url, p)
+
+            first_item = page.locator("li[ld-bookmark-item]").first
+            expect(first_item).to_contain_text("foo 1")
+
+            first_item.get_by_text("Archive").click()
+
+            first_item = page.locator("li[ld-bookmark-item]").first
+            expect(first_item).to_contain_text("foo 2")
 
     def test_partial_update_respects_page(self):
         # add a suffix, otherwise 'foo 1' also matches 'foo 10'
-        self.setup_numbered_bookmarks(50, prefix='foo', suffix='-')
+        self.setup_numbered_bookmarks(50, prefix="foo", suffix="-")
 
         with sync_playwright() as p:
-            url = reverse('bookmarks:index') + '?q=foo&page=2'
+            url = reverse("bookmarks:index") + "?q=foo&page=2"
             self.open(url, p)
 
             # with descending sort, page two has 'foo 1' to 'foo 20'
-            expected_titles = [f'foo {i}-' for i in range(1, 21)]
+            expected_titles = [f"foo {i}-" for i in range(1, 21)]
             self.assertVisibleBookmarks(expected_titles)
 
-            self.locate_bookmark('foo 20-').get_by_text('Archive').click()
+            self.locate_bookmark("foo 20-").get_by_text("Archive").click()
 
-            expected_titles = [f'foo {i}-' for i in range(1, 20)]
+            expected_titles = [f"foo {i}-" for i in range(1, 20)]
             self.assertVisibleBookmarks(expected_titles)
 
     def test_multiple_partial_updates(self):
         self.setup_numbered_bookmarks(5)
 
         with sync_playwright() as p:
-            url = reverse('bookmarks:index')
+            url = reverse("bookmarks:index")
             self.open(url, p)
 
-            self.locate_bookmark('Bookmark 1').get_by_text('Archive').click()
-            self.assertVisibleBookmarks(['Bookmark 2', 'Bookmark 3', 'Bookmark 4', 'Bookmark 5'])
+            self.locate_bookmark("Bookmark 1").get_by_text("Archive").click()
+            self.assertVisibleBookmarks(
+                ["Bookmark 2", "Bookmark 3", "Bookmark 4", "Bookmark 5"]
+            )
 
-            self.locate_bookmark('Bookmark 2').get_by_text('Archive').click()
-            self.assertVisibleBookmarks(['Bookmark 3', 'Bookmark 4', 'Bookmark 5'])
+            self.locate_bookmark("Bookmark 2").get_by_text("Archive").click()
+            self.assertVisibleBookmarks(["Bookmark 3", "Bookmark 4", "Bookmark 5"])
 
-            self.locate_bookmark('Bookmark 3').get_by_text('Archive').click()
-            self.assertVisibleBookmarks(['Bookmark 4', 'Bookmark 5'])
+            self.locate_bookmark("Bookmark 3").get_by_text("Archive").click()
+            self.assertVisibleBookmarks(["Bookmark 4", "Bookmark 5"])
 
             self.assertReloads(0)
 
@@ -89,164 +108,201 @@ class BookmarkPagePartialUpdatesE2ETestCase(LinkdingE2ETestCase):
         self.setup_fixture()
 
         with sync_playwright() as p:
-            self.open(reverse('bookmarks:index'), p)
+            self.open(reverse("bookmarks:index"), p)
 
-            self.locate_bookmark('Bookmark 2').get_by_text('Archive').click()
+            self.locate_bookmark("Bookmark 2").get_by_text("Archive").click()
 
-            self.assertVisibleBookmarks(['Bookmark 1', 'Bookmark 3'])
-            self.assertVisibleTags(['Tag 1', 'Tag 3'])
+            self.assertVisibleBookmarks(["Bookmark 1", "Bookmark 3"])
+            self.assertVisibleTags(["Tag 1", "Tag 3"])
             self.assertReloads(0)
 
     def test_active_bookmarks_partial_update_on_delete(self):
         self.setup_fixture()
 
         with sync_playwright() as p:
-            self.open(reverse('bookmarks:index'), p)
+            self.open(reverse("bookmarks:index"), p)
 
-            self.locate_bookmark('Bookmark 2').get_by_text('Remove').click()
-            self.locate_bookmark('Bookmark 2').get_by_text('Confirm').click()
+            self.locate_bookmark("Bookmark 2").get_by_text("Remove").click()
+            self.locate_bookmark("Bookmark 2").get_by_text("Confirm").click()
 
-            self.assertVisibleBookmarks(['Bookmark 1', 'Bookmark 3'])
-            self.assertVisibleTags(['Tag 1', 'Tag 3'])
+            self.assertVisibleBookmarks(["Bookmark 1", "Bookmark 3"])
+            self.assertVisibleTags(["Tag 1", "Tag 3"])
             self.assertReloads(0)
 
     def test_active_bookmarks_partial_update_on_mark_as_read(self):
         self.setup_fixture()
-        bookmark2 = self.get_numbered_bookmark('Bookmark 2')
+        bookmark2 = self.get_numbered_bookmark("Bookmark 2")
         bookmark2.unread = True
         bookmark2.save()
 
         with sync_playwright() as p:
-            self.open(reverse('bookmarks:index'), p)
+            self.open(reverse("bookmarks:index"), p)
 
-            expect(self.locate_bookmark('Bookmark 2').get_by_text('Bookmark 2')).to_have_class('text-italic')
-            self.locate_bookmark('Bookmark 2').get_by_text('Mark as read').click()
+            expect(self.locate_bookmark("Bookmark 2")).to_have_class("unread")
+            self.locate_bookmark("Bookmark 2").get_by_text("Unread").click()
+            self.locate_bookmark("Bookmark 2").get_by_text("Yes").click()
 
-            expect(self.locate_bookmark('Bookmark 2').get_by_text('Bookmark 2')).not_to_have_class('text-italic')
+            expect(self.locate_bookmark("Bookmark 2")).not_to_have_class("unread")
+            self.assertReloads(0)
+
+    def test_active_bookmarks_partial_update_on_unshare(self):
+        self.setup_fixture()
+        bookmark2 = self.get_numbered_bookmark("Bookmark 2")
+        bookmark2.shared = True
+        bookmark2.save()
+
+        with sync_playwright() as p:
+            self.open(reverse("bookmarks:index"), p)
+
+            expect(self.locate_bookmark("Bookmark 2")).to_have_class("shared")
+            self.locate_bookmark("Bookmark 2").get_by_text("Shared").click()
+            self.locate_bookmark("Bookmark 2").get_by_text("Yes").click()
+
+            expect(self.locate_bookmark("Bookmark 2")).not_to_have_class("shared")
             self.assertReloads(0)
 
     def test_active_bookmarks_partial_update_on_bulk_archive(self):
         self.setup_fixture()
 
         with sync_playwright() as p:
-            self.open(reverse('bookmarks:index'), p)
+            self.open(reverse("bookmarks:index"), p)
 
             self.locate_bulk_edit_toggle().click()
-            self.locate_bookmark('Bookmark 2').locator('label[ld-bulk-edit-checkbox]').click()
-            self.locate_bulk_edit_bar().get_by_text('Archive').click()
-            self.locate_bulk_edit_bar().get_by_text('Confirm').click()
+            self.locate_bookmark("Bookmark 2").locator(
+                "label[ld-bulk-edit-checkbox]"
+            ).click()
+            self.select_bulk_action("Archive")
+            self.locate_bulk_edit_bar().get_by_text("Execute").click()
+            self.locate_bulk_edit_bar().get_by_text("Confirm").click()
 
-            self.assertVisibleBookmarks(['Bookmark 1', 'Bookmark 3'])
-            self.assertVisibleTags(['Tag 1', 'Tag 3'])
+            self.assertVisibleBookmarks(["Bookmark 1", "Bookmark 3"])
+            self.assertVisibleTags(["Tag 1", "Tag 3"])
             self.assertReloads(0)
 
     def test_active_bookmarks_partial_update_on_bulk_delete(self):
         self.setup_fixture()
 
         with sync_playwright() as p:
-            self.open(reverse('bookmarks:index'), p)
+            self.open(reverse("bookmarks:index"), p)
 
             self.locate_bulk_edit_toggle().click()
-            self.locate_bookmark('Bookmark 2').locator('label[ld-bulk-edit-checkbox]').click()
-            self.locate_bulk_edit_bar().get_by_text('Delete').click()
-            self.locate_bulk_edit_bar().get_by_text('Confirm').click()
+            self.locate_bookmark("Bookmark 2").locator(
+                "label[ld-bulk-edit-checkbox]"
+            ).click()
+            self.select_bulk_action("Delete")
+            self.locate_bulk_edit_bar().get_by_text("Execute").click()
+            self.locate_bulk_edit_bar().get_by_text("Confirm").click()
 
-            self.assertVisibleBookmarks(['Bookmark 1', 'Bookmark 3'])
-            self.assertVisibleTags(['Tag 1', 'Tag 3'])
+            self.assertVisibleBookmarks(["Bookmark 1", "Bookmark 3"])
+            self.assertVisibleTags(["Tag 1", "Tag 3"])
             self.assertReloads(0)
 
     def test_archived_bookmarks_partial_update_on_unarchive(self):
         self.setup_fixture()
 
         with sync_playwright() as p:
-            self.open(reverse('bookmarks:archived'), p)
+            self.open(reverse("bookmarks:archived"), p)
 
-            self.locate_bookmark('Archived Bookmark 2').get_by_text('Unarchive').click()
+            self.locate_bookmark("Archived Bookmark 2").get_by_text("Unarchive").click()
 
-            self.assertVisibleBookmarks(['Archived Bookmark 1', 'Archived Bookmark 3'])
-            self.assertVisibleTags(['Archived Tag 1', 'Archived Tag 3'])
+            self.assertVisibleBookmarks(["Archived Bookmark 1", "Archived Bookmark 3"])
+            self.assertVisibleTags(["Archived Tag 1", "Archived Tag 3"])
             self.assertReloads(0)
 
     def test_archived_bookmarks_partial_update_on_delete(self):
         self.setup_fixture()
 
         with sync_playwright() as p:
-            self.open(reverse('bookmarks:archived'), p)
+            self.open(reverse("bookmarks:archived"), p)
 
-            self.locate_bookmark('Archived Bookmark 2').get_by_text('Remove').click()
-            self.locate_bookmark('Archived Bookmark 2').get_by_text('Confirm').click()
+            self.locate_bookmark("Archived Bookmark 2").get_by_text("Remove").click()
+            self.locate_bookmark("Archived Bookmark 2").get_by_text("Confirm").click()
 
-            self.assertVisibleBookmarks(['Archived Bookmark 1', 'Archived Bookmark 3'])
-            self.assertVisibleTags(['Archived Tag 1', 'Archived Tag 3'])
+            self.assertVisibleBookmarks(["Archived Bookmark 1", "Archived Bookmark 3"])
+            self.assertVisibleTags(["Archived Tag 1", "Archived Tag 3"])
             self.assertReloads(0)
 
-    def test_archived_bookmarks_partial_update_on_bulk_archive(self):
+    def test_archived_bookmarks_partial_update_on_bulk_unarchive(self):
         self.setup_fixture()
 
         with sync_playwright() as p:
-            self.open(reverse('bookmarks:archived'), p)
+            self.open(reverse("bookmarks:archived"), p)
 
             self.locate_bulk_edit_toggle().click()
-            self.locate_bookmark('Archived Bookmark 2').locator('label[ld-bulk-edit-checkbox]').click()
-            self.locate_bulk_edit_bar().get_by_text('Archive').click()
-            self.locate_bulk_edit_bar().get_by_text('Confirm').click()
+            self.locate_bookmark("Archived Bookmark 2").locator(
+                "label[ld-bulk-edit-checkbox]"
+            ).click()
+            self.select_bulk_action("Unarchive")
+            self.locate_bulk_edit_bar().get_by_text("Execute").click()
+            self.locate_bulk_edit_bar().get_by_text("Confirm").click()
 
-            self.assertVisibleBookmarks(['Archived Bookmark 1', 'Archived Bookmark 3'])
-            self.assertVisibleTags(['Archived Tag 1', 'Archived Tag 3'])
+            self.assertVisibleBookmarks(["Archived Bookmark 1", "Archived Bookmark 3"])
+            self.assertVisibleTags(["Archived Tag 1", "Archived Tag 3"])
             self.assertReloads(0)
 
     def test_archived_bookmarks_partial_update_on_bulk_delete(self):
         self.setup_fixture()
 
         with sync_playwright() as p:
-            self.open(reverse('bookmarks:archived'), p)
+            self.open(reverse("bookmarks:archived"), p)
 
             self.locate_bulk_edit_toggle().click()
-            self.locate_bookmark('Archived Bookmark 2').locator('label[ld-bulk-edit-checkbox]').click()
-            self.locate_bulk_edit_bar().get_by_text('Delete').click()
-            self.locate_bulk_edit_bar().get_by_text('Confirm').click()
+            self.locate_bookmark("Archived Bookmark 2").locator(
+                "label[ld-bulk-edit-checkbox]"
+            ).click()
+            self.select_bulk_action("Delete")
+            self.locate_bulk_edit_bar().get_by_text("Execute").click()
+            self.locate_bulk_edit_bar().get_by_text("Confirm").click()
 
-            self.assertVisibleBookmarks(['Archived Bookmark 1', 'Archived Bookmark 3'])
-            self.assertVisibleTags(['Archived Tag 1', 'Archived Tag 3'])
+            self.assertVisibleBookmarks(["Archived Bookmark 1", "Archived Bookmark 3"])
+            self.assertVisibleTags(["Archived Tag 1", "Archived Tag 3"])
             self.assertReloads(0)
 
     def test_shared_bookmarks_partial_update_on_unarchive(self):
         self.setup_fixture()
-        self.setup_numbered_bookmarks(3, shared=True, prefix="My Bookmark", with_tags=True)
+        self.setup_numbered_bookmarks(
+            3, shared=True, prefix="My Bookmark", with_tags=True
+        )
 
         with sync_playwright() as p:
-            self.open(reverse('bookmarks:shared'), p)
+            self.open(reverse("bookmarks:shared"), p)
 
-            self.locate_bookmark('My Bookmark 2').get_by_text('Archive').click()
+            self.locate_bookmark("My Bookmark 2").get_by_text("Archive").click()
 
             # Shared bookmarks page also shows archived bookmarks, though it probably shouldn't
-            self.assertVisibleBookmarks([
-                'My Bookmark 1',
-                'My Bookmark 2',
-                'My Bookmark 3',
+            self.assertVisibleBookmarks(
+                [
+                    "My Bookmark 1",
+                    "My Bookmark 2",
+                    "My Bookmark 3",
                     "Joe's Bookmark 1",
                     "Joe's Bookmark 2",
                     "Joe's Bookmark 3",
-            ])
-            self.assertVisibleTags(['Shared Tag 1', 'Shared Tag 2', 'Shared Tag 3'])
+                ]
+            )
+            self.assertVisibleTags(["Shared Tag 1", "Shared Tag 2", "Shared Tag 3"])
             self.assertReloads(0)
 
     def test_shared_bookmarks_partial_update_on_delete(self):
         self.setup_fixture()
-        self.setup_numbered_bookmarks(3, shared=True, prefix="My Bookmark", with_tags=True)
+        self.setup_numbered_bookmarks(
+            3, shared=True, prefix="My Bookmark", with_tags=True
+        )
 
         with sync_playwright() as p:
-            self.open(reverse('bookmarks:shared'), p)
+            self.open(reverse("bookmarks:shared"), p)
 
-            self.locate_bookmark('My Bookmark 2').get_by_text('Remove').click()
-            self.locate_bookmark('My Bookmark 2').get_by_text('Confirm').click()
+            self.locate_bookmark("My Bookmark 2").get_by_text("Remove").click()
+            self.locate_bookmark("My Bookmark 2").get_by_text("Confirm").click()
 
-            self.assertVisibleBookmarks([
-                'My Bookmark 1',
-                'My Bookmark 3',
+            self.assertVisibleBookmarks(
+                [
+                    "My Bookmark 1",
+                    "My Bookmark 3",
                     "Joe's Bookmark 1",
                     "Joe's Bookmark 2",
                     "Joe's Bookmark 3",
-            ])
-            self.assertVisibleTags(['Shared Tag 1', 'Shared Tag 3'])
+                ]
+            )
+            self.assertVisibleTags(["Shared Tag 1", "Shared Tag 3"])
             self.assertReloads(0)

bookmarks/e2e/e2e_test_global_shortcuts.py

@@ -9,11 +9,11 @@ class GlobalShortcutsE2ETestCase(LinkdingE2ETestCase):
         with sync_playwright() as p:
             browser = self.setup_browser(p)
             page = browser.new_page()
-            page.goto(self.live_server_url + reverse('bookmarks:index'))
+            page.goto(self.live_server_url + reverse("bookmarks:index"))
 
-            page.press('body', 's')
+            page.press("body", "s")
 
-            expect(page.get_by_placeholder('Search for words or #tags')).to_be_focused()
+            expect(page.get_by_placeholder("Search for words or #tags")).to_be_focused()
 
             browser.close()
 
@@ -21,10 +21,10 @@ class GlobalShortcutsE2ETestCase(LinkdingE2ETestCase):
         with sync_playwright() as p:
             browser = self.setup_browser(p)
             page = browser.new_page()
-            page.goto(self.live_server_url + reverse('bookmarks:index'))
+            page.goto(self.live_server_url + reverse("bookmarks:index"))
 
-            page.press('body', 'n')
+            page.press("body", "n")
 
-            expect(page).to_have_url(self.live_server_url + reverse('bookmarks:new'))
+            expect(page).to_have_url(self.live_server_url + reverse("bookmarks:new"))
 
             browser.close()

bookmarks/e2e/e2e_test_settings_general.py

@@ -9,12 +9,14 @@ class SettingsGeneralE2ETestCase(LinkdingE2ETestCase):
         with sync_playwright() as p:
             browser = self.setup_browser(p)
             page = browser.new_page()
-            page.goto(self.live_server_url + reverse('bookmarks:settings.general'))
+            page.goto(self.live_server_url + reverse("bookmarks:settings.general"))
 
-            enable_sharing = page.get_by_label('Enable bookmark sharing')
-            enable_sharing_label = page.get_by_text('Enable bookmark sharing')
-            enable_public_sharing = page.get_by_label('Enable public bookmark sharing')
-            enable_public_sharing_label = page.get_by_text('Enable public bookmark sharing')
+            enable_sharing = page.get_by_label("Enable bookmark sharing")
+            enable_sharing_label = page.get_by_text("Enable bookmark sharing")
+            enable_public_sharing = page.get_by_label("Enable public bookmark sharing")
+            enable_public_sharing_label = page.get_by_text(
+                "Enable public bookmark sharing"
+            )
 
             # Public sharing is disabled by default
             expect(enable_sharing).not_to_be_checked()

bookmarks/e2e/helpers.py

@@ -7,24 +7,28 @@ from bookmarks.tests.helpers import BookmarkFactoryMixin
 class LinkdingE2ETestCase(LiveServerTestCase, BookmarkFactoryMixin):
     def setUp(self) -> None:
         self.client.force_login(self.get_or_create_test_user())
-        self.cookie = self.client.cookies['sessionid']
+        self.cookie = self.client.cookies["sessionid"]
 
     def setup_browser(self, playwright) -> BrowserContext:
         browser = playwright.chromium.launch(headless=True)
         context = browser.new_context()
-        context.add_cookies([{
-            'name': 'sessionid',
-            'value': self.cookie.value,
-            'domain': self.live_server_url.replace('http:', ''),
-            'path': '/'
-        }])
+        context.add_cookies(
+            [
+                {
+                    "name": "sessionid",
+                    "value": self.cookie.value,
+                    "domain": self.live_server_url.replace("http:", ""),
+                    "path": "/",
+                }
+            ]
+        )
         return context
 
     def open(self, url: str, playwright: Playwright) -> Page:
         browser = self.setup_browser(playwright)
         self.page = browser.new_page()
         self.page.goto(self.live_server_url + url)
-        self.page.on('load', self.on_load)
+        self.page.on("load", self.on_load)
         self.num_loads = 0
         return self.page
 
@@ -35,11 +39,24 @@ class LinkdingE2ETestCase(LiveServerTestCase, BookmarkFactoryMixin):
         self.assertEqual(self.num_loads, count)
 
     def locate_bookmark(self, title: str):
-        bookmark_tags = self.page.locator('li[ld-bookmark-item]')
+        bookmark_tags = self.page.locator("li[ld-bookmark-item]")
         return bookmark_tags.filter(has_text=title)
 
     def locate_bulk_edit_bar(self):
-        return self.page.locator('.bulk-edit-bar')
+        return self.page.locator(".bulk-edit-bar")
+
+    def locate_bulk_edit_select_all(self):
+        return self.locate_bulk_edit_bar().locator("label[ld-bulk-edit-checkbox][all]")
+
+    def locate_bulk_edit_select_across(self):
+        return self.locate_bulk_edit_bar().locator("label.select-across")
 
     def locate_bulk_edit_toggle(self):
-        return self.page.get_by_title('Bulk edit')
+        return self.page.get_by_title("Bulk edit")
+
+    def select_bulk_action(self, value: str):
+        return (
+            self.locate_bulk_edit_bar()
+            .locator('select[name="bulk_action"]')
+            .select_option(value)
+        )

bookmarks/feeds.py

@@ -1,11 +1,12 @@
+import unicodedata
 from dataclasses import dataclass
 
 from django.contrib.syndication.views import Feed
 from django.db.models import QuerySet
 from django.urls import reverse
 
-from bookmarks.models import Bookmark, FeedToken
 from bookmarks import queries
+from bookmarks.models import Bookmark, BookmarkSearch, FeedToken
 
 
 @dataclass
@@ -14,18 +15,30 @@ class FeedContext:
     query_set: QuerySet[Bookmark]
 
 
+def sanitize(text: str):
+    if not text:
+        return ""
+    # remove control characters
+    valid_chars = ["\n", "\r", "\t"]
+    return "".join(
+        ch for ch in text if ch in valid_chars or unicodedata.category(ch)[0] != "C"
+    )
+
+
 class BaseBookmarksFeed(Feed):
     def get_object(self, request, feed_key: str):
         feed_token = FeedToken.objects.get(key__exact=feed_key)
-        query_string = request.GET.get('q')
-        query_set = queries.query_bookmarks(feed_token.user, feed_token.user.profile, query_string)
+        search = BookmarkSearch(q=request.GET.get("q", ""))
+        query_set = queries.query_bookmarks(
+            feed_token.user, feed_token.user.profile, search
+        )
         return FeedContext(feed_token, query_set)
 
     def item_title(self, item: Bookmark):
-        return item.resolved_title
+        return sanitize(item.resolved_title)
 
     def item_description(self, item: Bookmark):
-        return item.resolved_description
+        return sanitize(item.resolved_description)
 
     def item_link(self, item: Bookmark):
         return item.url
@@ -35,22 +48,22 @@ class BaseBookmarksFeed(Feed):
 
 
 class AllBookmarksFeed(BaseBookmarksFeed):
-    title = 'All bookmarks'
-    description = 'All bookmarks'
+    title = "All bookmarks"
+    description = "All bookmarks"
 
     def link(self, context: FeedContext):
-        return reverse('bookmarks:feeds.all', args=[context.feed_token.key])
+        return reverse("bookmarks:feeds.all", args=[context.feed_token.key])
 
     def items(self, context: FeedContext):
         return context.query_set
 
 
 class UnreadBookmarksFeed(BaseBookmarksFeed):
-    title = 'Unread bookmarks'
-    description = 'All unread bookmarks'
+    title = "Unread bookmarks"
+    description = "All unread bookmarks"
 
     def link(self, context: FeedContext):
-        return reverse('bookmarks:feeds.unread', args=[context.feed_token.key])
+        return reverse("bookmarks:feeds.unread", args=[context.feed_token.key])
 
     def items(self, context: FeedContext):
         return context.query_set.filter(unread=True)

bookmarks/frontend/api.js

@@ -3,10 +3,10 @@ export class ApiClient {
     this.baseUrl = baseUrl;
   }
 
-  listBookmarks(filters, options = { limit: 100, offset: 0, path: "" }) {
+  listBookmarks(search, options = { limit: 100, offset: 0, path: "" }) {
     const query = [`limit=${options.limit}`, `offset=${options.offset}`];
-    Object.keys(filters).forEach((key) => {
-      const value = filters[key];
+    Object.keys(search).forEach((key) => {
+      const value = search[key];
       if (value) {
         query.push(`${key}=${encodeURIComponent(value)}`);
       }

bookmarks/frontend/behaviors/bookmark-page.js

@@ -36,8 +36,18 @@ class BookmarkPage {
       swap(this.bookmarkList, bookmarkListHtml);
       swap(this.tagCloud, tagCloudHtml);
 
+      // Dispatch list updated event
+      const listElement = this.bookmarkList.querySelector(
+        "ul[data-bookmarks-total]",
+      );
+      const bookmarksTotal =
+        (listElement && listElement.dataset.bookmarksTotal) || 0;
+
       this.bookmarkList.dispatchEvent(
-        new CustomEvent("bookmark-list-updated", { bubbles: true }),
+        new CustomEvent("bookmark-list-updated", {
+          bubbles: true,
+          detail: { bookmarksTotal },
+        }),
       );
     });
   }
@@ -49,10 +59,18 @@ class BookmarkItem {
   constructor(element) {
     this.element = element;
 
+    // Toggle notes
     const notesToggle = element.querySelector(".toggle-notes");
     if (notesToggle) {
       notesToggle.addEventListener("click", this.onToggleNotes.bind(this));
     }
+
+    // Add tooltip to title if it is truncated
+    const titleAnchor = element.querySelector(".title > a");
+    const titleSpan = titleAnchor.querySelector("span");
+    if (titleSpan.offsetWidth > titleAnchor.offsetWidth) {
+      titleAnchor.dataset.tooltip = titleSpan.textContent;
+    }
   }
 
   onToggleNotes(event) {

bookmarks/frontend/behaviors/bulk-edit.js

@@ -4,6 +4,9 @@ class BulkEdit {
   constructor(element) {
     this.element = element;
     this.active = false;
+    this.actionSelect = element.querySelector("select[name='bulk_action']");
+    this.tagAutoComplete = element.querySelector(".tag-autocomplete");
+    this.selectAcross = element.querySelector("label.select-across");
 
     element.addEventListener(
       "bulk-edit-toggle-active",
@@ -21,6 +24,11 @@ class BulkEdit {
       "bookmark-list-updated",
       this.onListUpdated.bind(this),
     );
+
+    this.actionSelect.addEventListener(
+      "change",
+      this.onActionSelected.bind(this),
+    );
   }
 
   get allCheckbox() {
@@ -48,23 +56,56 @@ class BulkEdit {
   }
 
   onToggleBookmark() {
-    this.allCheckbox.checked = this.bookmarkCheckboxes.every((checkbox) => {
+    const allChecked = this.bookmarkCheckboxes.every((checkbox) => {
       return checkbox.checked;
     });
+    this.allCheckbox.checked = allChecked;
+    this.updateSelectAcross(allChecked);
   }
 
   onToggleAll() {
-    const checked = this.allCheckbox.checked;
+    const allChecked = this.allCheckbox.checked;
     this.bookmarkCheckboxes.forEach((checkbox) => {
-      checkbox.checked = checked;
+      checkbox.checked = allChecked;
     });
+    this.updateSelectAcross(allChecked);
   }
 
-  onListUpdated() {
+  onActionSelected() {
+    const action = this.actionSelect.value;
+
+    if (action === "bulk_tag" || action === "bulk_untag") {
+      this.tagAutoComplete.classList.remove("d-none");
+    } else {
+      this.tagAutoComplete.classList.add("d-none");
+    }
+  }
+
+  onListUpdated(event) {
+    // Reset checkbox states
+    this.reset();
+
+    // Update total number of bookmarks
+    const total = event.detail.bookmarksTotal;
+    const totalSpan = this.selectAcross.querySelector("span.total");
+    totalSpan.textContent = total;
+  }
+
+  updateSelectAcross(allChecked) {
+    if (allChecked) {
+      this.selectAcross.classList.remove("d-none");
+    } else {
+      this.selectAcross.classList.add("d-none");
+      this.selectAcross.querySelector("input").checked = false;
+    }
+  }
+
+  reset() {
     this.allCheckbox.checked = false;
     this.bookmarkCheckboxes.forEach((checkbox) => {
       checkbox.checked = false;
     });
+    this.updateSelectAcross(false);
   }
 }
 

bookmarks/frontend/behaviors/confirm-button.js

@@ -16,9 +16,31 @@ class ConfirmButtonBehavior {
   onClick(event) {
     event.preventDefault();
 
+    const container = document.createElement("span");
+    container.className = "confirmation";
+
+    const icon = this.button.getAttribute("confirm-icon");
+    if (icon) {
+      const iconElement = document.createElementNS(
+        "http://www.w3.org/2000/svg",
+        "svg",
+      );
+      iconElement.style.width = "16px";
+      iconElement.style.height = "16px";
+      iconElement.innerHTML = `<use xlink:href="#${icon}"></use>`;
+      container.append(iconElement);
+    }
+
+    const question = this.button.getAttribute("confirm-question");
+    if (question) {
+      const questionElement = document.createElement("span");
+      questionElement.innerText = question;
+      container.append(question);
+    }
+
     const cancelButton = document.createElement(this.button.nodeName);
     cancelButton.type = "button";
-    cancelButton.innerText = "Cancel";
+    cancelButton.innerText = question ? "No" : "Cancel";
     cancelButton.className = "btn btn-link btn-sm mr-1";
     cancelButton.addEventListener("click", this.reset.bind(this));
 
@@ -26,12 +48,10 @@ class ConfirmButtonBehavior {
     confirmButton.type = this.button.dataset.type;
     confirmButton.name = this.button.dataset.name;
     confirmButton.value = this.button.dataset.value;
-    confirmButton.innerText = "Confirm";
+    confirmButton.innerText = question ? "Yes" : "Confirm";
     confirmButton.className = "btn btn-link btn-sm";
     confirmButton.addEventListener("click", this.reset.bind(this));
 
-    const container = document.createElement("span");
-    container.className = "confirmation";
     container.append(cancelButton, confirmButton);
     this.container = container;
 

bookmarks/frontend/behaviors/dropdown.js

@@ -0,0 +1,36 @@
+import { registerBehavior } from "./index";
+
+class DropdownBehavior {
+  constructor(element) {
+    this.element = element;
+    this.opened = false;
+    this.onOutsideClick = this.onOutsideClick.bind(this);
+
+    const toggle = element.querySelector(".dropdown-toggle");
+    toggle.addEventListener("click", () => {
+      if (this.opened) {
+        this.close();
+      } else {
+        this.open();
+      }
+    });
+  }
+
+  open() {
+    this.element.classList.add("active");
+    document.addEventListener("click", this.onOutsideClick);
+  }
+
+  close() {
+    this.element.classList.remove("active");
+    document.removeEventListener("click", this.onOutsideClick);
+  }
+
+  onOutsideClick(event) {
+    if (!this.element.contains(event.target)) {
+      this.close();
+    }
+  }
+}
+
+registerBehavior("ld-dropdown", DropdownBehavior);

bookmarks/frontend/behaviors/modal.js

@@ -0,0 +1,65 @@
+import { registerBehavior } from "./index";
+
+class ModalBehavior {
+  constructor(element) {
+    const toggle = element;
+    toggle.addEventListener("click", this.onToggleClick.bind(this));
+    this.toggle = toggle;
+  }
+
+  onToggleClick() {
+    const contentSelector = this.toggle.getAttribute("modal-content");
+    const content = document.querySelector(contentSelector);
+    if (!content) {
+      return;
+    }
+
+    // Create modal
+    const modal = document.createElement("div");
+    modal.classList.add("modal", "active");
+    modal.innerHTML = `
+      <div class="modal-overlay" aria-label="Close"></div>
+      <div class="modal-container">
+        <div class="modal-header d-flex justify-between align-center">
+          <div class="modal-title h5">Tags</div>
+          <button class="btn btn-link close">
+          <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
+            <path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
+            <path d="M18 6l-12 12"></path>
+            <path d="M6 6l12 12"></path>
+          </svg>
+          </button>
+        </div>
+        <div class="modal-body">
+          <div class="content"></div>
+        </div>
+      </div>
+    `;
+
+    // Teleport content element
+    const contentOwner = content.parentElement;
+    const contentContainer = modal.querySelector(".content");
+    contentContainer.append(content);
+    this.content = content;
+    this.contentOwner = contentOwner;
+
+    // Register close handlers
+    const modalOverlay = modal.querySelector(".modal-overlay");
+    const closeButton = modal.querySelector(".btn.close");
+    modalOverlay.addEventListener("click", this.onClose.bind(this));
+    closeButton.addEventListener("click", this.onClose.bind(this));
+
+    document.body.append(modal);
+    this.modal = modal;
+  }
+
+  onClose() {
+    // Teleport content back
+    this.contentOwner.append(this.content);
+
+    // Remove modal
+    this.modal.remove();
+  }
+}
+
+registerBehavior("ld-modal", ModalBehavior);

bookmarks/frontend/behaviors/tag-autocomplete.js

@@ -14,12 +14,13 @@ class TagAutocomplete {
         id: element.id,
         name: element.name,
         value: element.value,
+        placeholder: element.getAttribute("placeholder") || "",
         apiClient: apiClient,
         variant: element.getAttribute("variant"),
       },
     });
 
-    element.replaceWith(wrapper);
+    element.replaceWith(wrapper.firstElementChild);
   }
 }
 

bookmarks/frontend/components/SearchAutoComplete.svelte

@@ -10,7 +10,8 @@
   export let tags;
   export let mode = '';
   export let apiClient;
-  export let filters;
+  export let search;
+  export let linkTarget = '_blank';
 
   let isFocus = false;
   let isOpen = false;
@@ -102,7 +103,7 @@
     }
 
     // Recent search suggestions
-    const search = searchHistory.getRecentSearches(value, 5).map(value => ({
+    const recentSearches = searchHistory.getRecentSearches(value, 5).map(value => ({
       type: 'search',
       index: nextIndex(),
       label: value,
@@ -114,11 +115,11 @@
 
     if (value && value.length >= 3) {
       const path = mode ? `/${mode}` : ''
-      const suggestionFilters = {
-        ...filters,
+      const suggestionSearch = {
+        ...search,
         q: value
       }
-      const fetchedBookmarks = await apiClient.listBookmarks(suggestionFilters, {limit: 5, offset: 0, path})
+      const fetchedBookmarks = await apiClient.listBookmarks(suggestionSearch, {limit: 5, offset: 0, path})
       bookmarks = fetchedBookmarks.map(bookmark => {
         const fullLabel = bookmark.title || bookmark.website_title || bookmark.url
         const label = clampText(fullLabel, 60)
@@ -131,7 +132,7 @@
       })
     }
 
-    updateSuggestions(search, bookmarks, tagSuggestions)
+    updateSuggestions(recentSearches, bookmarks, tagSuggestions)
 
     if (hasSuggestions()) {
       open()
@@ -142,17 +143,17 @@
 
   const debouncedLoadSuggestions = debounce(loadSuggestions)
 
-  function updateSuggestions(search, bookmarks, tagSuggestions) {
-    search = search || []
+  function updateSuggestions(recentSearches, bookmarks, tagSuggestions) {
+    recentSearches = recentSearches || []
     bookmarks = bookmarks || []
     tagSuggestions = tagSuggestions || []
     suggestions = {
-      search,
+      recentSearches,
       bookmarks,
       tags: tagSuggestions,
       total: [
         ...tagSuggestions,
-        ...search,
+        ...recentSearches,
         ...bookmarks,
       ]
     }
@@ -164,7 +165,7 @@
       close()
     }
     if (suggestion.type === 'bookmark') {
-      window.open(suggestion.bookmark.url, '_blank')
+      window.open(suggestion.bookmark.url, linkTarget)
       close()
     }
     if (suggestion.type === 'tag') {
@@ -209,26 +210,18 @@
     {#each suggestions.tags as suggestion}
       <li class="menu-item" class:selected={selectedIndex === suggestion.index}>
         <a href="#" on:mousedown|preventDefault={() => completeSuggestion(suggestion)}>
-          <div class="tile tile-centered">
-            <div class="tile-content">
           {suggestion.label}
-            </div>
-          </div>
         </a>
       </li>
     {/each}
 
-    {#if suggestions.search.length > 0}
+    {#if suggestions.recentSearches.length > 0}
       <li class="menu-item group-item">Recent Searches</li>
     {/if}
-    {#each suggestions.search as suggestion}
+    {#each suggestions.recentSearches as suggestion}
       <li class="menu-item" class:selected={selectedIndex === suggestion.index}>
         <a href="#" on:mousedown|preventDefault={() => completeSuggestion(suggestion)}>
-          <div class="tile tile-centered">
-            <div class="tile-content">
           {suggestion.label}
-            </div>
-          </div>
         </a>
       </li>
     {/each}
@@ -239,11 +232,7 @@
     {#each suggestions.bookmarks as suggestion}
       <li class="menu-item" class:selected={selectedIndex === suggestion.index}>
         <a href="#" on:mousedown|preventDefault={() => completeSuggestion(suggestion)}>
-          <div class="tile tile-centered">
-            <div class="tile-content">
           {suggestion.label}
-            </div>
-          </div>
         </a>
       </li>
     {/each}

bookmarks/frontend/components/TagAutocomplete.svelte

@@ -4,6 +4,7 @@
   export let id;
   export let name;
   export let value;
+  export let placeholder;
   export let apiClient;
   export let variant = 'default';
 
@@ -21,7 +22,7 @@
   async function init() {
     // For now we cache all tags on load as the template did before
     try {
-      tags = await apiClient.getTags({limit: 1000, offset: 0});
+      tags = await apiClient.getTags({limit: 5000, offset: 0});
       tags.sort((left, right) => left.name.toLowerCase().localeCompare(right.name.toLowerCase()))
     } catch (e) {
       console.warn('TagAutocomplete: Error loading tag list');
@@ -118,7 +119,7 @@
   <!-- autocomplete input container -->
   <div class="form-autocomplete-input form-input" class:is-focused={isFocus}>
     <!-- autocomplete real input box -->
-    <input id="{id}" name="{name}" value="{value ||''}" placeholder="&nbsp;"
+    <input id="{id}" name="{name}" value="{value ||''}" placeholder="{placeholder || ' '}"
            class="form-input" type="text" autocomplete="off" autocapitalize="off"
            on:input={handleInput} on:keydown={handleKeyDown}
            on:focus={handleFocus} on:blur={handleBlur}>
@@ -131,11 +132,7 @@
     {#each suggestions as tag,i}
       <li class="menu-item" class:selected={selectedIndex === i}>
         <a href="#" on:mousedown|preventDefault={() => complete(tag)}>
-          <div class="tile tile-centered">
-            <div class="tile-content">
           {tag.name}
-            </div>
-          </div>
         </a>
       </li>
     {/each}
@@ -156,6 +153,7 @@
     .form-autocomplete.small .form-autocomplete-input {
         height: 1.4rem;
         min-height: 1.4rem;
+        padding: 0.05rem 0.3rem;
     }
 
     .form-autocomplete.small .form-autocomplete-input input {

bookmarks/frontend/index.js

@@ -4,6 +4,8 @@ import { ApiClient } from "./api";
 import "./behaviors/bookmark-page";
 import "./behaviors/bulk-edit";
 import "./behaviors/confirm-button";
+import "./behaviors/dropdown";
+import "./behaviors/modal";
 import "./behaviors/global-shortcuts";
 import "./behaviors/tag-autocomplete";
 

bookmarks/management/commands/backup.py

@@ -0,0 +1,26 @@
+import sqlite3
+import os
+
+from django.core.management.base import BaseCommand
+
+
+class Command(BaseCommand):
+    help = "Creates a backup of the linkding database"
+
+    def add_arguments(self, parser):
+        parser.add_argument("destination", type=str, help="Backup file destination")
+
+    def handle(self, *args, **options):
+        destination = options["destination"]
+
+        def progress(status, remaining, total):
+            self.stdout.write(f"Copied {total-remaining} of {total} pages...")
+
+        source_db = sqlite3.connect(os.path.join("data", "db.sqlite3"))
+        backup_db = sqlite3.connect(destination)
+        with backup_db:
+            source_db.backup(backup_db, pages=50, progress=progress)
+        backup_db.close()
+        source_db.close()
+
+        self.stdout.write(self.style.SUCCESS(f"Backup created at {destination}"))

bookmarks/management/commands/create_initial_superuser.py

@@ -12,18 +12,20 @@ class Command(BaseCommand):
 
     def handle(self, *args, **options):
         User = get_user_model()
-        superuser_name = os.getenv('LD_SUPERUSER_NAME', None)
-        superuser_password = os.getenv('LD_SUPERUSER_PASSWORD', None)
+        superuser_name = os.getenv("LD_SUPERUSER_NAME", None)
+        superuser_password = os.getenv("LD_SUPERUSER_PASSWORD", None)
 
         # Skip if option is undefined
         if not superuser_name:
-            logger.info('Skip creating initial superuser, LD_SUPERUSER_NAME option is not defined')
+            logger.info(
+                "Skip creating initial superuser, LD_SUPERUSER_NAME option is not defined"
+            )
             return
 
         # Skip if user already exists
         user_exists = User.objects.filter(username=superuser_name).exists()
         if user_exists:
-            logger.info('Skip creating initial superuser, user already exists')
+            logger.info("Skip creating initial superuser, user already exists")
             return
 
         user = User(username=superuser_name, is_superuser=True, is_staff=True)
@@ -34,4 +36,4 @@ class Command(BaseCommand):
             user.set_unusable_password()
 
         user.save()
-        logger.info('Created initial superuser')
+        logger.info("Created initial superuser")

bookmarks/management/commands/enable_wal.py

@@ -11,14 +11,14 @@ class Command(BaseCommand):
     help = "Enable WAL journal mode when using an SQLite database"
 
     def handle(self, *args, **options):
-        if settings.DATABASES['default']['ENGINE'] != 'django.db.backends.sqlite3':
+        if not settings.USE_SQLITE:
             return
 
-        connection = connections['default']
+        connection = connections["default"]
         with connection.cursor() as cursor:
             cursor.execute("PRAGMA journal_mode")
             current_mode = cursor.fetchone()[0]
-            logger.info(f'Current journal mode: {current_mode}')
-            if current_mode != 'wal':
+            logger.info(f"Current journal mode: {current_mode}")
+            if current_mode != "wal":
                 cursor.execute("PRAGMA journal_mode=wal;")
-                logger.info('Switched to WAL journal mode')
+                logger.info("Switched to WAL journal mode")

bookmarks/management/commands/ensure_superuser.py

@@ -6,13 +6,15 @@ class Command(BaseCommand):
     help = "Creates an admin user non-interactively if it doesn't exist"
 
     def add_arguments(self, parser):
-        parser.add_argument('--username', help="Admin's username")
-        parser.add_argument('--email', help="Admin's email")
-        parser.add_argument('--password', help="Admin's password")
+        parser.add_argument("--username", help="Admin's username")
+        parser.add_argument("--email", help="Admin's email")
+        parser.add_argument("--password", help="Admin's password")
 
     def handle(self, *args, **options):
         User = get_user_model()
-        if not User.objects.filter(username=options['username']).exists():
-            User.objects.create_superuser(username=options['username'],
-                                          email=options['email'],
-                                          password=options['password'])
+        if not User.objects.filter(username=options["username"]).exists():
+            User.objects.create_superuser(
+                username=options["username"],
+                email=options["email"],
+                password=options["password"],
+            )

bookmarks/management/commands/generate_secret_key.py

@@ -0,0 +1,24 @@
+import logging
+import os
+
+from django.core.management.base import BaseCommand
+from django.core.management.utils import get_random_secret_key
+
+
+logger = logging.getLogger(__name__)
+
+
+class Command(BaseCommand):
+    help = "Generate secret key file if it does not exist"
+
+    def handle(self, *args, **options):
+        secret_key_file = os.path.join("data", "secretkey.txt")
+
+        if os.path.exists(secret_key_file):
+            logger.info(f"Secret key file already exists")
+            return
+
+        secret_key = get_random_secret_key()
+        with open(secret_key_file, "w") as f:
+            f.write(secret_key)
+        logger.info(f"Generated secret key file")

bookmarks/management/commands/import_netscape.py

@@ -5,15 +5,17 @@ from bookmarks.services.importer import import_netscape_html
 
 
 class Command(BaseCommand):
-    help = 'Import Netscape HTML bookmark file'
+    help = "Import Netscape HTML bookmark file"
 
     def add_arguments(self, parser):
-        parser.add_argument('file', type=str, help='Path to file')
-        parser.add_argument('user', type=str, help='Name of the user for which to import')
+        parser.add_argument("file", type=str, help="Path to file")
+        parser.add_argument(
+            "user", type=str, help="Name of the user for which to import"
+        )
 
     def handle(self, *args, **kwargs):
-        filepath = kwargs['file']
-        username = kwargs['user']
+        filepath = kwargs["file"]
+        username = kwargs["user"]
         with open(filepath) as html_file:
             html = html_file.read()
         user = User.objects.get(username=username)

bookmarks/migrations/0001_initial.py

@@ -15,19 +15,36 @@ class Migration(migrations.Migration):
 
     operations = [
         migrations.CreateModel(
-            name='Bookmark',
+            name="Bookmark",
             fields=[
-                ('id', models.AutoField(auto_created=True, primary_key=True, serialize=False, verbose_name='ID')),
-                ('url', models.URLField()),
-                ('title', models.CharField(max_length=512)),
-                ('description', models.TextField()),
-                ('website_title', models.CharField(blank=True, max_length=512, null=True)),
-                ('website_description', models.TextField(blank=True, null=True)),
-                ('unread', models.BooleanField(default=True)),
-                ('date_added', models.DateTimeField()),
-                ('date_modified', models.DateTimeField()),
-                ('date_accessed', models.DateTimeField(blank=True, null=True)),
-                ('owner', models.ForeignKey(on_delete=django.db.models.deletion.CASCADE, to=settings.AUTH_USER_MODEL)),
+                (
+                    "id",
+                    models.AutoField(
+                        auto_created=True,
+                        primary_key=True,
+                        serialize=False,
+                        verbose_name="ID",
+                    ),
+                ),
+                ("url", models.URLField()),
+                ("title", models.CharField(max_length=512)),
+                ("description", models.TextField()),
+                (
+                    "website_title",
+                    models.CharField(blank=True, max_length=512, null=True),
+                ),
+                ("website_description", models.TextField(blank=True, null=True)),
+                ("unread", models.BooleanField(default=True)),
+                ("date_added", models.DateTimeField()),
+                ("date_modified", models.DateTimeField()),
+                ("date_accessed", models.DateTimeField(blank=True, null=True)),
+                (
+                    "owner",
+                    models.ForeignKey(
+                        on_delete=django.db.models.deletion.CASCADE,
+                        to=settings.AUTH_USER_MODEL,
+                    ),
+                ),
             ],
         ),
     ]

bookmarks/migrations/0002_auto_20190629_2303.py

@@ -9,22 +9,36 @@ class Migration(migrations.Migration):
 
     dependencies = [
         migrations.swappable_dependency(settings.AUTH_USER_MODEL),
-        ('bookmarks', '0001_initial'),
+        ("bookmarks", "0001_initial"),
     ]
 
     operations = [
         migrations.CreateModel(
-            name='Tag',
+            name="Tag",
             fields=[
-                ('id', models.AutoField(auto_created=True, primary_key=True, serialize=False, verbose_name='ID')),
-                ('name', models.CharField(max_length=64)),
-                ('date_added', models.DateTimeField()),
-                ('owner', models.ForeignKey(on_delete=django.db.models.deletion.CASCADE, to=settings.AUTH_USER_MODEL)),
+                (
+                    "id",
+                    models.AutoField(
+                        auto_created=True,
+                        primary_key=True,
+                        serialize=False,
+                        verbose_name="ID",
+                    ),
+                ),
+                ("name", models.CharField(max_length=64)),
+                ("date_added", models.DateTimeField()),
+                (
+                    "owner",
+                    models.ForeignKey(
+                        on_delete=django.db.models.deletion.CASCADE,
+                        to=settings.AUTH_USER_MODEL,
+                    ),
+                ),
             ],
         ),
         migrations.AddField(
-            model_name='bookmark',
-            name='tags',
-            field=models.ManyToManyField(to='bookmarks.Tag'),
+            model_name="bookmark",
+            name="tags",
+            field=models.ManyToManyField(to="bookmarks.Tag"),
         ),
     ]

bookmarks/migrations/0003_auto_20200913_0656.py

@@ -6,13 +6,13 @@ from django.db import migrations, models
 class Migration(migrations.Migration):
 
     dependencies = [
-        ('bookmarks', '0002_auto_20190629_2303'),
+        ("bookmarks", "0002_auto_20190629_2303"),
     ]
 
     operations = [
         migrations.AlterField(
-            model_name='bookmark',
-            name='url',
+            model_name="bookmark",
+            name="url",
             field=models.URLField(max_length=2048),
         ),
     ]

bookmarks/migrations/0004_auto_20200926_1028.py

@@ -6,18 +6,18 @@ from django.db import migrations, models
 class Migration(migrations.Migration):
 
     dependencies = [
-        ('bookmarks', '0003_auto_20200913_0656'),
+        ("bookmarks", "0003_auto_20200913_0656"),
     ]
 
     operations = [
         migrations.AlterField(
-            model_name='bookmark',
-            name='description',
+            model_name="bookmark",
+            name="description",
             field=models.TextField(blank=True),
         ),
         migrations.AlterField(
-            model_name='bookmark',
-            name='title',
+            model_name="bookmark",
+            name="title",
             field=models.CharField(blank=True, max_length=512),
         ),
     ]

bookmarks/migrations/0005_auto_20210103_1212.py

@@ -7,13 +7,16 @@ from django.db import migrations, models
 class Migration(migrations.Migration):
 
     dependencies = [
-        ('bookmarks', '0004_auto_20200926_1028'),
+        ("bookmarks", "0004_auto_20200926_1028"),
     ]
 
     operations = [
         migrations.AlterField(
-            model_name='bookmark',
-            name='url',
-            field=models.CharField(max_length=2048, validators=[bookmarks.validators.BookmarkURLValidator()]),
+            model_name="bookmark",
+            name="url",
+            field=models.CharField(
+                max_length=2048,
+                validators=[bookmarks.validators.BookmarkURLValidator()],
+            ),
         ),
     ]

bookmarks/migrations/0006_bookmark_is_archived.py

@@ -6,13 +6,13 @@ from django.db import migrations, models
 class Migration(migrations.Migration):
 
     dependencies = [
-        ('bookmarks', '0005_auto_20210103_1212'),
+        ("bookmarks", "0005_auto_20210103_1212"),
     ]
 
     operations = [
         migrations.AddField(
-            model_name='bookmark',
-            name='is_archived',
+            model_name="bookmark",
+            name="is_archived",
             field=models.BooleanField(default=False),
         ),
     ]

bookmarks/migrations/0007_userprofile.py

@@ -6,8 +6,8 @@ import django.db.models.deletion
 
 
 def forwards(apps, schema_editor):
-    User = apps.get_model('auth', 'User')
-    UserProfile = apps.get_model('bookmarks', 'UserProfile')
+    User = apps.get_model("auth", "User")
+    UserProfile = apps.get_model("bookmarks", "UserProfile")
     for user in User.objects.all():
         try:
             if user.profile:
@@ -24,19 +24,42 @@ def reverse(apps, schema_editor):
 class Migration(migrations.Migration):
     dependencies = [
         migrations.swappable_dependency(settings.AUTH_USER_MODEL),
-        ('bookmarks', '0006_bookmark_is_archived'),
+        ("bookmarks", "0006_bookmark_is_archived"),
     ]
 
     operations = [
         migrations.CreateModel(
-            name='UserProfile',
+            name="UserProfile",
             fields=[
-                ('id', models.AutoField(auto_created=True, primary_key=True, serialize=False, verbose_name='ID')),
-                ('theme',
-                 models.CharField(choices=[('auto', 'Auto'), ('light', 'Light'), ('dark', 'Dark')], default='auto',
-                                  max_length=10)),
-                ('user', models.OneToOneField(on_delete=django.db.models.deletion.CASCADE, related_name='profile',
-                                              to=settings.AUTH_USER_MODEL)),
+                (
+                    "id",
+                    models.AutoField(
+                        auto_created=True,
+                        primary_key=True,
+                        serialize=False,
+                        verbose_name="ID",
+                    ),
+                ),
+                (
+                    "theme",
+                    models.CharField(
+                        choices=[
+                            ("auto", "Auto"),
+                            ("light", "Light"),
+                            ("dark", "Dark"),
+                        ],
+                        default="auto",
+                        max_length=10,
+                    ),
+                ),
+                (
+                    "user",
+                    models.OneToOneField(
+                        on_delete=django.db.models.deletion.CASCADE,
+                        related_name="profile",
+                        to=settings.AUTH_USER_MODEL,
+                    ),
+                ),
             ],
         ),
         migrations.RunPython(forwards, reverse),

bookmarks/migrations/0008_userprofile_bookmark_date_display.py

@@ -6,13 +6,21 @@ from django.db import migrations, models
 class Migration(migrations.Migration):
 
     dependencies = [
-        ('bookmarks', '0007_userprofile'),
+        ("bookmarks", "0007_userprofile"),
     ]
 
     operations = [
         migrations.AddField(
-            model_name='userprofile',
-            name='bookmark_date_display',
-            field=models.CharField(choices=[('relative', 'Relative'), ('absolute', 'Absolute'), ('hidden', 'Hidden')], default='relative', max_length=10),
+            model_name="userprofile",
+            name="bookmark_date_display",
+            field=models.CharField(
+                choices=[
+                    ("relative", "Relative"),
+                    ("absolute", "Absolute"),
+                    ("hidden", "Hidden"),
+                ],
+                default="relative",
+                max_length=10,
+            ),
         ),
     ]

bookmarks/migrations/0009_bookmark_web_archive_snapshot_url.py

@@ -6,13 +6,13 @@ from django.db import migrations, models
 class Migration(migrations.Migration):
 
     dependencies = [
-        ('bookmarks', '0008_userprofile_bookmark_date_display'),
+        ("bookmarks", "0008_userprofile_bookmark_date_display"),
     ]
 
     operations = [
         migrations.AddField(
-            model_name='bookmark',
-            name='web_archive_snapshot_url',
+            model_name="bookmark",
+            name="web_archive_snapshot_url",
             field=models.CharField(blank=True, max_length=2048),
         ),
     ]

bookmarks/migrations/0010_userprofile_bookmark_link_target.py

@@ -6,13 +6,17 @@ from django.db import migrations, models
 class Migration(migrations.Migration):
 
     dependencies = [
-        ('bookmarks', '0009_bookmark_web_archive_snapshot_url'),
+        ("bookmarks", "0009_bookmark_web_archive_snapshot_url"),
     ]
 
     operations = [
         migrations.AddField(
-            model_name='userprofile',
-            name='bookmark_link_target',
-            field=models.CharField(choices=[('_blank', 'New page'), ('_self', 'Same page')], default='_blank', max_length=10),
+            model_name="userprofile",
+            name="bookmark_link_target",
+            field=models.CharField(
+                choices=[("_blank", "New page"), ("_self", "Same page")],
+                default="_blank",
+                max_length=10,
+            ),
         ),
     ]

bookmarks/migrations/0011_userprofile_web_archive_integration.py

@@ -6,13 +6,17 @@ from django.db import migrations, models
 class Migration(migrations.Migration):
 
     dependencies = [
-        ('bookmarks', '0010_userprofile_bookmark_link_target'),
+        ("bookmarks", "0010_userprofile_bookmark_link_target"),
     ]
 
     operations = [
         migrations.AddField(
-            model_name='userprofile',
-            name='web_archive_integration',
-            field=models.CharField(choices=[('disabled', 'Disabled'), ('enabled', 'Enabled')], default='disabled', max_length=10),
+            model_name="userprofile",
+            name="web_archive_integration",
+            field=models.CharField(
+                choices=[("disabled", "Disabled"), ("enabled", "Enabled")],
+                default="disabled",
+                max_length=10,
+            ),
         ),
     ]

bookmarks/migrations/0012_toast.py

@@ -9,18 +9,32 @@ class Migration(migrations.Migration):
 
     dependencies = [
         migrations.swappable_dependency(settings.AUTH_USER_MODEL),
-        ('bookmarks', '0011_userprofile_web_archive_integration'),
+        ("bookmarks", "0011_userprofile_web_archive_integration"),
     ]
 
     operations = [
         migrations.CreateModel(
-            name='Toast',
+            name="Toast",
             fields=[
-                ('id', models.AutoField(auto_created=True, primary_key=True, serialize=False, verbose_name='ID')),
-                ('key', models.CharField(max_length=50)),
-                ('message', models.TextField()),
-                ('acknowledged', models.BooleanField(default=False)),
-                ('owner', models.ForeignKey(on_delete=django.db.models.deletion.CASCADE, to=settings.AUTH_USER_MODEL)),
+                (
+                    "id",
+                    models.AutoField(
+                        auto_created=True,
+                        primary_key=True,
+                        serialize=False,
+                        verbose_name="ID",
+                    ),
+                ),
+                ("key", models.CharField(max_length=50)),
+                ("message", models.TextField()),
+                ("acknowledged", models.BooleanField(default=False)),
+                (
+                    "owner",
+                    models.ForeignKey(
+                        on_delete=django.db.models.deletion.CASCADE,
+                        to=settings.AUTH_USER_MODEL,
+                    ),
+                ),
             ],
         ),
     ]

bookmarks/migrations/0013_web_archive_optin_toast.py

@@ -10,19 +10,21 @@ User = get_user_model()
 
 def forwards(apps, schema_editor):
     for user in User.objects.all():
-        toast = Toast(key='web_archive_opt_in_hint',
-                      message='The Internet Archive Wayback Machine integration has been disabled by default. Check the Settings to re-enable it.',
-                      owner=user)
+        toast = Toast(
+            key="web_archive_opt_in_hint",
+            message="The Internet Archive Wayback Machine integration has been disabled by default. Check the Settings to re-enable it.",
+            owner=user,
+        )
         toast.save()
 
 
 def reverse(apps, schema_editor):
-    Toast.objects.filter(key='web_archive_opt_in_hint').delete()
+    Toast.objects.filter(key="web_archive_opt_in_hint").delete()
 
 
 class Migration(migrations.Migration):
     dependencies = [
-        ('bookmarks', '0012_toast'),
+        ("bookmarks", "0012_toast"),
     ]
 
     operations = [

bookmarks/migrations/0014_alter_bookmark_unread.py

@@ -4,7 +4,7 @@ from django.db import migrations, models
 
 
 def forwards(apps, schema_editor):
-    Bookmark = apps.get_model('bookmarks', 'Bookmark')
+    Bookmark = apps.get_model("bookmarks", "Bookmark")
     Bookmark.objects.update(unread=False)
 
 
@@ -14,13 +14,13 @@ def reverse(apps, schema_editor):
 
 class Migration(migrations.Migration):
     dependencies = [
-        ('bookmarks', '0013_web_archive_optin_toast'),
+        ("bookmarks", "0013_web_archive_optin_toast"),
     ]
 
     operations = [
         migrations.AlterField(
-            model_name='bookmark',
-            name='unread',
+            model_name="bookmark",
+            name="unread",
             field=models.BooleanField(default=False),
         ),
         migrations.RunPython(forwards, reverse),

bookmarks/migrations/0015_feedtoken.py

@@ -9,16 +9,26 @@ class Migration(migrations.Migration):
 
     dependencies = [
         migrations.swappable_dependency(settings.AUTH_USER_MODEL),
-        ('bookmarks', '0014_alter_bookmark_unread'),
+        ("bookmarks", "0014_alter_bookmark_unread"),
     ]
 
     operations = [
         migrations.CreateModel(
-            name='FeedToken',
+            name="FeedToken",
             fields=[
-                ('key', models.CharField(max_length=40, primary_key=True, serialize=False)),
-                ('created', models.DateTimeField(auto_now_add=True)),
-                ('user', models.OneToOneField(on_delete=django.db.models.deletion.CASCADE, related_name='feed_token', to=settings.AUTH_USER_MODEL)),
+                (
+                    "key",
+                    models.CharField(max_length=40, primary_key=True, serialize=False),
+                ),
+                ("created", models.DateTimeField(auto_now_add=True)),
+                (
+                    "user",
+                    models.OneToOneField(
+                        on_delete=django.db.models.deletion.CASCADE,
+                        related_name="feed_token",
+                        to=settings.AUTH_USER_MODEL,
+                    ),
+                ),
             ],
         ),
     ]

bookmarks/migrations/0016_bookmark_shared.py

@@ -6,13 +6,13 @@ from django.db import migrations, models
 class Migration(migrations.Migration):
 
     dependencies = [
-        ('bookmarks', '0015_feedtoken'),
+        ("bookmarks", "0015_feedtoken"),
     ]
 
     operations = [
         migrations.AddField(
-            model_name='bookmark',
-            name='shared',
+            model_name="bookmark",
+            name="shared",
             field=models.BooleanField(default=False),
         ),
     ]

bookmarks/migrations/0017_userprofile_enable_sharing.py

@@ -6,13 +6,13 @@ from django.db import migrations, models
 class Migration(migrations.Migration):
 
     dependencies = [
-        ('bookmarks', '0016_bookmark_shared'),
+        ("bookmarks", "0016_bookmark_shared"),
     ]
 
     operations = [
         migrations.AddField(
-            model_name='userprofile',
-            name='enable_sharing',
+            model_name="userprofile",
+            name="enable_sharing",
             field=models.BooleanField(default=False),
         ),
     ]

bookmarks/migrations/0018_bookmark_favicon_file.py

@@ -6,13 +6,13 @@ from django.db import migrations, models
 class Migration(migrations.Migration):
 
     dependencies = [
-        ('bookmarks', '0017_userprofile_enable_sharing'),
+        ("bookmarks", "0017_userprofile_enable_sharing"),
     ]
 
     operations = [
         migrations.AddField(
-            model_name='bookmark',
-            name='favicon_file',
+            model_name="bookmark",
+            name="favicon_file",
             field=models.CharField(blank=True, max_length=512),
         ),
     ]

bookmarks/migrations/0019_userprofile_enable_favicons.py

@@ -6,13 +6,13 @@ from django.db import migrations, models
 class Migration(migrations.Migration):
 
     dependencies = [
-        ('bookmarks', '0018_bookmark_favicon_file'),
+        ("bookmarks", "0018_bookmark_favicon_file"),
     ]
 
     operations = [
         migrations.AddField(
-            model_name='userprofile',
-            name='enable_favicons',
+            model_name="userprofile",
+            name="enable_favicons",
             field=models.BooleanField(default=False),
         ),
     ]

bookmarks/migrations/0020_userprofile_tag_search.py

@@ -6,13 +6,17 @@ from django.db import migrations, models
 class Migration(migrations.Migration):
 
     dependencies = [
-        ('bookmarks', '0019_userprofile_enable_favicons'),
+        ("bookmarks", "0019_userprofile_enable_favicons"),
     ]
 
     operations = [
         migrations.AddField(
-            model_name='userprofile',
-            name='tag_search',
-            field=models.CharField(choices=[('strict', 'Strict'), ('lax', 'Lax')], default='strict', max_length=10),
+            model_name="userprofile",
+            name="tag_search",
+            field=models.CharField(
+                choices=[("strict", "Strict"), ("lax", "Lax")],
+                default="strict",
+                max_length=10,
+            ),
         ),
     ]

bookmarks/migrations/0021_userprofile_display_url.py

@@ -6,13 +6,13 @@ from django.db import migrations, models
 class Migration(migrations.Migration):
 
     dependencies = [
-        ('bookmarks', '0020_userprofile_tag_search'),
+        ("bookmarks", "0020_userprofile_tag_search"),
     ]
 
     operations = [
         migrations.AddField(
-            model_name='userprofile',
-            name='display_url',
+            model_name="userprofile",
+            name="display_url",
             field=models.BooleanField(default=False),
         ),
     ]

bookmarks/migrations/0022_bookmark_notes.py

@@ -6,13 +6,13 @@ from django.db import migrations, models
 class Migration(migrations.Migration):
 
     dependencies = [
-        ('bookmarks', '0021_userprofile_display_url'),
+        ("bookmarks", "0021_userprofile_display_url"),
     ]
 
     operations = [
         migrations.AddField(
-            model_name='bookmark',
-            name='notes',
+            model_name="bookmark",
+            name="notes",
             field=models.TextField(blank=True),
         ),
     ]

bookmarks/migrations/0023_userprofile_permanent_notes.py

@@ -6,13 +6,13 @@ from django.db import migrations, models
 class Migration(migrations.Migration):
 
     dependencies = [
-        ('bookmarks', '0022_bookmark_notes'),
+        ("bookmarks", "0022_bookmark_notes"),
     ]
 
     operations = [
         migrations.AddField(
-            model_name='userprofile',
-            name='permanent_notes',
+            model_name="userprofile",
+            name="permanent_notes",
             field=models.BooleanField(default=False),
         ),
     ]

bookmarks/migrations/0024_userprofile_enable_public_sharing.py

@@ -6,13 +6,13 @@ from django.db import migrations, models
 class Migration(migrations.Migration):
 
     dependencies = [
-        ('bookmarks', '0023_userprofile_permanent_notes'),
+        ("bookmarks", "0023_userprofile_permanent_notes"),
     ]
 
     operations = [
         migrations.AddField(
-            model_name='userprofile',
-            name='enable_public_sharing',
+            model_name="userprofile",
+            name="enable_public_sharing",
             field=models.BooleanField(default=False),
         ),
     ]

bookmarks/migrations/0025_userprofile_search_preferences.py

@@ -0,0 +1,18 @@
+# Generated by Django 4.1.9 on 2023-09-30 10:44
+
+from django.db import migrations, models
+
+
+class Migration(migrations.Migration):
+
+    dependencies = [
+        ("bookmarks", "0024_userprofile_enable_public_sharing"),
+    ]
+
+    operations = [
+        migrations.AddField(
+            model_name="userprofile",
+            name="search_preferences",
+            field=models.JSONField(default=dict),
+        ),
+    ]

bookmarks/models.py

@@ -5,10 +5,10 @@ from typing import List
 from django import forms
 from django.contrib.auth import get_user_model
 from django.contrib.auth.models import User
-from django.core.handlers.wsgi import WSGIRequest
 from django.db import models
 from django.db.models.signals import post_save
 from django.dispatch import receiver
+from django.http import QueryDict
 
 from bookmarks.utils import unique
 from bookmarks.validators import BookmarkURLValidator
@@ -26,10 +26,10 @@ class Tag(models.Model):
 def sanitize_tag_name(tag_name: str):
     # strip leading/trailing spaces
     # replace inner spaces with replacement char
-    return tag_name.strip().replace(' ', '-')
+    return tag_name.strip().replace(" ", "-")
 
 
-def parse_tag_string(tag_string: str, delimiter: str = ','):
+def parse_tag_string(tag_string: str, delimiter: str = ","):
     if not tag_string:
         return []
     names = tag_string.strip().split(delimiter)
@@ -42,7 +42,7 @@ def parse_tag_string(tag_string: str, delimiter: str = ','):
     return names
 
 
-def build_tag_string(tag_names: List[str], delimiter: str = ','):
+def build_tag_string(tag_names: List[str], delimiter: str = ","):
     return delimiter.join(tag_names)
 
 
@@ -82,7 +82,7 @@ class Bookmark(models.Model):
         return [tag.name for tag in self.tags.all()]
 
     def __str__(self):
-        return self.resolved_title + ' (' + self.url[:30] + '...)'
+        return self.resolved_title + " (" + self.url[:30] + "...)"
 
 
 class BookmarkForm(forms.ModelForm):
@@ -90,15 +90,13 @@ class BookmarkForm(forms.ModelForm):
     url = forms.CharField(validators=[BookmarkURLValidator()])
     tag_string = forms.CharField(required=False)
     # Do not require title and description in form as we fill these automatically if they are empty
-    title = forms.CharField(max_length=512,
-                            required=False)
-    description = forms.CharField(required=False,
-                                  widget=forms.Textarea())
+    title = forms.CharField(max_length=512, required=False)
+    description = forms.CharField(required=False, widget=forms.Textarea())
     # Include website title and description as hidden field as they only provide info when editing bookmarks
-    website_title = forms.CharField(max_length=512,
-                                    required=False, widget=forms.HiddenInput())
-    website_description = forms.CharField(required=False,
-                                          widget=forms.HiddenInput())
+    website_title = forms.CharField(
+        max_length=512, required=False, widget=forms.HiddenInput()
+    )
+    website_description = forms.CharField(required=False, widget=forms.HiddenInput())
     unread = forms.BooleanField(required=False)
     shared = forms.BooleanField(required=False)
     # Hidden field that determines whether to close window/tab after saving the bookmark
@@ -107,16 +105,16 @@ class BookmarkForm(forms.ModelForm):
     class Meta:
         model = Bookmark
         fields = [
-            'url',
-            'tag_string',
-            'title',
-            'description',
-            'notes',
-            'website_title',
-            'website_description',
-            'unread',
-            'shared',
-            'auto_close',
+            "url",
+            "tag_string",
+            "title",
+            "description",
+            "notes",
+            "website_title",
+            "website_description",
+            "unread",
+            "shared",
+            "auto_close",
         ]
 
     @property
@@ -124,69 +122,233 @@ class BookmarkForm(forms.ModelForm):
         return self.instance and self.instance.notes
 
 
-class BookmarkFilters:
-    def __init__(self, request: WSGIRequest):
-        self.query = request.GET.get('q') or ''
-        self.user = request.GET.get('user') or ''
+class BookmarkSearch:
+    SORT_ADDED_ASC = "added_asc"
+    SORT_ADDED_DESC = "added_desc"
+    SORT_TITLE_ASC = "title_asc"
+    SORT_TITLE_DESC = "title_desc"
+
+    FILTER_SHARED_OFF = "off"
+    FILTER_SHARED_SHARED = "yes"
+    FILTER_SHARED_UNSHARED = "no"
+
+    FILTER_UNREAD_OFF = "off"
+    FILTER_UNREAD_YES = "yes"
+    FILTER_UNREAD_NO = "no"
+
+    params = ["q", "user", "sort", "shared", "unread"]
+    preferences = ["sort", "shared", "unread"]
+    defaults = {
+        "q": "",
+        "user": "",
+        "sort": SORT_ADDED_DESC,
+        "shared": FILTER_SHARED_OFF,
+        "unread": FILTER_UNREAD_OFF,
+    }
+
+    def __init__(
+        self,
+        q: str = None,
+        user: str = None,
+        sort: str = None,
+        shared: str = None,
+        unread: str = None,
+        preferences: dict = None,
+    ):
+        if not preferences:
+            preferences = {}
+        self.defaults = {**BookmarkSearch.defaults, **preferences}
+
+        self.q = q or self.defaults["q"]
+        self.user = user or self.defaults["user"]
+        self.sort = sort or self.defaults["sort"]
+        self.shared = shared or self.defaults["shared"]
+        self.unread = unread or self.defaults["unread"]
+
+    def is_modified(self, param):
+        value = self.__dict__[param]
+        return value != self.defaults[param]
+
+    @property
+    def modified_params(self):
+        return [field for field in self.params if self.is_modified(field)]
+
+    @property
+    def modified_preferences(self):
+        return [
+            preference
+            for preference in self.preferences
+            if self.is_modified(preference)
+        ]
+
+    @property
+    def has_modifications(self):
+        return len(self.modified_params) > 0
+
+    @property
+    def has_modified_preferences(self):
+        return len(self.modified_preferences) > 0
+
+    @property
+    def query_params(self):
+        return {param: self.__dict__[param] for param in self.modified_params}
+
+    @property
+    def preferences_dict(self):
+        return {
+            preference: self.__dict__[preference] for preference in self.preferences
+        }
+
+    @staticmethod
+    def from_request(query_dict: QueryDict, preferences: dict = None):
+        initial_values = {}
+        for param in BookmarkSearch.params:
+            value = query_dict.get(param)
+            if value:
+                initial_values[param] = value
+
+        return BookmarkSearch(**initial_values, preferences=preferences)
+
+
+class BookmarkSearchForm(forms.Form):
+    SORT_CHOICES = [
+        (BookmarkSearch.SORT_ADDED_ASC, "Added ↑"),
+        (BookmarkSearch.SORT_ADDED_DESC, "Added ↓"),
+        (BookmarkSearch.SORT_TITLE_ASC, "Title ↑"),
+        (BookmarkSearch.SORT_TITLE_DESC, "Title ↓"),
+    ]
+    FILTER_SHARED_CHOICES = [
+        (BookmarkSearch.FILTER_SHARED_OFF, "Off"),
+        (BookmarkSearch.FILTER_SHARED_SHARED, "Shared"),
+        (BookmarkSearch.FILTER_SHARED_UNSHARED, "Unshared"),
+    ]
+    FILTER_UNREAD_CHOICES = [
+        (BookmarkSearch.FILTER_UNREAD_OFF, "Off"),
+        (BookmarkSearch.FILTER_UNREAD_YES, "Unread"),
+        (BookmarkSearch.FILTER_UNREAD_NO, "Read"),
+    ]
+
+    q = forms.CharField()
+    user = forms.ChoiceField()
+    sort = forms.ChoiceField(choices=SORT_CHOICES)
+    shared = forms.ChoiceField(choices=FILTER_SHARED_CHOICES, widget=forms.RadioSelect)
+    unread = forms.ChoiceField(choices=FILTER_UNREAD_CHOICES, widget=forms.RadioSelect)
+
+    def __init__(
+        self,
+        search: BookmarkSearch,
+        editable_fields: List[str] = None,
+        users: List[User] = None,
+    ):
+        super().__init__()
+        editable_fields = editable_fields or []
+        self.editable_fields = editable_fields
+
+        # set choices for user field if users are provided
+        if users:
+            user_choices = [(user.username, user.username) for user in users]
+            user_choices.insert(0, ("", "Everyone"))
+            self.fields["user"].choices = user_choices
+
+        for param in search.params:
+            # set initial values for modified params
+            self.fields[param].initial = search.__dict__[param]
+
+            # Mark non-editable modified fields as hidden. That way, templates
+            # rendering a form can just loop over hidden_fields to ensure that
+            # all necessary search options are kept when submitting the form.
+            if search.is_modified(param) and param not in editable_fields:
+                self.fields[param].widget = forms.HiddenInput()
 
 
 class UserProfile(models.Model):
-    THEME_AUTO = 'auto'
-    THEME_LIGHT = 'light'
-    THEME_DARK = 'dark'
+    THEME_AUTO = "auto"
+    THEME_LIGHT = "light"
+    THEME_DARK = "dark"
     THEME_CHOICES = [
-        (THEME_AUTO, 'Auto'),
-        (THEME_LIGHT, 'Light'),
-        (THEME_DARK, 'Dark'),
+        (THEME_AUTO, "Auto"),
+        (THEME_LIGHT, "Light"),
+        (THEME_DARK, "Dark"),
     ]
-    BOOKMARK_DATE_DISPLAY_RELATIVE = 'relative'
-    BOOKMARK_DATE_DISPLAY_ABSOLUTE = 'absolute'
-    BOOKMARK_DATE_DISPLAY_HIDDEN = 'hidden'
+    BOOKMARK_DATE_DISPLAY_RELATIVE = "relative"
+    BOOKMARK_DATE_DISPLAY_ABSOLUTE = "absolute"
+    BOOKMARK_DATE_DISPLAY_HIDDEN = "hidden"
     BOOKMARK_DATE_DISPLAY_CHOICES = [
-        (BOOKMARK_DATE_DISPLAY_RELATIVE, 'Relative'),
-        (BOOKMARK_DATE_DISPLAY_ABSOLUTE, 'Absolute'),
-        (BOOKMARK_DATE_DISPLAY_HIDDEN, 'Hidden'),
+        (BOOKMARK_DATE_DISPLAY_RELATIVE, "Relative"),
+        (BOOKMARK_DATE_DISPLAY_ABSOLUTE, "Absolute"),
+        (BOOKMARK_DATE_DISPLAY_HIDDEN, "Hidden"),
     ]
-    BOOKMARK_LINK_TARGET_BLANK = '_blank'
-    BOOKMARK_LINK_TARGET_SELF = '_self'
+    BOOKMARK_LINK_TARGET_BLANK = "_blank"
+    BOOKMARK_LINK_TARGET_SELF = "_self"
     BOOKMARK_LINK_TARGET_CHOICES = [
-        (BOOKMARK_LINK_TARGET_BLANK, 'New page'),
-        (BOOKMARK_LINK_TARGET_SELF, 'Same page'),
+        (BOOKMARK_LINK_TARGET_BLANK, "New page"),
+        (BOOKMARK_LINK_TARGET_SELF, "Same page"),
     ]
-    WEB_ARCHIVE_INTEGRATION_DISABLED = 'disabled'
-    WEB_ARCHIVE_INTEGRATION_ENABLED = 'enabled'
+    WEB_ARCHIVE_INTEGRATION_DISABLED = "disabled"
+    WEB_ARCHIVE_INTEGRATION_ENABLED = "enabled"
     WEB_ARCHIVE_INTEGRATION_CHOICES = [
-        (WEB_ARCHIVE_INTEGRATION_DISABLED, 'Disabled'),
-        (WEB_ARCHIVE_INTEGRATION_ENABLED, 'Enabled'),
+        (WEB_ARCHIVE_INTEGRATION_DISABLED, "Disabled"),
+        (WEB_ARCHIVE_INTEGRATION_ENABLED, "Enabled"),
     ]
-    TAG_SEARCH_STRICT = 'strict'
-    TAG_SEARCH_LAX = 'lax'
+    TAG_SEARCH_STRICT = "strict"
+    TAG_SEARCH_LAX = "lax"
     TAG_SEARCH_CHOICES = [
-        (TAG_SEARCH_STRICT, 'Strict'),
-        (TAG_SEARCH_LAX, 'Lax'),
+        (TAG_SEARCH_STRICT, "Strict"),
+        (TAG_SEARCH_LAX, "Lax"),
     ]
-    user = models.OneToOneField(get_user_model(), related_name='profile', on_delete=models.CASCADE)
-    theme = models.CharField(max_length=10, choices=THEME_CHOICES, blank=False, default=THEME_AUTO)
-    bookmark_date_display = models.CharField(max_length=10, choices=BOOKMARK_DATE_DISPLAY_CHOICES, blank=False,
-                                             default=BOOKMARK_DATE_DISPLAY_RELATIVE)
-    bookmark_link_target = models.CharField(max_length=10, choices=BOOKMARK_LINK_TARGET_CHOICES, blank=False,
-                                            default=BOOKMARK_LINK_TARGET_BLANK)
-    web_archive_integration = models.CharField(max_length=10, choices=WEB_ARCHIVE_INTEGRATION_CHOICES, blank=False,
-                                               default=WEB_ARCHIVE_INTEGRATION_DISABLED)
-    tag_search = models.CharField(max_length=10, choices=TAG_SEARCH_CHOICES, blank=False,
-                                  default=TAG_SEARCH_STRICT)
+    user = models.OneToOneField(
+        get_user_model(), related_name="profile", on_delete=models.CASCADE
+    )
+    theme = models.CharField(
+        max_length=10, choices=THEME_CHOICES, blank=False, default=THEME_AUTO
+    )
+    bookmark_date_display = models.CharField(
+        max_length=10,
+        choices=BOOKMARK_DATE_DISPLAY_CHOICES,
+        blank=False,
+        default=BOOKMARK_DATE_DISPLAY_RELATIVE,
+    )
+    bookmark_link_target = models.CharField(
+        max_length=10,
+        choices=BOOKMARK_LINK_TARGET_CHOICES,
+        blank=False,
+        default=BOOKMARK_LINK_TARGET_BLANK,
+    )
+    web_archive_integration = models.CharField(
+        max_length=10,
+        choices=WEB_ARCHIVE_INTEGRATION_CHOICES,
+        blank=False,
+        default=WEB_ARCHIVE_INTEGRATION_DISABLED,
+    )
+    tag_search = models.CharField(
+        max_length=10,
+        choices=TAG_SEARCH_CHOICES,
+        blank=False,
+        default=TAG_SEARCH_STRICT,
+    )
     enable_sharing = models.BooleanField(default=False, null=False)
     enable_public_sharing = models.BooleanField(default=False, null=False)
     enable_favicons = models.BooleanField(default=False, null=False)
     display_url = models.BooleanField(default=False, null=False)
     permanent_notes = models.BooleanField(default=False, null=False)
+    search_preferences = models.JSONField(default=dict, null=False)
 
 
 class UserProfileForm(forms.ModelForm):
     class Meta:
         model = UserProfile
-        fields = ['theme', 'bookmark_date_display', 'bookmark_link_target', 'web_archive_integration', 'tag_search',
-                  'enable_sharing', 'enable_public_sharing', 'enable_favicons', 'display_url', 'permanent_notes']
+        fields = [
+            "theme",
+            "bookmark_date_display",
+            "bookmark_link_target",
+            "web_archive_integration",
+            "tag_search",
+            "enable_sharing",
+            "enable_public_sharing",
+            "enable_favicons",
+            "display_url",
+            "permanent_notes",
+        ]
 
 
 @receiver(post_save, sender=get_user_model())
@@ -211,9 +373,11 @@ class FeedToken(models.Model):
     """
     Adapted from authtoken.models.Token
     """
+
     key = models.CharField(max_length=40, primary_key=True)
-    user = models.OneToOneField(get_user_model(),
-                                related_name='feed_token',
+    user = models.OneToOneField(
+        get_user_model(),
+        related_name="feed_token",
         on_delete=models.CASCADE,
     )
     created = models.DateTimeField(auto_now_add=True)

bookmarks/queries.py

@@ -1,32 +1,43 @@
 from typing import Optional
 
+from django.conf import settings
 from django.contrib.auth.models import User
-from django.db.models import Q, QuerySet, Exists, OuterRef
+from django.db.models import Q, QuerySet, Exists, OuterRef, Case, When, CharField
+from django.db.models.expressions import RawSQL
+from django.db.models.functions import Lower
 
-from bookmarks.models import Bookmark, Tag, UserProfile
+from bookmarks.models import Bookmark, BookmarkSearch, Tag, UserProfile
 from bookmarks.utils import unique
 
 
-def query_bookmarks(user: User, profile: UserProfile, query_string: str) -> QuerySet:
-    return _base_bookmarks_query(user, profile, query_string) \
-        .filter(is_archived=False)
+def query_bookmarks(
+    user: User, profile: UserProfile, search: BookmarkSearch
+) -> QuerySet:
+    return _base_bookmarks_query(user, profile, search).filter(is_archived=False)
 
 
-def query_archived_bookmarks(user: User, profile: UserProfile, query_string: str) -> QuerySet:
-    return _base_bookmarks_query(user, profile, query_string) \
-        .filter(is_archived=True)
+def query_archived_bookmarks(
+    user: User, profile: UserProfile, search: BookmarkSearch
+) -> QuerySet:
+    return _base_bookmarks_query(user, profile, search).filter(is_archived=True)
 
 
-def query_shared_bookmarks(user: Optional[User], profile: UserProfile, query_string: str,
-                           public_only: bool) -> QuerySet:
+def query_shared_bookmarks(
+    user: Optional[User],
+    profile: UserProfile,
+    search: BookmarkSearch,
+    public_only: bool,
+) -> QuerySet:
     conditions = Q(shared=True) & Q(owner__profile__enable_sharing=True)
     if public_only:
         conditions = conditions & Q(owner__profile__enable_public_sharing=True)
 
-    return _base_bookmarks_query(user, profile, query_string).filter(conditions)
+    return _base_bookmarks_query(user, profile, search).filter(conditions)
 
 
-def _base_bookmarks_query(user: Optional[User], profile: UserProfile, query_string: str) -> QuerySet:
+def _base_bookmarks_query(
+    user: Optional[User], profile: UserProfile, search: BookmarkSearch
+) -> QuerySet:
     query_set = Bookmark.objects
 
     # Filter for user
@@ -34,71 +45,126 @@ def _base_bookmarks_query(user: Optional[User], profile: UserProfile, query_stri
         query_set = query_set.filter(owner=user)
 
     # Split query into search terms and tags
-    query = parse_query_string(query_string)
+    query = parse_query_string(search.q)
 
     # Filter for search terms and tags
-    for term in query['search_terms']:
-        conditions = Q(title__icontains=term) \
-                     | Q(description__icontains=term) \
-                     | Q(notes__icontains=term) \
-                     | Q(website_title__icontains=term) \
-                     | Q(website_description__icontains=term) \
+    for term in query["search_terms"]:
+        conditions = (
+            Q(title__icontains=term)
+            | Q(description__icontains=term)
+            | Q(notes__icontains=term)
+            | Q(website_title__icontains=term)
+            | Q(website_description__icontains=term)
             | Q(url__icontains=term)
+        )
 
         if profile.tag_search == UserProfile.TAG_SEARCH_LAX:
-            conditions = conditions | Exists(Bookmark.objects.filter(id=OuterRef('id'), tags__name__iexact=term))
+            conditions = conditions | Exists(
+                Bookmark.objects.filter(id=OuterRef("id"), tags__name__iexact=term)
+            )
 
         query_set = query_set.filter(conditions)
 
-    for tag_name in query['tag_names']:
-        query_set = query_set.filter(
-            tags__name__iexact=tag_name
-        )
+    for tag_name in query["tag_names"]:
+        query_set = query_set.filter(tags__name__iexact=tag_name)
 
     # Untagged bookmarks
-    if query['untagged']:
-        query_set = query_set.filter(
-            tags=None
-        )
-    # Unread bookmarks
-    if query['unread']:
-        query_set = query_set.filter(
-            unread=True
-        )
+    if query["untagged"]:
+        query_set = query_set.filter(tags=None)
+    # Legacy unread bookmarks filter from query
+    if query["unread"]:
+        query_set = query_set.filter(unread=True)
+
+    # Unread filter from bookmark search
+    if search.unread == BookmarkSearch.FILTER_UNREAD_YES:
+        query_set = query_set.filter(unread=True)
+    elif search.unread == BookmarkSearch.FILTER_UNREAD_NO:
+        query_set = query_set.filter(unread=False)
+
+    # Shared filter
+    if search.shared == BookmarkSearch.FILTER_SHARED_SHARED:
+        query_set = query_set.filter(shared=True)
+    elif search.shared == BookmarkSearch.FILTER_SHARED_UNSHARED:
+        query_set = query_set.filter(shared=False)
 
     # Sort by date added
-    query_set = query_set.order_by('-date_added')
+    if search.sort == BookmarkSearch.SORT_ADDED_ASC:
+        query_set = query_set.order_by("date_added")
+    elif search.sort == BookmarkSearch.SORT_ADDED_DESC:
+        query_set = query_set.order_by("-date_added")
+
+    # Sort by title
+    if (
+        search.sort == BookmarkSearch.SORT_TITLE_ASC
+        or search.sort == BookmarkSearch.SORT_TITLE_DESC
+    ):
+        # For the title, the resolved_title logic from the Bookmark entity needs
+        # to be replicated as there is no corresponding database field
+        query_set = query_set.annotate(
+            effective_title=Case(
+                When(Q(title__isnull=False) & ~Q(title__exact=""), then=Lower("title")),
+                When(
+                    Q(website_title__isnull=False) & ~Q(website_title__exact=""),
+                    then=Lower("website_title"),
+                ),
+                default=Lower("url"),
+                output_field=CharField(),
+            )
+        )
+
+        # For SQLite, if the ICU extension is loaded, use the custom collation
+        # loaded into the connection. This results in an improved sort order for
+        # unicode characters (umlauts, etc.)
+        if settings.USE_SQLITE and settings.USE_SQLITE_ICU_EXTENSION:
+            order_field = RawSQL("effective_title COLLATE ICU", ())
+        else:
+            order_field = "effective_title"
+
+        if search.sort == BookmarkSearch.SORT_TITLE_ASC:
+            query_set = query_set.order_by(order_field)
+        elif search.sort == BookmarkSearch.SORT_TITLE_DESC:
+            query_set = query_set.order_by(order_field).reverse()
 
     return query_set
 
 
-def query_bookmark_tags(user: User, profile: UserProfile, query_string: str) -> QuerySet:
-    bookmarks_query = query_bookmarks(user, profile, query_string)
+def query_bookmark_tags(
+    user: User, profile: UserProfile, search: BookmarkSearch
+) -> QuerySet:
+    bookmarks_query = query_bookmarks(user, profile, search)
 
     query_set = Tag.objects.filter(bookmark__in=bookmarks_query)
 
     return query_set.distinct()
 
 
-def query_archived_bookmark_tags(user: User, profile: UserProfile, query_string: str) -> QuerySet:
-    bookmarks_query = query_archived_bookmarks(user, profile, query_string)
+def query_archived_bookmark_tags(
+    user: User, profile: UserProfile, search: BookmarkSearch
+) -> QuerySet:
+    bookmarks_query = query_archived_bookmarks(user, profile, search)
 
     query_set = Tag.objects.filter(bookmark__in=bookmarks_query)
 
     return query_set.distinct()
 
 
-def query_shared_bookmark_tags(user: Optional[User], profile: UserProfile, query_string: str,
-                               public_only: bool) -> QuerySet:
-    bookmarks_query = query_shared_bookmarks(user, profile, query_string, public_only)
+def query_shared_bookmark_tags(
+    user: Optional[User],
+    profile: UserProfile,
+    search: BookmarkSearch,
+    public_only: bool,
+) -> QuerySet:
+    bookmarks_query = query_shared_bookmarks(user, profile, search, public_only)
 
     query_set = Tag.objects.filter(bookmark__in=bookmarks_query)
 
     return query_set.distinct()
 
 
-def query_shared_bookmark_users(profile: UserProfile, query_string: str, public_only: bool) -> QuerySet:
-    bookmarks_query = query_shared_bookmarks(None, profile, query_string, public_only)
+def query_shared_bookmark_users(
+    profile: UserProfile, search: BookmarkSearch, public_only: bool
+) -> QuerySet:
+    bookmarks_query = query_shared_bookmarks(None, profile, search, public_only)
 
     query_set = User.objects.filter(bookmark__in=bookmarks_query)
 
@@ -112,23 +178,23 @@ def get_user_tags(user: User):
 def parse_query_string(query_string):
     # Sanitize query params
     if not query_string:
-        query_string = ''
+        query_string = ""
 
     # Split query into search terms and tags
-    keywords = query_string.strip().split(' ')
+    keywords = query_string.strip().split(" ")
     keywords = [word for word in keywords if word]
 
-    search_terms = [word for word in keywords if word[0] != '#' and word[0] != '!']
-    tag_names = [word[1:] for word in keywords if word[0] == '#']
+    search_terms = [word for word in keywords if word[0] != "#" and word[0] != "!"]
+    tag_names = [word[1:] for word in keywords if word[0] == "#"]
     tag_names = unique(tag_names, str.lower)
 
     # Special search commands
-    untagged = '!untagged' in keywords
-    unread = '!unread' in keywords
+    untagged = "!untagged" in keywords
+    unread = "!unread" in keywords
 
     return {
-        'search_terms': search_terms,
-        'tag_names': tag_names,
-        'untagged': untagged,
-        'unread': unread,
+        "search_terms": search_terms,
+        "tag_names": tag_names,
+        "untagged": untagged,
+        "unread": unread,
     }

bookmarks/services/bookmarks.py

@@ -11,7 +11,9 @@ from bookmarks.services import tasks
 
 def create_bookmark(bookmark: Bookmark, tag_string: str, current_user: User):
     # If URL is already bookmarked, then update it
-    existing_bookmark: Bookmark = Bookmark.objects.filter(owner=current_user, url=bookmark.url).first()
+    existing_bookmark: Bookmark = Bookmark.objects.filter(
+        owner=current_user, url=bookmark.url
+    ).first()
 
     if existing_bookmark is not None:
         _merge_bookmark_data(bookmark, existing_bookmark)
@@ -67,9 +69,10 @@ def archive_bookmark(bookmark: Bookmark):
 
 def archive_bookmarks(bookmark_ids: [Union[int, str]], current_user: User):
     sanitized_bookmark_ids = _sanitize_id_list(bookmark_ids)
-    bookmarks = Bookmark.objects.filter(owner=current_user, id__in=sanitized_bookmark_ids)
 
-    bookmarks.update(is_archived=True, date_modified=timezone.now())
+    Bookmark.objects.filter(owner=current_user, id__in=sanitized_bookmark_ids).update(
+        is_archived=True, date_modified=timezone.now()
+    )
 
 
 def unarchive_bookmark(bookmark: Bookmark):
@@ -81,42 +84,93 @@ def unarchive_bookmark(bookmark: Bookmark):
 
 def unarchive_bookmarks(bookmark_ids: [Union[int, str]], current_user: User):
     sanitized_bookmark_ids = _sanitize_id_list(bookmark_ids)
-    bookmarks = Bookmark.objects.filter(owner=current_user, id__in=sanitized_bookmark_ids)
 
-    bookmarks.update(is_archived=False, date_modified=timezone.now())
+    Bookmark.objects.filter(owner=current_user, id__in=sanitized_bookmark_ids).update(
+        is_archived=False, date_modified=timezone.now()
+    )
 
 
 def delete_bookmarks(bookmark_ids: [Union[int, str]], current_user: User):
     sanitized_bookmark_ids = _sanitize_id_list(bookmark_ids)
-    bookmarks = Bookmark.objects.filter(owner=current_user, id__in=sanitized_bookmark_ids)
 
-    bookmarks.delete()
+    Bookmark.objects.filter(owner=current_user, id__in=sanitized_bookmark_ids).delete()
 
 
 def tag_bookmarks(bookmark_ids: [Union[int, str]], tag_string: str, current_user: User):
     sanitized_bookmark_ids = _sanitize_id_list(bookmark_ids)
-    bookmarks = Bookmark.objects.filter(owner=current_user, id__in=sanitized_bookmark_ids)
+    owned_bookmark_ids = Bookmark.objects.filter(
+        owner=current_user, id__in=sanitized_bookmark_ids
+    ).values_list("id", flat=True)
     tag_names = parse_tag_string(tag_string)
     tags = get_or_create_tags(tag_names, current_user)
 
-    for bookmark in bookmarks:
-        bookmark.tags.add(*tags)
-        bookmark.date_modified = timezone.now()
+    BookmarkToTagRelationShip = Bookmark.tags.through
+    relationships = []
+    for tag in tags:
+        for bookmark_id in owned_bookmark_ids:
+            relationships.append(
+                BookmarkToTagRelationShip(bookmark_id=bookmark_id, tag=tag)
+            )
 
-    Bookmark.objects.bulk_update(bookmarks, ['date_modified'])
+    # Insert all bookmark -> tag associations at once, should ignore errors if association already exists
+    BookmarkToTagRelationShip.objects.bulk_create(relationships, ignore_conflicts=True)
+    Bookmark.objects.filter(id__in=owned_bookmark_ids).update(
+        date_modified=timezone.now()
+    )
 
 
-def untag_bookmarks(bookmark_ids: [Union[int, str]], tag_string: str, current_user: User):
+def untag_bookmarks(
+    bookmark_ids: [Union[int, str]], tag_string: str, current_user: User
+):
     sanitized_bookmark_ids = _sanitize_id_list(bookmark_ids)
-    bookmarks = Bookmark.objects.filter(owner=current_user, id__in=sanitized_bookmark_ids)
+    owned_bookmark_ids = Bookmark.objects.filter(
+        owner=current_user, id__in=sanitized_bookmark_ids
+    ).values_list("id", flat=True)
     tag_names = parse_tag_string(tag_string)
     tags = get_or_create_tags(tag_names, current_user)
 
-    for bookmark in bookmarks:
-        bookmark.tags.remove(*tags)
-        bookmark.date_modified = timezone.now()
+    BookmarkToTagRelationShip = Bookmark.tags.through
+    for tag in tags:
+        # Remove all bookmark -> tag associations for the owned bookmarks and the current tag
+        BookmarkToTagRelationShip.objects.filter(
+            bookmark_id__in=owned_bookmark_ids, tag=tag
+        ).delete()
 
-    Bookmark.objects.bulk_update(bookmarks, ['date_modified'])
+    Bookmark.objects.filter(id__in=owned_bookmark_ids).update(
+        date_modified=timezone.now()
+    )
+
+
+def mark_bookmarks_as_read(bookmark_ids: [Union[int, str]], current_user: User):
+    sanitized_bookmark_ids = _sanitize_id_list(bookmark_ids)
+
+    Bookmark.objects.filter(owner=current_user, id__in=sanitized_bookmark_ids).update(
+        unread=False, date_modified=timezone.now()
+    )
+
+
+def mark_bookmarks_as_unread(bookmark_ids: [Union[int, str]], current_user: User):
+    sanitized_bookmark_ids = _sanitize_id_list(bookmark_ids)
+
+    Bookmark.objects.filter(owner=current_user, id__in=sanitized_bookmark_ids).update(
+        unread=True, date_modified=timezone.now()
+    )
+
+
+def share_bookmarks(bookmark_ids: [Union[int, str]], current_user: User):
+    sanitized_bookmark_ids = _sanitize_id_list(bookmark_ids)
+
+    Bookmark.objects.filter(owner=current_user, id__in=sanitized_bookmark_ids).update(
+        shared=True, date_modified=timezone.now()
+    )
+
+
+def unshare_bookmarks(bookmark_ids: [Union[int, str]], current_user: User):
+    sanitized_bookmark_ids = _sanitize_id_list(bookmark_ids)
+
+    Bookmark.objects.filter(owner=current_user, id__in=sanitized_bookmark_ids).update(
+        shared=False, date_modified=timezone.now()
+    )
 
 
 def _merge_bookmark_data(from_bookmark: Bookmark, to_bookmark: Bookmark):

bookmarks/services/exporter.py

@@ -13,34 +13,41 @@ def export_netscape_html(bookmarks: List[Bookmark]):
     [append_bookmark(doc, bookmark) for bookmark in bookmarks]
     append_list_end(doc)
 
-    return '\n\r'.join(doc)
+    return "\n\r".join(doc)
 
 
 def append_header(doc: BookmarkDocument):
-    doc.append('<!DOCTYPE NETSCAPE-Bookmark-file-1>')
+    doc.append("<!DOCTYPE NETSCAPE-Bookmark-file-1>")
     doc.append('<META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=UTF-8">')
-    doc.append('<TITLE>Bookmarks</TITLE>')
-    doc.append('<H1>Bookmarks</H1>')
+    doc.append("<TITLE>Bookmarks</TITLE>")
+    doc.append("<H1>Bookmarks</H1>")
 
 
 def append_list_start(doc: BookmarkDocument):
-    doc.append('<DL><p>')
+    doc.append("<DL><p>")
 
 
 def append_bookmark(doc: BookmarkDocument, bookmark: Bookmark):
     url = bookmark.url
-    title = html.escape(bookmark.resolved_title or '')
-    desc = html.escape(bookmark.resolved_description or '')
-    tags = ','.join(bookmark.tag_names)
-    toread = '1' if bookmark.unread else '0'
-    private = '0' if bookmark.shared else '1'
+    title = html.escape(bookmark.resolved_title or "")
+    desc = html.escape(bookmark.resolved_description or "")
+    if bookmark.notes:
+        desc += f"[linkding-notes]{html.escape(bookmark.notes)}[/linkding-notes]"
+    tag_names = bookmark.tag_names
+    if bookmark.is_archived:
+        tag_names.append("linkding:archived")
+    tags = ",".join(tag_names)
+    toread = "1" if bookmark.unread else "0"
+    private = "0" if bookmark.shared else "1"
     added = int(bookmark.date_added.timestamp())
 
-    doc.append(f'<DT><A HREF="{url}" ADD_DATE="{added}" PRIVATE="{private}" TOREAD="{toread}" TAGS="{tags}">{title}</A>')
+    doc.append(
+        f'<DT><A HREF="{url}" ADD_DATE="{added}" PRIVATE="{private}" TOREAD="{toread}" TAGS="{tags}">{title}</A>'
+    )
 
     if desc:
-        doc.append(f'<DD>{desc}')
+        doc.append(f"<DD>{desc}")
 
 
 def append_list_end(doc: BookmarkDocument):
-    doc.append('</DL><p>')
+    doc.append("</DL><p>")

bookmarks/services/favicon_loader.py

@@ -15,7 +15,7 @@ logger = logging.getLogger(__name__)
 
 # register mime type for .ico files, which is not included in the default
 # mimetypes of the Docker image
-mimetypes.add_type('image/x-icon', '.ico')
+mimetypes.add_type("image/x-icon", ".ico")
 
 
 def _ensure_favicon_folder():
@@ -23,16 +23,16 @@ def _ensure_favicon_folder():
 
 
 def _url_to_filename(url: str) -> str:
-    return re.sub(r'\W+', '_', url)
+    return re.sub(r"\W+", "_", url)
 
 
 def _get_url_parameters(url: str) -> dict:
     parsed_uri = urlparse(url)
     return {
         # https://example.com/foo?bar -> https://example.com
-        'url': f'{parsed_uri.scheme}://{parsed_uri.hostname}',
+        "url": f"{parsed_uri.scheme}://{parsed_uri.hostname}",
         # https://example.com/foo?bar -> example.com
-        'domain': parsed_uri.hostname,
+        "domain": parsed_uri.hostname,
     }
 
 
@@ -63,21 +63,21 @@ def load_favicon(url: str) -> str:
     # Create favicon folder if not exists
     _ensure_favicon_folder()
     # Use scheme+hostname as favicon filename to reuse icon for all pages on the same domain
-    favicon_name = _url_to_filename(url_parameters['url'])
+    favicon_name = _url_to_filename(url_parameters["url"])
     favicon_file = _check_existing_favicon(favicon_name)
 
     if not favicon_file:
         # Load favicon from provider, save to file
         favicon_url = settings.LD_FAVICON_PROVIDER.format(**url_parameters)
-        logger.debug(f'Loading favicon from: {favicon_url}')
+        logger.debug(f"Loading favicon from: {favicon_url}")
         with requests.get(favicon_url, stream=True) as response:
-            content_type = response.headers['Content-Type']
+            content_type = response.headers["Content-Type"]
             file_extension = mimetypes.guess_extension(content_type)
-            favicon_file = f'{favicon_name}{file_extension}'
+            favicon_file = f"{favicon_name}{file_extension}"
             favicon_path = _get_favicon_path(favicon_file)
-            with open(favicon_path, 'wb') as file:
+            with open(favicon_path, "wb") as file:
                 for chunk in response.iter_content(chunk_size=8192):
                     file.write(chunk)
-        logger.debug(f'Saved favicon as: {favicon_path}')
+        logger.debug(f"Saved favicon as: {favicon_path}")
 
     return favicon_file

bookmarks/services/importer.py

@@ -5,7 +5,7 @@ from typing import List
 from django.contrib.auth.models import User
 from django.utils import timezone
 
-from bookmarks.models import Bookmark, Tag, parse_tag_string
+from bookmarks.models import Bookmark, Tag
 from bookmarks.services import tasks
 from bookmarks.services.parser import parse, NetscapeBookmark
 from bookmarks.utils import parse_timestamp
@@ -55,18 +55,20 @@ class TagCache:
         self.cache[tag.name.lower()] = tag
 
 
-def import_netscape_html(html: str, user: User, options: ImportOptions = ImportOptions()) -> ImportResult:
+def import_netscape_html(
+    html: str, user: User, options: ImportOptions = ImportOptions()
+) -> ImportResult:
     result = ImportResult()
     import_start = timezone.now()
 
     try:
         netscape_bookmarks = parse(html)
     except:
-        logging.exception('Could not read bookmarks file.')
+        logging.exception("Could not read bookmarks file.")
         raise
 
     parse_end = timezone.now()
-    logger.debug(f'Parse duration: {parse_end - import_start}')
+    logger.debug(f"Parse duration: {parse_end - import_start}")
 
     # Create and cache all tags beforehand
     _create_missing_tags(netscape_bookmarks, user)
@@ -83,7 +85,7 @@ def import_netscape_html(html: str, user: User, options: ImportOptions = ImportO
     tasks.schedule_bookmarks_without_favicons(user)
 
     end = timezone.now()
-    logger.debug(f'Import duration: {end - import_start}')
+    logger.debug(f"Import duration: {end - import_start}")
 
     return result
 
@@ -93,8 +95,7 @@ def _create_missing_tags(netscape_bookmarks: List[NetscapeBookmark], user: User)
     tags_to_create = []
 
     for netscape_bookmark in netscape_bookmarks:
-        tag_names = parse_tag_string(netscape_bookmark.tag_string)
-        for tag_name in tag_names:
+        for tag_name in netscape_bookmark.tag_names:
             tag = tag_cache.get(tag_name)
             if not tag:
                 tag = Tag(name=tag_name, owner=user)
@@ -111,7 +112,7 @@ def _get_batches(items: List, batch_size: int):
     num_items = len(items)
 
     while offset < num_items:
-        batch = items[offset:min(offset + batch_size, num_items)]
+        batch = items[offset : min(offset + batch_size, num_items)]
         if len(batch) > 0:
             batches.append(batch)
         offset = offset + batch_size
@@ -119,11 +120,13 @@ def _get_batches(items: List, batch_size: int):
     return batches
 
 
-def _import_batch(netscape_bookmarks: List[NetscapeBookmark],
+def _import_batch(
+    netscape_bookmarks: List[NetscapeBookmark],
     user: User,
     options: ImportOptions,
     tag_cache: TagCache,
-                  result: ImportResult):
+    result: ImportResult,
+):
     # Query existing bookmarks
     batch_urls = [bookmark.href for bookmark in netscape_bookmarks]
     existing_bookmarks = Bookmark.objects.filter(owner=user, url__in=batch_urls)
@@ -137,7 +140,13 @@ def _import_batch(netscape_bookmarks: List[NetscapeBookmark],
         try:
             # Lookup existing bookmark by URL, or create new bookmark if there is no bookmark for that URL yet
             bookmark = next(
-                (bookmark for bookmark in existing_bookmarks if bookmark.url == netscape_bookmark.href), None)
+                (
+                    bookmark
+                    for bookmark in existing_bookmarks
+                    if bookmark.url == netscape_bookmark.href
+                ),
+                None,
+            )
             if not bookmark:
                 bookmark = Bookmark(owner=user)
                 is_update = False
@@ -147,7 +156,7 @@ def _import_batch(netscape_bookmarks: List[NetscapeBookmark],
             _copy_bookmark_data(netscape_bookmark, bookmark, options)
             # Validate bookmark fields, exclude owner to prevent n+1 database query,
             # also there is no specific validation on owner
-            bookmark.clean_fields(exclude=['owner'])
+            bookmark.clean_fields(exclude=["owner"])
             # Schedule for update or insert
             if is_update:
                 bookmarks_to_update.append(bookmark)
@@ -156,19 +165,25 @@ def _import_batch(netscape_bookmarks: List[NetscapeBookmark],
 
             result.success = result.success + 1
         except:
-            shortened_bookmark_tag_str = str(netscape_bookmark)[:100] + '...'
-            logging.exception('Error importing bookmark: ' + shortened_bookmark_tag_str)
+            shortened_bookmark_tag_str = str(netscape_bookmark)[:100] + "..."
+            logging.exception("Error importing bookmark: " + shortened_bookmark_tag_str)
             result.failed = result.failed + 1
 
     # Bulk update bookmarks in DB
-    Bookmark.objects.bulk_update(bookmarks_to_update, ['url',
-                                                       'date_added',
-                                                       'date_modified',
-                                                       'unread',
-                                                       'shared',
-                                                       'title',
-                                                       'description',
-                                                       'owner'])
+    Bookmark.objects.bulk_update(
+        bookmarks_to_update,
+        [
+            "url",
+            "date_added",
+            "date_modified",
+            "unread",
+            "shared",
+            "title",
+            "description",
+            "notes",
+            "owner",
+        ],
+    )
     # Bulk insert new bookmarks into DB
     Bookmark.objects.bulk_create(bookmarks_to_create)
 
@@ -183,18 +198,24 @@ def _import_batch(netscape_bookmarks: List[NetscapeBookmark],
     for netscape_bookmark in netscape_bookmarks:
         # Lookup bookmark by URL again
         bookmark = next(
-            (bookmark for bookmark in existing_bookmarks if bookmark.url == netscape_bookmark.href), None)
+            (
+                bookmark
+                for bookmark in existing_bookmarks
+                if bookmark.url == netscape_bookmark.href
+            ),
+            None,
+        )
 
         if not bookmark:
             # Something is wrong, we should have just created this bookmark
-            shortened_bookmark_tag_str = str(netscape_bookmark)[:100] + '...'
+            shortened_bookmark_tag_str = str(netscape_bookmark)[:100] + "..."
             logging.warning(
-                f'Failed to assign tags to the bookmark: {shortened_bookmark_tag_str}. Could not find bookmark by URL.')
+                f"Failed to assign tags to the bookmark: {shortened_bookmark_tag_str}. Could not find bookmark by URL."
+            )
             continue
 
         # Get tag models by string, schedule inserts for bookmark -> tag associations
-        tag_names = parse_tag_string(netscape_bookmark.tag_string)
-        tags = tag_cache.get_all(tag_names)
+        tags = tag_cache.get_all(netscape_bookmark.tag_names)
         for tag in tags:
             relationships.append(BookmarkToTagRelationShip(bookmark=bookmark, tag=tag))
 
@@ -202,7 +223,9 @@ def _import_batch(netscape_bookmarks: List[NetscapeBookmark],
     BookmarkToTagRelationShip.objects.bulk_create(relationships, ignore_conflicts=True)
 
 
-def _copy_bookmark_data(netscape_bookmark: NetscapeBookmark, bookmark: Bookmark, options: ImportOptions):
+def _copy_bookmark_data(
+    netscape_bookmark: NetscapeBookmark, bookmark: Bookmark, options: ImportOptions
+):
     bookmark.url = netscape_bookmark.href
     if netscape_bookmark.date_added:
         bookmark.date_added = parse_timestamp(netscape_bookmark.date_added)
@@ -214,5 +237,9 @@ def _copy_bookmark_data(netscape_bookmark: NetscapeBookmark, bookmark: Bookmark,
         bookmark.title = netscape_bookmark.title
     if netscape_bookmark.description:
         bookmark.description = netscape_bookmark.description
+    if netscape_bookmark.notes:
+        bookmark.notes = netscape_bookmark.notes
     if options.map_private_flag and not netscape_bookmark.private:
         bookmark.shared = True
+    if netscape_bookmark.archived:
+        bookmark.is_archived = True

bookmarks/services/parser.py

@@ -2,16 +2,20 @@ from dataclasses import dataclass
 from html.parser import HTMLParser
 from typing import Dict, List
 
+from bookmarks.models import parse_tag_string
+
 
 @dataclass
 class NetscapeBookmark:
     href: str
     title: str
     description: str
+    notes: str
     date_added: str
-    tag_string: str
+    tag_names: List[str]
     to_read: bool
     private: bool
+    archived: bool
 
 
 class BookmarkParser(HTMLParser):
@@ -21,28 +25,29 @@ class BookmarkParser(HTMLParser):
 
         self.current_tag = None
         self.bookmark = None
-        self.href = ''
-        self.add_date = ''
-        self.tags = ''
-        self.title = ''
-        self.description = ''
-        self.toread = ''
-        self.private = ''
+        self.href = ""
+        self.add_date = ""
+        self.tags = ""
+        self.title = ""
+        self.description = ""
+        self.notes = ""
+        self.toread = ""
+        self.private = ""
 
     def handle_starttag(self, tag: str, attrs: list):
-        name = 'handle_start_' + tag.lower()
+        name = "handle_start_" + tag.lower()
         if name in dir(self):
             getattr(self, name)({k.lower(): v for k, v in attrs})
         self.current_tag = tag
 
     def handle_endtag(self, tag: str):
-        name = 'handle_end_' + tag.lower()
+        name = "handle_end_" + tag.lower()
         if name in dir(self):
             getattr(self, name)()
         self.current_tag = None
 
     def handle_data(self, data):
-        name = f'handle_{self.current_tag}_data'
+        name = f"handle_{self.current_tag}_data"
         if name in dir(self):
             getattr(self, name)(data)
 
@@ -54,36 +59,50 @@ class BookmarkParser(HTMLParser):
 
     def handle_start_a(self, attrs: Dict[str, str]):
         vars(self).update(attrs)
+        tag_names = parse_tag_string(self.tags)
+        archived = "linkding:archived" in self.tags
+        try:
+            tag_names.remove("linkding:archived")
+        except ValueError:
+            pass
+
         self.bookmark = NetscapeBookmark(
             href=self.href,
-            title='',
-            description='',
+            title="",
+            description="",
+            notes="",
             date_added=self.add_date,
-            tag_string=self.tags,
-            to_read=self.toread == '1',
+            tag_names=tag_names,
+            to_read=self.toread == "1",
             # Mark as private by default, also when attribute is not specified
-            private=self.private != '0',
+            private=self.private != "0",
+            archived=archived,
         )
 
     def handle_a_data(self, data):
         self.title = data.strip()
 
     def handle_dd_data(self, data):
-        self.description = data.strip()
+        desc = data.strip()
+        if "[linkding-notes]" in desc:
+            self.notes = desc.split("[linkding-notes]")[1].split("[/linkding-notes]")[0]
+        self.description = desc.split("[linkding-notes]")[0]
 
     def add_bookmark(self):
         if self.bookmark:
             self.bookmark.title = self.title
             self.bookmark.description = self.description
+            self.bookmark.notes = self.notes
             self.bookmarks.append(self.bookmark)
         self.bookmark = None
-        self.href = ''
-        self.add_date = ''
-        self.tags = ''
-        self.title = ''
-        self.description = ''
-        self.toread = ''
-        self.private = ''
+        self.href = ""
+        self.add_date = ""
+        self.tags = ""
+        self.title = ""
+        self.description = ""
+        self.notes = ""
+        self.toread = ""
+        self.private = ""
 
 
 def parse(html: str) -> List[NetscapeBookmark]:

bookmarks/services/tags.py

@@ -13,7 +13,7 @@ logger = logging.getLogger(__name__)
 
 def get_or_create_tags(tag_names: List[str], user: User):
     tags = [get_or_create_tag(tag_name, user) for tag_name in tag_names]
-    return unique(tags, operator.attrgetter('id'))
+    return unique(tags, operator.attrgetter("id"))
 
 
 def get_or_create_tag(name: str, user: User):

bookmarks/services/tasks.py

@@ -18,8 +18,10 @@ logger = logging.getLogger(__name__)
 
 def is_web_archive_integration_active(user: User) -> bool:
     background_tasks_enabled = not settings.LD_DISABLE_BACKGROUND_TASKS
-    web_archive_integration_enabled = \
-        user.profile.web_archive_integration == UserProfile.WEB_ARCHIVE_INTEGRATION_ENABLED
+    web_archive_integration_enabled = (
+        user.profile.web_archive_integration
+        == UserProfile.WEB_ARCHIVE_INTEGRATION_ENABLED
+    )
 
     return background_tasks_enabled and web_archive_integration_enabled
 
@@ -31,28 +33,36 @@ def create_web_archive_snapshot(user: User, bookmark: Bookmark, force_update: bo
 
 def _load_newest_snapshot(bookmark: Bookmark):
     try:
-        logger.info(f'Load existing snapshot for bookmark. url={bookmark.url}')
-        cdx_api = bookmarks.services.wayback.CustomWaybackMachineCDXServerAPI(bookmark.url)
+        logger.info(f"Load existing snapshot for bookmark. url={bookmark.url}")
+        cdx_api = bookmarks.services.wayback.CustomWaybackMachineCDXServerAPI(
+            bookmark.url
+        )
         existing_snapshot = cdx_api.newest()
 
         if existing_snapshot:
             bookmark.web_archive_snapshot_url = existing_snapshot.archive_url
-            bookmark.save(update_fields=['web_archive_snapshot_url'])
-            logger.info(f'Using newest snapshot. url={bookmark.url} from={existing_snapshot.datetime_timestamp}')
+            bookmark.save(update_fields=["web_archive_snapshot_url"])
+            logger.info(
+                f"Using newest snapshot. url={bookmark.url} from={existing_snapshot.datetime_timestamp}"
+            )
 
     except NoCDXRecordFound:
-        logger.info(f'Could not find any snapshots for bookmark. url={bookmark.url}')
+        logger.info(f"Could not find any snapshots for bookmark. url={bookmark.url}")
     except WaybackError as error:
-        logger.error(f'Failed to load existing snapshot. url={bookmark.url}', exc_info=error)
+        logger.error(
+            f"Failed to load existing snapshot. url={bookmark.url}", exc_info=error
+        )
 
 
 def _create_snapshot(bookmark: Bookmark):
-    logger.info(f'Create new snapshot for bookmark. url={bookmark.url}...')
-    archive = waybackpy.WaybackMachineSaveAPI(bookmark.url, DEFAULT_USER_AGENT, max_tries=1)
+    logger.info(f"Create new snapshot for bookmark. url={bookmark.url}...")
+    archive = waybackpy.WaybackMachineSaveAPI(
+        bookmark.url, DEFAULT_USER_AGENT, max_tries=1
+    )
     archive.save()
     bookmark.web_archive_snapshot_url = archive.archive_url
-    bookmark.save(update_fields=['web_archive_snapshot_url'])
-    logger.info(f'Successfully created new snapshot for bookmark:. url={bookmark.url}')
+    bookmark.save(update_fields=["web_archive_snapshot_url"])
+    logger.info(f"Successfully created new snapshot for bookmark:. url={bookmark.url}")
 
 
 @background()
@@ -72,10 +82,13 @@ def _create_web_archive_snapshot_task(bookmark_id: int, force_update: bool):
         return
     except TooManyRequestsError:
         logger.error(
-            f'Failed to create snapshot due to rate limiting, trying to load newest snapshot as fallback. url={bookmark.url}')
+            f"Failed to create snapshot due to rate limiting, trying to load newest snapshot as fallback. url={bookmark.url}"
+        )
     except WaybackError as error:
-        logger.error(f'Failed to create snapshot, trying to load newest snapshot as fallback. url={bookmark.url}',
-                     exc_info=error)
+        logger.error(
+            f"Failed to create snapshot, trying to load newest snapshot as fallback. url={bookmark.url}",
+            exc_info=error,
+        )
 
     # Load the newest snapshot as fallback
     _load_newest_snapshot(bookmark)
@@ -102,7 +115,9 @@ def schedule_bookmarks_without_snapshots(user: User):
 @background()
 def _schedule_bookmarks_without_snapshots_task(user_id: int):
     user = get_user_model().objects.get(id=user_id)
-    bookmarks_without_snapshots = Bookmark.objects.filter(web_archive_snapshot_url__exact='', owner=user)
+    bookmarks_without_snapshots = Bookmark.objects.filter(
+        web_archive_snapshot_url__exact="", owner=user
+    )
 
     for bookmark in bookmarks_without_snapshots:
         # To prevent rate limit errors from the Wayback API only try to load the latest snapshots instead of creating
@@ -128,14 +143,16 @@ def _load_favicon_task(bookmark_id: int):
     except Bookmark.DoesNotExist:
         return
 
-    logger.info(f'Load favicon for bookmark. url={bookmark.url}')
+    logger.info(f"Load favicon for bookmark. url={bookmark.url}")
 
     new_favicon_file = favicon_loader.load_favicon(bookmark.url)
 
     if new_favicon_file != bookmark.favicon_file:
         bookmark.favicon_file = new_favicon_file
-        bookmark.save(update_fields=['favicon_file'])
-        logger.info(f'Successfully updated favicon for bookmark. url={bookmark.url} icon={new_favicon_file}')
+        bookmark.save(update_fields=["favicon_file"])
+        logger.info(
+            f"Successfully updated favicon for bookmark. url={bookmark.url} icon={new_favicon_file}"
+        )
 
 
 def schedule_bookmarks_without_favicons(user: User):
@@ -146,11 +163,13 @@ def schedule_bookmarks_without_favicons(user: User):
 @background()
 def _schedule_bookmarks_without_favicons_task(user_id: int):
     user = get_user_model().objects.get(id=user_id)
-    bookmarks = Bookmark.objects.filter(favicon_file__exact='', owner=user)
+    bookmarks = Bookmark.objects.filter(favicon_file__exact="", owner=user)
     tasks = []
 
     for bookmark in bookmarks:
-        task = Task.objects.new_task(task_name='bookmarks.services.tasks._load_favicon_task', args=(bookmark.id,))
+        task = Task.objects.new_task(
+            task_name="bookmarks.services.tasks._load_favicon_task", args=(bookmark.id,)
+        )
         tasks.append(task)
 
     Task.objects.bulk_create(tasks)
@@ -168,7 +187,9 @@ def _schedule_refresh_favicons_task(user_id: int):
     tasks = []
 
     for bookmark in bookmarks:
-        task = Task.objects.new_task(task_name='bookmarks.services.tasks._load_favicon_task', args=(bookmark.id,))
+        task = Task.objects.new_task(
+            task_name="bookmarks.services.tasks._load_favicon_task", args=(bookmark.id,)
+        )
         tasks.append(task)
 
     Task.objects.bulk_create(tasks)

bookmarks/services/wayback.py

@@ -14,8 +14,10 @@ class CustomWaybackMachineCDXServerAPI(waybackpy.WaybackMachineCDXServerAPI):
 
     def newest(self):
         unix_timestamp = int(time.time())
-        self.closest = waybackpy.utils.unix_timestamp_to_wayback_timestamp(unix_timestamp)
-        self.sort = 'closest'
+        self.closest = waybackpy.utils.unix_timestamp_to_wayback_timestamp(
+            unix_timestamp
+        )
+        self.sort = "closest"
         self.limit = -5
 
         newest_snapshot = None
@@ -37,4 +39,4 @@ class CustomWaybackMachineCDXServerAPI(waybackpy.WaybackMachineCDXServerAPI):
         super().add_payload(payload)
         # Set fastLatest query param, as we are only using this API to get the latest snapshot and using fastLatest
         # makes searching for latest snapshots faster
-        payload['fastLatest'] = 'true'
+        payload["fastLatest"] = "true"

bookmarks/services/website_loader.py

@@ -18,9 +18,9 @@ class WebsiteMetadata:
 
     def to_dict(self):
         return {
-            'url': self.url,
-            'title': self.title,
-            'description': self.description,
+            "url": self.url,
+            "title": self.title,
+            "description": self.description,
         }
 
 
@@ -34,17 +34,29 @@ def load_website_metadata(url: str):
         start = timezone.now()
         page_text = load_page(url)
         end = timezone.now()
-        logger.debug(f'Load duration: {end - start}')
+        logger.debug(f"Load duration: {end - start}")
 
         start = timezone.now()
-        soup = BeautifulSoup(page_text, 'html.parser')
+        soup = BeautifulSoup(page_text, "html.parser")
 
         title = soup.title.string.strip() if soup.title is not None else None
-        description_tag = soup.find('meta', attrs={'name': 'description'})
-        description = description = description_tag['content'].strip() if description_tag and description_tag[
-            'content'] else None
+        description_tag = soup.find("meta", attrs={"name": "description"})
+        description = (
+            description_tag["content"].strip()
+            if description_tag and description_tag["content"]
+            else None
+        )
+
+        if not description:
+            description_tag = soup.find("meta", attrs={"property": "og:description"})
+            description = (
+                description_tag["content"].strip()
+                if description_tag and description_tag["content"]
+                else None
+            )
+
         end = timezone.now()
-        logger.debug(f'Parsing duration: {end - start}')
+        logger.debug(f"Parsing duration: {end - start}")
     finally:
         return WebsiteMetadata(url=url, title=title, description=description)
 
@@ -68,30 +80,30 @@ def load_page(url: str):
             else:
                 content = content + chunk
 
-            logger.debug(f'Loaded chunk (iteration={iteration}, total={size / 1024})')
+            logger.debug(f"Loaded chunk (iteration={iteration}, total={size / 1024})")
 
             # Stop reading if we have parsed end of head tag
-            end_of_head = '</head>'.encode('utf-8')
+            end_of_head = "</head>".encode("utf-8")
             if end_of_head in content:
-                logger.debug(f'Found closing head tag after {size} bytes')
+                logger.debug(f"Found closing head tag after {size} bytes")
                 content = content.split(end_of_head)[0] + end_of_head
                 break
             # Stop reading if we exceed limit
             if size > MAX_CONTENT_LIMIT:
-                logger.debug(f'Cancel reading document after {size} bytes')
+                logger.debug(f"Cancel reading document after {size} bytes")
                 break
-        if hasattr(r, '_content_consumed'):
-            logger.debug(f'Request consumed: {r._content_consumed}')
+        if hasattr(r, "_content_consumed"):
+            logger.debug(f"Request consumed: {r._content_consumed}")
 
     # Use charset_normalizer to determine encoding that best matches the response content
     # Several sites seem to specify the response encoding incorrectly, so we ignore it and use custom logic instead
     # This is different from Response.text which does respect the encoding specified in the response first,
     # before trying to determine one
-    results = from_bytes(content or '')
+    results = from_bytes(content or "")
     return str(results.best())
 
 
-DEFAULT_USER_AGENT = 'Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/101.0.0.0 Safari/537.36'
+DEFAULT_USER_AGENT = "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/101.0.0.0 Safari/537.36"
 
 
 def fake_request_headers():

bookmarks/signals.py

@@ -1,8 +1,29 @@
+from django.conf import settings
 from django.contrib.auth import user_logged_in
+from django.db.backends.signals import connection_created
 from django.dispatch import receiver
+
 from bookmarks.services import tasks
 
 
 @receiver(user_logged_in)
 def user_logged_in(sender, request, user, **kwargs):
     tasks.schedule_bookmarks_without_snapshots(user)
+
+
+@receiver(connection_created)
+def extend_sqlite(connection=None, **kwargs):
+    # Load ICU extension into Sqlite connection to support case-insensitive
+    # comparisons with unicode characters
+    if connection.vendor == "sqlite" and settings.USE_SQLITE_ICU_EXTENSION:
+        connection.connection.enable_load_extension(True)
+        connection.connection.load_extension(
+            settings.SQLITE_ICU_EXTENSION_PATH.rstrip(".so")
+        )
+
+        with connection.cursor() as cursor:
+            # Load an ICU collation for case-insensitive ordering.
+            # The first param can be a specific locale, it seems that not
+            # providing one will use a default collation from the ICU project
+            # that works reasonably for multiple languages
+            cursor.execute("SELECT icu_load_collation('', 'ICU');")

bookmarks/styles/auth.scss

@@ -1,6 +0,0 @@
-.auth-page {
-  > .columns {
-    align-items: center;
-    justify-content: center;
-  }
-}

bookmarks/styles/base.scss

@@ -1,14 +1,29 @@
+/* Main layout */
 body {
   margin: 20px 10px;
 
   @media (min-width: $size-sm) {
-    // High horizontal padding accounts for checkboxes that show up in bulk edit mode
-    margin: 20px 24px;
+    // Horizontal padding accounts for checkboxes that show up in bulk edit mode
+    margin: 20px 32px;
   }
 }
 
 header {
-  margin-bottom: 40px;
+  margin-bottom: $unit-10;
+
+  .logo {
+    width: 28px;
+    height: 28px;
+  }
+
+  a:hover {
+    text-decoration: none;
+  }
+
+  h1 {
+    margin: 0 0 0 $unit-3;
+    font-size: $font-size-lg;
+  }
 }
 
 header .toasts {
@@ -23,97 +38,107 @@ header .toasts {
   }
 }
 
-.navbar {
+/* Shared components */
 
-  .navbar-brand {
-
-    display: flex;
-    align-items: center;
-
-    .logo {
-      width: 28px;
-      height: 28px;
+// Content area component
+section.content-area {
+  h2 {
+    font-size: $font-size-lg;
   }
 
-    h1 {
-      text-transform: uppercase;
-      display: inline-block;
-      margin: 0 0 0 8px;
-    }
-  }
-
-  .dropdown-toggle {
-  }
-}
-
-/* Overrides */
-
-// Reduce heading sizes
-h1 {
-  font-size: inherit;
-}
-
-h2 {
-  font-size: .85rem;
-  color: $gray-color-dark;
-}
-
-// Fix up visited styles
-a:visited {
-  color: $link-color;
-}
-a:visited:hover {
-  color: $link-color-dark;
-}
-.btn-link:visited:not(.btn-primary) {
-  color: $link-color;
-}
-.btn-link:visited:not(.btn-primary):hover {
-  color: $link-color-dark;
-}
-
-code {
-  color: $gray-color-dark;
-  background-color: $code-bg-color;
-  box-shadow: 1px 1px 0 $code-shadow-color;
-}
-
-// Increase spacing between columns
-.container > .columns > .column:not(:first-child) {
-  padding-left: 2rem;
-}
-
-// Remove left padding from first pagination link
-.pagination .page-item:first-child a {
-  padding-left: 0;
-}
-
-// Override border color for tab block
-.tab-block {
+  .content-area-header {
     border-bottom: solid 1px $border-color;
-}
+    display: flex;
+    flex-wrap: wrap;
+    column-gap: $unit-6;
+    padding-bottom: $unit-2;
+    margin-bottom: $unit-4;
 
-// Form auto-complete menu
-.form-autocomplete .menu {
-  .menu-item.selected > a, .menu-item > a:hover {
-    background: $secondary-color;
-    color: $primary-color;
+    h2 {
+      flex: 0 0 auto;
+      line-height: 1.8rem;
+      margin-bottom: 0;
     }
 
-  .group-item, .group-item:hover {
-    color: $gray-color;
-    text-transform: uppercase;
-    background: none;
-    font-size: 0.6rem;
-    font-weight: bold;
+    .header-controls {
+      flex: 1 1 0;
+      display: flex;
+    }
   }
 }
 
-// Increase input font size on small viewports to prevent zooming on focus the input
-// on mobile devices. 430px relates to the "normalized" iPhone 14 Pro Max
-// viewport size
-@media screen and (max-width: 430px) {
-  .form-input {
-    font-size: 16px;
+// Confirm button component
+span.confirmation {
+  display: flex;
+  align-items: baseline;
+  gap: $unit-1;
+  color: $error-color !important;
+
+  svg {
+    align-self: center;
+  }
+
+  .btn.btn-link {
+    color: $error-color !important;
+
+    &:hover {
+      text-decoration: underline;
+    }
+  }
+}
+
+/* Additional utilities */
+
+.truncate {
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+
+.text-sm {
+  font-size: 0.7rem;
+}
+
+.text-gray-dark {
+  color: $gray-color-dark;
+}
+
+.align-baseline {
+  align-items: baseline;
+}
+
+.align-center {
+  align-items: center;
+}
+
+.justify-between {
+  justify-content: space-between;
+}
+
+.mb-4 {
+  margin-bottom: $unit-4;
+}
+
+.mx-auto {
+  margin-left: auto;
+  margin-right: auto;
+}
+
+.ml-auto {
+  margin-left: auto;
+}
+
+.btn.btn-wide {
+  padding-left: $unit-6;
+  padding-right: $unit-6;
+}
+
+.btn.btn-sm.btn-icon {
+  display: inline-flex;
+  align-items: baseline;
+  gap: $unit-h;
+
+  svg {
+    align-self: center;
   }
 }

bookmarks/styles/bookmark-form.scss

@@ -0,0 +1,50 @@
+.bookmarks-form {
+
+  .btn.form-icon {
+    padding: 0;
+    width: 20px;
+    height: 20px;
+    visibility: hidden;
+    color: $gray-color;
+
+    &:focus,
+    &:hover,
+    &:active,
+    &.active {
+      color: $gray-color-dark;
+    }
+
+    > svg {
+      width: 20px;
+      height: 20px;
+    }
+  }
+
+  .has-icon-right > input, .has-icon-right > textarea {
+    padding-right: 30px;
+  }
+
+  .has-icon-right > input:placeholder-shown ~ .btn.form-icon,
+  .has-icon-right > textarea:placeholder-shown ~ .btn.form-icon {
+    visibility: visible;
+  }
+
+  .form-icon.loading {
+    visibility: hidden;
+  }
+
+  .form-input-hint.bookmark-exists {
+    display: none;
+    color: $warning-color;
+
+    a {
+      color: $warning-color;
+      text-decoration: underline;
+      font-weight: bold;
+    }
+  }
+
+  details.notes textarea {
+    box-sizing: border-box;
+  }
+}

bookmarks/styles/bookmark-page.scss

@@ -1,28 +1,37 @@
-/* Bookmark search box */
-.bookmarks-page .search {
-  $searchbox-width: 180px;
-  $searchbox-width-md: 300px;
-  $searchbox-height: 1.8rem;
+.bookmarks-page.grid {
+  grid-gap: $unit-10;
+}
+
+/* Bookmark area header controls */
+.bookmarks-page .content-area-header {
+  --searchbox-max-width: 350px;
+  --searchbox-height: 1.8rem;
+
+  @media (max-width: $size-sm) {
+    --searchbox-max-width: initial;
+    flex-direction: column;
+  }
+}
+
+.bookmarks-page .search-container {
+  flex: 1 1 0;
+  display: flex;
+  justify-content: flex-end;
 
   // Regular input
   input[type='search'] {
-    width: $searchbox-width;
-    height: $searchbox-height;
+    height: var(--searchbox-height);
     -webkit-appearance: none;
-
-    @media (min-width: $control-width-md) {
-      width: $searchbox-width-md;
-    }
   }
 
   // Enhanced auto-complete input
   // This needs a bit more wrangling to make the CSS component align with the attached button
   .form-autocomplete {
-    height: $searchbox-height;
+    height: var(--searchbox-height);
 
     .form-autocomplete-input {
-      width: $searchbox-width;
-      height: $searchbox-height;
+      width: 100%;
+      height: var(--searchbox-height);
 
       input[type='search'] {
         width: 100%;
@@ -30,9 +39,62 @@
         margin: 0;
         border: none;
       }
+    }
+  }
 
-      @media (min-width: $control-width-md) {
-        width: $searchbox-width-md;
+  .input-group {
+    flex: 1 1 0;
+    min-width: var(--searchbox-min-width);
+    max-width: var(--searchbox-max-width);
+  }
+
+  .input-group > :first-child {
+    flex: 1 1 0;
+  }
+
+  // Group search options button with search button
+  .input-group input[type='submit'] {
+    border-top-right-radius: 0;
+    border-bottom-right-radius: 0;
+  }
+
+  .dropdown-toggle {
+    border-top-left-radius: 0;
+    border-bottom-left-radius: 0;
+  }
+
+  .dropdown {
+    margin-left: -1px;
+  }
+
+  // Search option menu styles
+  .dropdown {
+    .menu {
+      padding: $unit-4;
+      min-width: 250px;
+    }
+
+    .menu .actions {
+      margin-top: $unit-4;
+      display: flex;
+      justify-content: space-between;
+    }
+
+    .radio-group {
+      margin-bottom: $unit-1;
+      .form-label {
+        padding-bottom: 0;
+      }
+      .form-radio.form-inline {
+        margin: 0 $unit-2 0 0;
+        padding: 0;
+        display: inline-flex;
+        align-items: center;
+        column-gap: $unit-1;
+      }
+      .form-icon {
+        top: 0;
+        position: relative;
       }
     }
   }
@@ -45,6 +107,18 @@ ul.bookmark-list {
   padding: 0;
 }
 
+@keyframes appear {
+  0% {
+    opacity: 0;
+  }
+  90% {
+    opacity: 0;
+  }
+  100% {
+    opacity: 1;
+  }
+}
+
 /* Bookmarks */
 li[ld-bookmark-item] {
   position: relative;
@@ -60,11 +134,37 @@ li[ld-bookmark-item] {
     white-space: nowrap;
     overflow: hidden;
     text-overflow: ellipsis;
+
+    &[data-tooltip]:hover::after, &[data-tooltip]:focus::after {
+      content: attr(data-tooltip);
+      position: absolute;
+      z-index: 10;
+      top: 20px;
+      left: 50%;
+      transform: translateX(-50%);
+      width: max-content;
+      max-width: 100%;
+      height: fit-content;
+      background-color: #292f62;
+      color: #fff;
+      padding: $unit-1;
+      border-radius: $border-radius;
+      border: 1px solid #424a8c;
+      font-size: $font-size-sm;
+      font-style: normal;
+      white-space: normal;
+      animation: 0.3s ease 0s appear;
+    }
+  }
+
+  &.unread .title a {
+    font-style: italic;
   }
 
   .title img {
     width: 16px;
     height: 16px;
+    margin-right: $unit-h;
     vertical-align: text-top;
   }
 
@@ -80,11 +180,18 @@ li[ld-bookmark-item] {
     }
   }
 
-  .actions {
+  .actions, .extra-actions {
     display: flex;
     align-items: baseline;
     flex-wrap: wrap;
-    gap: 0.4rem;
+    column-gap: $unit-2;
+  }
+
+  @media (max-width: $size-sm) {
+    .extra-actions {
+      width: 100%;
+      margin-top: $unit-1;
+    }
   }
 
   .actions {
@@ -108,24 +215,17 @@ li[ld-bookmark-item] {
     .separator {
       align-self: flex-start;
     }
-
-    .toggle-notes {
-      align-self: center;
-      display: flex;
-      align-items: center;
-      gap: 0.1rem;
-    }
   }
 }
 
 .bookmark-pagination {
-  margin-top: 1rem;
+  margin-top: $unit-4;
 }
 
 .tag-cloud {
 
   .selected-tags {
-    margin-bottom: 0.8rem;
+    margin-bottom: $unit-4;
 
     a, a:visited:hover {
       color: $error-color;
@@ -139,7 +239,7 @@ li[ld-bookmark-item] {
   }
 
   .group {
-    margin-bottom: 0.4rem;
+    margin-bottom: $unit-2;
   }
 
   .highlight-char {
@@ -149,64 +249,13 @@ li[ld-bookmark-item] {
   }
 }
 
-.bookmarks-form {
-
-  .btn.form-icon {
-    padding: 0;
-    width: 20px;
-    height: 20px;
-    visibility: hidden;
-    color: $gray-color;
-
-    &:focus,
-    &:hover,
-    &:active,
-    &.active {
-      color: $gray-color-dark;
-    }
-
-    > svg {
-      width: 20px;
-      height: 20px;
-    }
-  }
-
-  .has-icon-right > input, .has-icon-right > textarea {
-    padding-right: 30px;
-  }
-
-  .has-icon-right > input:placeholder-shown ~ .btn.form-icon,
-  .has-icon-right > textarea:placeholder-shown ~ .btn.form-icon {
-    visibility: visible;
-  }
-
-  .form-icon.loading {
-    visibility: hidden;
-  }
-
-  .form-input-hint.bookmark-exists {
-    display: none;
-    color: $warning-color;
-
-    a {
-      color: $warning-color;
-      text-decoration: underline;
-      font-weight: bold;
-    }
-  }
-
-  details.notes textarea {
-    box-sizing: border-box;
-  }
-}
-
 /* Bookmark notes */
 ul.bookmark-list {
   .notes {
     display: none;
     max-height: 300px;
-    margin: 4px 0;
-    overflow: auto;
+    margin: $unit-1 0;
+    overflow-y: auto;
   }
 
   &.show-notes .notes,
@@ -218,11 +267,11 @@ ul.bookmark-list {
 /* Bookmark notes markdown styles */
 ul.bookmark-list .notes-content {
   & {
-    padding: 0.4rem 0.6rem;
+    padding: $unit-2 $unit-3;
   }
 
   p, ul, ol, pre, blockquote {
-    margin: 0 0 0.4rem 0;
+    margin: 0 0 $unit-2 0;
   }
 
   > *:first-child {
@@ -234,17 +283,18 @@ ul.bookmark-list .notes-content {
   }
 
   ul, ol {
-    margin-left: 0.8rem;
+    margin-left: $unit-4;
   }
 
   ul li, ol li {
-    margin-top: 0.2rem;
+    margin-top: $unit-1;
   }
 
   pre {
-    padding: 0.2rem 0.4rem;
+    padding: $unit-1 $unit-2;
     background-color: $code-bg-color;
-    border-radius: 0.2rem;
+    border-radius: $unit-1;
+    overflow-x: auto;
   }
 
   pre code {
@@ -268,9 +318,9 @@ $bulk-edit-transition-duration: 400ms;
 
 [ld-bulk-edit] {
   .bulk-edit-bar {
-    margin-top: -17px;
-    margin-bottom: 16px;
+    margin-top: -1px;
     margin-left: -$bulk-edit-bar-offset;
+    margin-bottom: $unit-4;
     max-height: 0;
     overflow: hidden;
     transition: max-height $bulk-edit-transition-duration;
@@ -309,7 +359,7 @@ $bulk-edit-transition-duration: 400ms;
     transition: all $bulk-edit-transition-duration;
 
     .form-icon {
-      top: 0.2rem;
+      top: $unit-1;
     }
   }
 
@@ -322,9 +372,9 @@ $bulk-edit-transition-duration: 400ms;
   .bulk-edit-actions {
     display: flex;
     align-items: baseline;
-    padding: 4px 0;
+    padding: $unit-1 0;
     border-top: solid 1px $border-color;
-    gap: 8px;
+    gap: $unit-2;
 
     button {
       padding: 0 !important;
@@ -334,10 +384,15 @@ $bulk-edit-transition-duration: 400ms;
       text-decoration: underline;
     }
 
-    > input, .form-autocomplete {
+    > input, .form-autocomplete, select {
       width: auto;
-      max-width: 200px;
+      max-width: 140px;
       -webkit-appearance: none;
     }
+
+    .select-across {
+      margin: 0 0 0 auto;
+      font-size: $font-size-sm;
+    }
   }
 }

bookmarks/styles/dark.scss

@@ -1,32 +0,0 @@
-/* Dark theme overrides */
-
-/* Buttons */
-.btn.btn-primary {
-  background: $dt-primary-button-color;
-  border-color: darken($dt-primary-button-color, 5%);
-
-  &:hover, &:active, &:focus {
-    background: darken($dt-primary-button-color, 5%);
-    border-color: darken($dt-primary-button-color, 10%);
-  }
-}
-
-/* Focus ring*/
-a:focus, .btn:focus {
-  box-shadow: 0 0 0 .1rem rgba($primary-color, .5);
-}
-
-/* Forms */
-.has-error .form-input, .form-input.is-error, .has-error .form-select, .form-select.is-error {
-  background: darken($error-color, 40%);
-}
-
-.form-checkbox input:checked + .form-icon, .form-radio input:checked + .form-icon, .form-switch input:checked + .form-icon {
-  background: $dt-primary-button-color;
-  border-color: $dt-primary-button-color;
-}
-
-/* Pagination */
-.pagination .page-item.active a {
-  background: $dt-primary-button-color;
-}

bookmarks/styles/responsive.scss

@@ -0,0 +1,108 @@
+.container {
+  margin-left: auto;
+  margin-right: auto;
+  width: 100%;
+  max-width: $size-lg;
+}
+
+.show-sm,
+.show-md {
+  display: none !important;
+}
+
+.width-25 {
+  width: 25%;
+}
+
+.width-50 {
+  width: 50%;
+}
+
+.width-75 {
+  width: 75%;
+}
+
+.width-100 {
+  width: 100%;
+}
+
+.grid {
+  --grid-columns: 3;
+  display: grid;
+  grid-template-columns: repeat(var(--grid-columns), 1fr);
+  grid-gap: $unit-4;
+}
+
+.grid > * {
+  min-width: 0;
+}
+
+.col-1 {
+  grid-column: unquote("span min(1, var(--grid-columns))");
+}
+
+.col-2 {
+  grid-column: unquote("span min(2, var(--grid-columns))");
+}
+
+.col-3 {
+  grid-column: unquote("span min(3, var(--grid-columns))");
+}
+
+@media (max-width: $size-md) {
+  .hide-md {
+    display: none !important;
+  }
+  .show-md {
+    display: block !important;
+  }
+
+  .width-md-25 {
+    width: 25%;
+  }
+  .width-md-50 {
+    width: 50%;
+  }
+  .width-md-75 {
+    width: 75%;
+  }
+  .width-md-100 {
+    width: 100%;
+  }
+
+  .columns-md-1 {
+    --grid-columns: 1;
+  }
+  .columns-md-2 {
+    --grid-columns: 2;
+  }
+}
+
+@media (max-width: $size-sm) {
+  .hide-sm {
+    display: none !important;
+  }
+  .show-sm {
+    display: block !important;
+  }
+
+  .width-sm-25 {
+    width: 25%;
+  }
+  .width-sm-50 {
+    width: 50%;
+  }
+  .width-sm-75 {
+    width: 75%;
+  }
+  .width-sm-100 {
+    width: 100%;
+  }
+
+  .columns-sm-1 {
+    --grid-columns: 1;
+  }
+  .columns-sm-2 {
+    --grid-columns: 2;
+  }
+}

bookmarks/styles/settings.scss

@@ -1,10 +1,9 @@
 .settings-page {
   section.content-area {
-    margin-bottom: 2rem;
+    margin-bottom: $unit-12;
 
     h2 {
-      font-size: 1.0rem;
-      margin-bottom: 0.8rem;
+      margin-bottom: $unit-4;
     }
   }
 

bookmarks/styles/shared.scss

@@ -1,28 +0,0 @@
-// Content area component
-section.content-area {
-
-  .content-area-header {
-    border-bottom: solid 1px $border-color;
-    display: flex;
-    flex-direction: row;
-    margin-bottom: 16px;
-
-    h2 {
-      line-height: 1.8rem;
-    }
-  }
-}
-
-// Confirm button component
-span.confirmation {
-  display: flex;
-  align-items: baseline;
-}
-
-span.confirmation .btn.btn-link {
-  color: $error-color !important;
-
-  &:hover {
-    text-decoration: underline;
-  }
-}

bookmarks/styles/spectre.scss

@@ -0,0 +1,137 @@
+// Customized Spectre CSS imports, removing modules that are not used
+// See node_modules/spectre.css/src/spectre.scss for the original version
+
+// Variables and mixins
+@import "../../node_modules/spectre.css/src/variables";
+@import "../../node_modules/spectre.css/src/mixins";
+
+/*! Spectre.css v#{$version} | MIT License | github.com/picturepan2/spectre */
+// Reset and dependencies
+@import "../../node_modules/spectre.css/src/normalize";
+@import "../../node_modules/spectre.css/src/base";
+
+// Elements
+@import "../../node_modules/spectre.css/src/typography";
+@import "../../node_modules/spectre.css/src/asian";
+@import "../../node_modules/spectre.css/src/tables";
+@import "../../node_modules/spectre.css/src/buttons";
+@import "../../node_modules/spectre.css/src/forms";
+@import "../../node_modules/spectre.css/src/labels";
+@import "../../node_modules/spectre.css/src/codes";
+@import "../../node_modules/spectre.css/src/media";
+
+// Components
+@import "../../node_modules/spectre.css/src/badges";
+@import "../../node_modules/spectre.css/src/dropdowns";
+@import "../../node_modules/spectre.css/src/empty";
+@import "../../node_modules/spectre.css/src/menus";
+@import "../../node_modules/spectre.css/src/modals";
+@import "../../node_modules/spectre.css/src/pagination";
+@import "../../node_modules/spectre.css/src/tabs";
+@import "../../node_modules/spectre.css/src/toasts";
+@import "../../node_modules/spectre.css/src/tooltips";
+
+// Utility classes
+@import "../../node_modules/spectre.css/src/animations";
+@import "../../node_modules/spectre.css/src/utilities";
+
+// Auto-complete component
+@import "../../node_modules/spectre.css/src/autocomplete";
+
+
+/* Spectre overrides / fixes */
+
+// Fix up visited styles
+a:visited {
+  color: $link-color;
+}
+
+a:visited:hover {
+  color: $link-color-dark;
+}
+
+.btn-link:visited:not(.btn-primary) {
+  color: $link-color;
+}
+
+.btn-link:visited:not(.btn-primary):hover {
+  color: $link-color-dark;
+}
+
+// Disable transitions on buttons, which can otherwise flicker while loading CSS file
+// something to do with .btn applying a transition for background, and then .btn-link setting a different background
+.btn {
+  transition: none !important;
+}
+
+// Fix radio button sub-pixel size
+.form-radio .form-icon {
+  width: 14px;
+  height: 14px;
+  border-width: 1px;
+}
+
+.form-radio input:checked + .form-icon::before {
+  top: 3px;
+  left: 3px;
+  transform: unset;
+}
+
+// Make code work with light and dark theme
+code {
+  color: $gray-color-dark;
+  background-color: $code-bg-color;
+  box-shadow: 1px 1px 0 $code-shadow-color;
+}
+
+// Remove left padding from first pagination link
+.pagination .page-item:first-child a {
+  padding-left: 0;
+}
+
+// Override border color for tab block
+.tab-block {
+  border-bottom: solid 1px $border-color;
+}
+
+// Fix padding for first menu item
+ul.menu li:first-child {
+  margin-top: 0;
+}
+
+// Form auto-complete menu
+.form-autocomplete .menu {
+  .menu-item.selected > a, .menu-item > a:hover {
+    background: $secondary-color;
+    color: $primary-color;
+  }
+
+  .group-item, .group-item:hover {
+    color: $gray-color;
+    text-transform: uppercase;
+    background: none;
+    font-size: 0.6rem;
+    font-weight: bold;
+  }
+}
+
+.modal {
+  // Add border to separate from background in dark mode
+  .modal-container {
+    border: solid 1px $border-color;
+  }
+
+  // Fix modal header to use default color
+  .modal-header {
+    color: inherit;
+  }
+}
+
+// Increase input font size on small viewports to prevent zooming on focus the input
+// on mobile devices. 430px relates to the "normalized" iPhone 14 Pro Max
+// viewport size
+@media screen and (max-width: 430px) {
+  .form-input {
+    font-size: 16px;
+  }
+}

bookmarks/styles/theme-dark.scss

@@ -2,16 +2,53 @@
 @import "variables-dark";
 
 // Import Spectre CSS lib
-@import "../../node_modules/spectre.css/src/spectre";
-@import "../../node_modules/spectre.css/src/autocomplete";
+@import "spectre";
 
 // Import style modules
 @import "base";
-@import "util";
-@import "shared";
-@import "bookmarks";
+@import "responsive";
+@import "bookmark-page";
+@import "bookmark-form";
 @import "settings";
-@import "auth";
 
-// Dark theme overrides
-@import "dark";
+/* Dark theme overrides */
+
+// Buttons
+.btn.btn-primary {
+  background: $dt-primary-button-color;
+  border-color: darken($dt-primary-button-color, 5%);
+
+  &:hover, &:active, &:focus {
+    background: darken($dt-primary-button-color, 5%);
+    border-color: darken($dt-primary-button-color, 10%);
+  }
+}
+
+// Focus ring
+a:focus, .btn:focus {
+  box-shadow: 0 0 0 .1rem rgba($primary-color, .5);
+}
+
+// Forms
+.form-input:not(:placeholder-shown):invalid,
+.form-input:not(:placeholder-shown):invalid:focus,
+.has-error .form-input,
+.form-input.is-error,
+.has-error .form-select,
+.form-select.is-error {
+  background: darken($error-color, 40%);
+}
+
+.form-checkbox input:checked + .form-icon, .form-radio input:checked + .form-icon, .form-switch input:checked + .form-icon {
+  background: $dt-primary-button-color;
+  border-color: $dt-primary-button-color;
+}
+
+.form-radio input:checked + .form-icon::before {
+  background: $light-color;
+}
+
+// Pagination
+.pagination .page-item.active a {
+  background: $dt-primary-button-color;
+}

bookmarks/styles/theme-light.scss

@@ -2,13 +2,11 @@
 @import "variables-light";
 
 // Import Spectre CSS lib
-@import "../../node_modules/spectre.css/src/spectre";
-@import "../../node_modules/spectre.css/src/autocomplete";
+@import "spectre";
 
 // Import style modules
 @import "base";
-@import "util";
-@import "shared";
-@import "bookmarks";
+@import "responsive";
+@import "bookmark-page";
+@import "bookmark-form";
 @import "settings";
-@import "auth";

bookmarks/styles/util.scss

@@ -1,21 +0,0 @@
-.spacer {
-  flex: 1 1 0;
-}
-
-.truncate {
-  white-space: nowrap;
-  overflow: hidden;
-  text-overflow: ellipsis;
-}
-
-.text-sm {
-  font-size: 0.7rem;
-}
-
-.text-gray-dark {
-  color: $gray-color-dark;
-}
-
-.align-baseline {
-  align-items: baseline;
-}

bookmarks/templates/bookmarks/archive.html

@@ -4,25 +4,28 @@
 {% load bookmarks %}
 
 {% block content %}
-  <div class="bookmarks-page columns"
+  <div class="bookmarks-page grid columns-md-1"
        ld-bulk-edit
        ld-bookmark-page
        bookmarks-url="{% url 'bookmarks:partials.bookmark_list.archived' %}"
        tags-url="{% url 'bookmarks:partials.tag_cloud.archived' %}">
 
     {# Bookmark list #}
-    <section class="content-area column col-8 col-md-12">
-      <div class="content-area-header">
+    <section class="content-area col-2">
+      <div class="content-area-header mb-0">
         <h2>Archived bookmarks</h2>
-        <div class="spacer"></div>
-        {% bookmark_search bookmark_list.filters tag_cloud.tags mode='archived' %}
+        <div class="header-controls">
+          {% bookmark_search bookmark_list.search tag_cloud.tags mode='archived' %}
           {% include 'bookmarks/bulk_edit/toggle.html' %}
+          <button ld-modal modal-content=".tag-cloud" class="btn ml-2 show-md">Tags</button>
+        </div>
       </div>
 
-      <form class="bookmark-actions" action="{% url 'bookmarks:action' %}?return_url={{ bookmark_list.return_url }}"
-            method="post">
+      <form class="bookmark-actions"
+            action="{{ bookmark_list.action_url|safe }}"
+            method="post" autocomplete="off">
         {% csrf_token %}
-        {% include 'bookmarks/bulk_edit/bar.html' with mode='archive' %}
+        {% include 'bookmarks/bulk_edit/bar.html' with disable_actions='bulk_archive' %}
 
         <div class="bookmark-list-container">
           {% include 'bookmarks/bookmark_list.html' %}
@@ -31,7 +34,7 @@
     </section>
 
     {# Tag cloud #}
-    <section class="content-area column col-4 hide-md">
+    <section class="content-area col-1 hide-md">
       <div class="content-area-header">
         <h2>Tags</h2>
       </div>
@@ -40,6 +43,4 @@
       </div>
     </section>
   </div>
-
-  <script src="{% static "bundle.js" %}?v={{ app_version }}"></script>
 {% endblock %}

bookmarks/templates/bookmarks/bookmark_list.html

@@ -5,126 +5,118 @@
 {% if bookmark_list.is_empty %}
   {% include 'bookmarks/empty_bookmarks.html' %}
 {% else %}
-  <ul class="bookmark-list{% if bookmark_list.show_notes %} show-notes{% endif %}">
-    {% for bookmark in bookmark_list.bookmarks_page %}
-      <li ld-bookmark-item>
+  <ul class="bookmark-list{% if bookmark_list.show_notes %} show-notes{% endif %}"
+      data-bookmarks-total="{{ bookmark_list.bookmarks_total }}">
+    {% for bookmark_item in bookmark_list.items %}
+      <li ld-bookmark-item{% if bookmark_item.css_classes %} class="{{ bookmark_item.css_classes }}"{% endif %}>
         <label ld-bulk-edit-checkbox class="form-checkbox">
-          <input type="checkbox" name="bookmark_id" value="{{ bookmark.id }}">
+          <input type="checkbox" name="bookmark_id" value="{{ bookmark_item.id }}">
           <i class="form-icon"></i>
         </label>
         <div class="title">
-          <a href="{{ bookmark.url }}" target="{{ bookmark_list.link_target }}" rel="noopener"
-             class="{% if bookmark.unread %}text-italic{% endif %}">
-            {% if bookmark.favicon_file and bookmark_list.show_favicons %}
-              <img src="{% static bookmark.favicon_file %}" alt="">
+          <a href="{{ bookmark_item.url }}" target="{{ bookmark_list.link_target }}" rel="noopener" >
+            {% if bookmark_item.favicon_file and bookmark_list.show_favicons %}
+              <img src="{% static bookmark_item.favicon_file %}" alt="">
             {% endif %}
-            {{ bookmark.resolved_title }}
+              <span>{{ bookmark_item.title }}</span>
           </a>
         </div>
         {% if bookmark_list.show_url %}
           <div class="url-path truncate">
-            <a href="{{ bookmark.url }}" target="{{ bookmark_list.link_target }}" rel="noopener"
+            <a href="{{ bookmark_item.url }}" target="{{ bookmark_list.link_target }}" rel="noopener"
                class="url-display text-sm">
-              {{ bookmark.url }}
+              {{ bookmark_item.url }}
             </a>
           </div>
         {% endif %}
         <div class="description truncate">
-          {% if bookmark.tag_names %}
+          {% if bookmark_item.tag_names %}
             <span>
-              {% for tag_name in bookmark.tag_names %}
+              {% for tag_name in bookmark_item.tag_names %}
                 <a href="?{% add_tag_to_query tag_name %}">{{ tag_name|hash_tag }}</a>
               {% endfor %}
             </span>
           {% endif %}
-          {% if bookmark.tag_names and bookmark.resolved_description %} | {% endif %}
-          {% if bookmark.resolved_description %}
-            <span>{{ bookmark.resolved_description }}</span>
+          {% if bookmark_item.tag_names and bookmark_item.description %} | {% endif %}
+          {% if bookmark_item.description %}
+            <span>{{ bookmark_item.description }}</span>
           {% endif %}
         </div>
-        {% if bookmark.notes %}
+        {% if bookmark_item.notes %}
           <div class="notes bg-gray text-gray-dark">
             <div class="notes-content">
-              {% markdown bookmark.notes %}
+              {% markdown bookmark_item.notes %}
             </div>
           </div>
         {% endif %}
         <div class="actions text-gray text-sm">
-          {% if bookmark_list.date_display == 'relative' %}
-            <span>
-              {% if bookmark.web_archive_snapshot_url %}
-                <a href="{{ bookmark.web_archive_snapshot_url }}"
+          {% if bookmark_item.display_date %}
+            {% if bookmark_item.web_archive_snapshot_url %}
+              <a href="{{ bookmark_item.web_archive_snapshot_url }}"
                  title="Show snapshot on the Internet Archive Wayback Machine"
                  target="{{ bookmark_list.link_target }}"
                  rel="noopener">
-              {% endif %}
-              <span>{{ bookmark.date_added|humanize_relative_date }}</span>
-              {% if bookmark.web_archive_snapshot_url %}
-                ∞
+                {{ bookmark_item.display_date }} ∞
               </a>
+            {% else %}
+              <span>{{ bookmark_item.display_date }}</span>
             {% endif %}
-            </span>
             <span class="separator">|</span>
           {% endif %}
-          {% if bookmark_list.date_display == 'absolute' %}
-            <span>
-              {% if bookmark.web_archive_snapshot_url %}
-                <a href="{{ bookmark.web_archive_snapshot_url }}"
-                   title="Show snapshot on the Internet Archive Wayback Machine"
-                   target="{{ bookmark_list.link_target }}"
-                   rel="noopener">
-              {% endif %}
-              <span>{{ bookmark.date_added|humanize_absolute_date }}</span>
-              {% if bookmark.web_archive_snapshot_url %}
-                ∞
-                </a>
-              {% endif %}
-            </span>
-            <span class="separator">|</span>
-          {% endif %}
-          {% if bookmark.owner == request.user %}
+          {% if bookmark_item.is_editable %}
             {# Bookmark owner actions #}
-            <a href="{% url 'bookmarks:edit' bookmark.id %}?return_url={{ bookmark_list.return_url }}">Edit</a>
-            {% if bookmark.is_archived %}
-              <button type="submit" name="unarchive" value="{{ bookmark.id }}"
+            <a href="{% url 'bookmarks:edit' bookmark_item.id %}?return_url={{ bookmark_list.return_url|urlencode }}">Edit</a>
+            {% if bookmark_item.is_archived %}
+              <button type="submit" name="unarchive" value="{{ bookmark_item.id }}"
                       class="btn btn-link btn-sm">Unarchive
               </button>
             {% else %}
-              <button type="submit" name="archive" value="{{ bookmark.id }}"
+              <button type="submit" name="archive" value="{{ bookmark_item.id }}"
                       class="btn btn-link btn-sm">Archive
               </button>
             {% endif %}
-            <button ld-confirm-button type="submit" name="remove" value="{{ bookmark.id }}"
+            <button ld-confirm-button type="submit" name="remove" value="{{ bookmark_item.id }}"
                     class="btn btn-link btn-sm">Remove
             </button>
-            {% if bookmark.unread %}
-              <span class="separator">|</span>
-              <button type="submit" name="mark_as_read" value="{{ bookmark.id }}"
-                      class="btn btn-link btn-sm">Mark as read
-              </button>
-            {% endif %}
           {% else %}
             {# Shared bookmark actions #}
             <span>Shared by
-              <a href="?{% replace_query_param user=bookmark.owner.username %}">{{ bookmark.owner.username }}</a>
+              <a href="?{% replace_query_param user=bookmark_item.owner.username %}">{{ bookmark_item.owner.username }}</a>
             </span>
           {% endif %}
-          {% if bookmark.notes and not bookmark_list.show_notes %}
-            <span class="separator">|</span>
-            <button class="btn btn-link btn-sm toggle-notes" title="Toggle notes">
-              <svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-notes" width="16"
-                   height="16"
-                   viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round"
-                   stroke-linejoin="round">
-                <path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
-                <path d="M5 3m0 2a2 2 0 0 1 2 -2h10a2 2 0 0 1 2 2v14a2 2 0 0 1 -2 2h-10a2 2 0 0 1 -2 -2z"></path>
-                <path d="M9 7l6 0"></path>
-                <path d="M9 11l6 0"></path>
-                <path d="M9 15l4 0"></path>
+          {% if bookmark_item.has_extra_actions %}
+            <div class="extra-actions">
+              <span class="separator hide-sm">|</span>
+              {% if bookmark_item.show_mark_as_read %}
+                <button type="submit" name="mark_as_read" value="{{ bookmark_item.id }}"
+                        class="btn btn-link btn-sm btn-icon"
+                        ld-confirm-button confirm-icon="ld-icon-read" confirm-question="Mark as read?">
+                  <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16">
+                    <use xlink:href="#ld-icon-unread"></use>
                   </svg>
-              <span>Notes</span>
+                  Unread
                 </button>
               {% endif %}
+              {% if bookmark_item.show_unshare %}
+                <button type="submit" name="unshare" value="{{ bookmark_item.id }}"
+                        class="btn btn-link btn-sm btn-icon"
+                        ld-confirm-button confirm-icon="ld-icon-unshare" confirm-question="Unshare?">
+                  <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16">
+                    <use xlink:href="#ld-icon-share"></use>
+                  </svg>
+                  Shared
+                </button>
+              {% endif %}
+              {% if bookmark_item.show_notes_button %}
+                <button type="button" class="btn btn-link btn-sm btn-icon toggle-notes">
+                  <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16">
+                    <use xlink:href="#ld-icon-note"></use>
+                  </svg>
+                  Notes
+                </button>
+              {% endif %}
+            </div>
+          {% endif %}
         </div>
       </li>
     {% endfor %}

bookmarks/templates/bookmarks/bulk_edit/bar.html

@@ -3,32 +3,37 @@
   <div class="bulk-edit-bar">
     <div class="bulk-edit-actions bg-gray">
       <label ld-bulk-edit-checkbox all class="form-checkbox">
-        <input type="checkbox" style="display: none">
+        <input type="checkbox">
         <i class="form-icon"></i>
       </label>
-      {% if mode == 'archive' %}
-        <button ld-confirm-button type="submit" name="bulk_unarchive" class="btn btn-link btn-sm"
-                title="Unarchive selected bookmarks">Unarchive
-        </button>
-      {% else %}
-        <button ld-confirm-button type="submit" name="bulk_archive" class="btn btn-link btn-sm"
-                title="Archive selected bookmarks">Archive
-        </button>
+      <select name="bulk_action" class="form-select select-sm">
+        {% if not 'bulk_archive' in disable_actions %}
+          <option value="bulk_archive">Archive</option>
         {% endif %}
-      <span class="text-sm text-gray-dark">•</span>
-      <button ld-confirm-button type="submit" name="bulk_delete" class="btn btn-link btn-sm"
-              title="Delete selected bookmarks">Delete
-      </button>
-      <span class="text-sm text-gray-dark">•</span>
-      <span class="text-sm text-gray-dark"><label for="bulk-edit-tags-input">Tags:</label></span>
+        {% if not 'bulk_unarchive' in disable_actions %}
+          <option value="bulk_unarchive">Unarchive</option>
+        {% endif %}
+        <option value="bulk_delete">Delete</option>
+        <option value="bulk_tag">Add tags</option>
+        <option value="bulk_untag">Remove tags</option>
+        <option value="bulk_read">Mark as read</option>
+        <option value="bulk_unread">Mark as unread</option>
+        {% if request.user_profile.enable_sharing %}
+          <option value="bulk_share">Share</option>
+          <option value="bulk_unshare">Unshare</option>
+        {% endif %}
+      </select>
+      <div class="tag-autocomplete d-none">
         <input ld-tag-autocomplete variant="small"
-             name="bulk_tag_string" class="form-input input-sm" placeholder="&nbsp;">
-      <button type="submit" name="bulk_tag" class="btn btn-link btn-sm"
-              title="Add tags to selected bookmarks">Add
-      </button>
-      <button type="submit" name="bulk_untag" class="btn btn-link btn-sm"
-              title="Remove tags from selected bookmarks">Remove
-      </button>
+               name="bulk_tag_string" class="form-input input-sm" placeholder="Tag names...">
+      </div>
+      <button ld-confirm-button type="submit" name="bulk_execute" class="btn btn-link btn-sm">Execute</button>
+
+      <label class="form-checkbox select-across d-none">
+        <input type="checkbox" name="bulk_select_across">
+        <i class="form-icon"></i>
+        All pages (<span class="total">{{ bookmark_list.bookmarks_total }}</span> bookmarks)
+      </label>
     </div>
   </div>
 {% endhtmlmin %}

bookmarks/templates/bookmarks/edit.html

@@ -2,15 +2,13 @@
 {% load bookmarks %}
 
 {% block content %}
-  <div class="columns">
-    <section class="content-area column col-12">
+  <section class="content-area">
     <div class="content-area-header">
       <h2>Edit bookmark</h2>
     </div>
     <form action="{% url 'bookmarks:edit' bookmark_id %}?return_url={{ return_url|urlencode }}" method="post"
-            class="col-6 col-md-12" novalidate>
+          class="width-50 width-md-100" novalidate>
       {% bookmark_form form return_url bookmark_id %}
     </form>
   </section>
-  </div>
 {% endblock %}

bookmarks/templates/bookmarks/form.html

@@ -115,8 +115,6 @@
     {% endif %}
     <a href="{{ cancel_url }}" class="btn">Nevermind</a>
   </div>
-
-  <script src="{% static "bundle.js" %}?v={{ app_version }}"></script>
   <script type="application/javascript">
     /**
      * - Pre-fill title and description placeholders with metadata from website as soon as URL changes
@@ -129,7 +127,6 @@
       const descriptionInput = document.getElementById('{{ form.description.id_for_label }}');
       const notesDetails = document.querySelector('form details.notes');
       const notesInput = document.getElementById('{{ form.notes.id_for_label }}');
-      const tagsInput = document.getElementById('{{ form.tag_string.id_for_label }}');
       const unreadCheckbox = document.getElementById('{{ form.unread.id_for_label }}');
       const sharedCheckbox = document.getElementById('{{ form.shared.id_for_label }}');
       const websiteTitleInput = document.getElementById('{{ form.website_title.id_for_label }}');
@@ -185,6 +182,10 @@
             const bookmarkExistsHint = document.querySelector('.form-input-hint.bookmark-exists');
 
             if (existingBookmark && !editedBookmarkId) {
+              // Workaround: tag input will be replaced by tag autocomplete, so
+              // defer getting the input until we need it
+              const tagsInput = document.getElementById('{{ form.tag_string.id_for_label }}');
+
               bookmarkExistsHint.style['display'] = 'block';
               notesDetails.open = !!existingBookmark.notes;
               updateInput(titleInput, existingBookmark.title);

bookmarks/templates/bookmarks/index.html

@@ -4,25 +4,28 @@
 {% load bookmarks %}
 
 {% block content %}
-  <div class="bookmarks-page columns"
+  <div class="bookmarks-page grid columns-md-1"
        ld-bulk-edit
        ld-bookmark-page
        bookmarks-url="{% url 'bookmarks:partials.bookmark_list.active' %}"
        tags-url="{% url 'bookmarks:partials.tag_cloud.active' %}">
 
     {# Bookmark list #}
-    <section class="content-area column col-8 col-md-12">
-      <div class="content-area-header">
+    <section class="content-area col-2">
+      <div class="content-area-header mb-0">
         <h2>Bookmarks</h2>
-        <div class="spacer"></div>
-        {% bookmark_search bookmark_list.filters tag_cloud.tags %}
+        <div class="header-controls">
+          {% bookmark_search bookmark_list.search tag_cloud.tags %}
           {% include 'bookmarks/bulk_edit/toggle.html' %}
+          <button ld-modal modal-content=".tag-cloud" class="btn ml-2 show-md">Tags</button>
+        </div>
       </div>
 
-      <form class="bookmark-actions" action="{% url 'bookmarks:action' %}?return_url={{ bookmark_list.return_url }}"
-            method="post">
+      <form class="bookmark-actions"
+            action="{{ bookmark_list.action_url|safe }}"
+            method="post" autocomplete="off">
         {% csrf_token %}
-        {% include 'bookmarks/bulk_edit/bar.html' with mode='default' %}
+        {% include 'bookmarks/bulk_edit/bar.html' with disable_actions='bulk_unarchive' %}
 
         <div class="bookmark-list-container">
           {% include 'bookmarks/bookmark_list.html' %}
@@ -31,8 +34,8 @@
     </section>
 
     {# Tag cloud #}
-    <section class="content-area column col-4 hide-md">
-      <div class="content-area-header">
+    <section class="content-area col-1 hide-md">
+      <div class="content-area-header mb-4">
         <h2>Tags</h2>
       </div>
       <div class="tag-cloud-container">
@@ -40,6 +43,4 @@
       </div>
     </section>
   </div>
-
-  <script src="{% static "bundle.js" %}?v={{ app_version }}"></script>
 {% endblock %}

bookmarks/templates/bookmarks/layout.html

@@ -30,9 +30,69 @@
   {% endif %}
 </head>
 <body ld-global-shortcuts>
-<header>
+
+<div class="d-none">
+  <svg xmlns="http://www.w3.org/2000/svg">
+    <symbol id="ld-icon-unread" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none"
+            stroke-linecap="round" stroke-linejoin="round">
+      <path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
+      <path d="M3 19a9 9 0 0 1 9 0a9 9 0 0 1 9 0"></path>
+      <path d="M3 6a9 9 0 0 1 9 0a9 9 0 0 1 9 0"></path>
+      <path d="M3 6l0 13"></path>
+      <path d="M12 6l0 13"></path>
+      <path d="M21 6l0 13"></path>
+    </symbol>
+  </svg>
+  <svg xmlns="http://www.w3.org/2000/svg">
+    <symbol id="ld-icon-read" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none"
+            stroke-linecap="round" stroke-linejoin="round">
+      <path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
+      <path d="M3 19a9 9 0 0 1 9 0a9 9 0 0 1 5.899 -1.096"></path>
+      <path d="M3 6a9 9 0 0 1 2.114 -.884m3.8 -.21c1.07 .17 2.116 .534 3.086 1.094a9 9 0 0 1 9 0"></path>
+      <path d="M3 6v13"></path>
+      <path d="M12 6v2m0 4v7"></path>
+      <path d="M21 6v11"></path>
+      <path d="M3 3l18 18"></path>
+    </symbol>
+  </svg>
+  <svg xmlns="http://www.w3.org/2000/svg">
+    <symbol id="ld-icon-share" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none"
+            stroke-linecap="round" stroke-linejoin="round">
+      <path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
+      <path d="M6 12m-3 0a3 3 0 1 0 6 0a3 3 0 1 0 -6 0"></path>
+      <path d="M18 6m-3 0a3 3 0 1 0 6 0a3 3 0 1 0 -6 0"></path>
+      <path d="M18 18m-3 0a3 3 0 1 0 6 0a3 3 0 1 0 -6 0"></path>
+      <path d="M8.7 10.7l6.6 -3.4"></path>
+      <path d="M8.7 13.3l6.6 3.4"></path>
+    </symbol>
+  </svg>
+  <svg xmlns="http://www.w3.org/2000/svg">
+    <symbol id="ld-icon-unshare" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none"
+            stroke-linecap="round" stroke-linejoin="round">
+      <path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
+      <path d="M6 12m-3 0a3 3 0 1 0 6 0a3 3 0 1 0 -6 0"></path>
+      <path d="M18 6m-3 0a3 3 0 1 0 6 0a3 3 0 1 0 -6 0"></path>
+      <path d="M15.861 15.896a3 3 0 0 0 4.265 4.22m.578 -3.417a3.012 3.012 0 0 0 -1.507 -1.45"></path>
+      <path d="M8.7 10.7l1.336 -.688m2.624 -1.352l2.64 -1.36"></path>
+      <path d="M8.7 13.3l6.6 3.4"></path>
+      <path d="M3 3l18 18"></path>
+    </symbol>
+  </svg>
+  <svg xmlns="http://www.w3.org/2000/svg">
+    <symbol id="ld-icon-note" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none"
+            stroke-linecap="round" stroke-linejoin="round">
+      <path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
+      <path d="M5 3m0 2a2 2 0 0 1 2 -2h10a2 2 0 0 1 2 2v14a2 2 0 0 1 -2 2h-10a2 2 0 0 1 -2 -2z"></path>
+      <path d="M9 7l6 0"></path>
+      <path d="M9 11l6 0"></path>
+      <path d="M9 15l4 0"></path>
+    </symbol>
+  </svg>
+</div>
+
+<header class="container">
   {% if has_toasts %}
-    <div class="toasts container grid-lg">
+    <div class="toasts">
       <form action="{% url 'bookmarks:toasts.acknowledge' %}?return_url={{ request.path | urlencode }}" method="post">
         {% csrf_token %}
         {% for toast in toast_messages %}
@@ -44,29 +104,24 @@
       </form>
     </div>
   {% endif %}
-  <div class="navbar container grid-lg">
-    <section class="navbar-section">
-      <a href="{% url 'bookmarks:index' %}" class="navbar-brand text-bold">
+  <div class="d-flex justify-between">
+    <a href="{% url 'bookmarks:index' %}" class="d-flex align-center">
       <img class="logo" src="{% static 'logo.png' %}" alt="Application logo">
-        <h1>linkding</h1>
+      <h1>LINKDING</h1>
     </a>
-    </section>
     {% if request.user.is_authenticated %}
       {# Only show nav items menu when logged in #}
-      <section class="navbar-section">
       {% include 'bookmarks/nav_menu.html' %}
-      </section>
     {% elif has_public_shares %}
       {# Otherwise show link to shared bookmarks if there are publicly shared bookmarks #}
-      <section class="navbar-section">
       <a href="{% url 'bookmarks:shared' %}" class="btn btn-link">Shared bookmarks</a>
-      </section>
     {% endif %}
   </div>
 </header>
-<div class="content container grid-lg">
+<div class="content container">
   {% block content %}
   {% endblock %}
 </div>
+<script src="{% static "bundle.js" %}?v={{ app_version }}"></script>
 </body>
 </html>

bookmarks/templates/bookmarks/nav_menu.html

@@ -26,7 +26,7 @@
         </li>
       {% endif %}
       <li>
-        <a href="{% url 'bookmarks:index' %}?q=!unread" class="btn btn-link">Unread</a>
+        <a href="{% url 'bookmarks:index' %}?unread=yes" class="btn btn-link">Unread</a>
       </li>
       <li>
         <a href="{% url 'bookmarks:index' %}?q=!untagged" class="btn btn-link">Untagged</a>
@@ -44,8 +44,8 @@
       <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 6v6m0 0v6m0-6h6m-6 0H6"/>
     </svg>
   </a>
-  <div class="dropdown dropdown-right">
-    <a href="#" id="mobile-nav-menu-trigger" class="btn btn-link dropdown-toggle" tabindex="0">
+  <div ld-dropdown class="dropdown dropdown-right">
+    <a href="#" class="btn btn-link dropdown-toggle" tabindex="0">
       <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor"
            style="width: 24px; height: 24px">
         <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16"/>
@@ -65,7 +65,7 @@
         </li>
       {% endif %}
       <li style="padding-left: 1rem">
-        <a href="{% url 'bookmarks:index' %}?q=!unread" class="btn btn-link">Unread</a>
+        <a href="{% url 'bookmarks:index' %}?unread=yes" class="btn btn-link">Unread</a>
       </li>
       <li style="padding-left: 1rem">
         <a href="{% url 'bookmarks:index' %}?q=!untagged" class="btn btn-link">Untagged</a>
@@ -80,22 +80,3 @@
   </div>
 </div>
 {% endhtmlmin %}
-<script>
-  // Hide mobile menu on outside click
-  // The Spectre CSS component relies on focus changes to show/hide the dropdown, however mobile browsers like
-  // Safari will not trigger a blur event when clicking on a non-focusable element, so we have to simulate the
-  // behaviour through Javascript
-  const mobileNavMenuTrigger = document.getElementById('mobile-nav-menu-trigger');
-
-  function mobileNavMenuOutsideClickHandler(clickEvent) {
-    if (mobileNavMenuTrigger.parentElement.contains(clickEvent.target)) return
-    mobileNavMenuTrigger.blur();
-  }
-
-  mobileNavMenuTrigger.addEventListener('focus', function () {
-    document.addEventListener('click', mobileNavMenuOutsideClickHandler);
-  })
-  mobileNavMenuTrigger.addEventListener('blur', function () {
-    document.removeEventListener('click', mobileNavMenuOutsideClickHandler);
-  })
-</script>

bookmarks/templates/bookmarks/new.html

@@ -2,14 +2,12 @@
 {% load bookmarks %}
 
 {% block content %}
-  <div class="columns">
-    <section class="content-area column col-12">
+  <section class="content-area">
     <div class="content-area-header">
       <h2>New bookmark</h2>
     </div>
-      <form action="{% url 'bookmarks:new' %}" method="post" class="col-6 col-md-12" novalidate>
+    <form action="{% url 'bookmarks:new' %}" method="post" class="width-50 width-md-100" novalidate>
       {% bookmark_form form return_url auto_close=auto_close %}
     </form>
   </section>
-  </div>
 {% endblock %}

bookmarks/templates/bookmarks/search.html

@@ -1,43 +1,108 @@
-<div class="search">
-  <form action="" method="get" role="search">
-    <div class="input-group">
-            <span id="search-input-wrap">
+{% load widget_tweaks %}
+
+<div class="search-container">
+  <form id="search" class="input-group" action="" method="get" role="search">
     <input type="search" class="form-input" name="q" placeholder="Search for words or #tags"
-                       value="{{ filters.query }}">
-            </span>
+           value="{{ search.q }}">
     <input type="submit" value="Search" class="btn input-group-btn">
-    </div>
-    {% if filters.user %}
-      <input type="hidden" name="user" value="{{ filters.user }}">
-    {% endif %}
+    {% for hidden_field in search_form.hidden_fields %}
+      {{ hidden_field }}
+    {% endfor %}
   </form>
+  <div ld-dropdown class="search-options dropdown dropdown-right">
+    <button type="button" class="btn dropdown-toggle{% if search.has_modified_preferences %} badge{% endif %}">
+      <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" stroke-width="2"
+           stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
+        <path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
+        <path d="M4 10a2 2 0 1 0 4 0a2 2 0 0 0 -4 0"></path>
+        <path d="M6 4v4"></path>
+        <path d="M6 12v8"></path>
+        <path d="M10 16a2 2 0 1 0 4 0a2 2 0 0 0 -4 0"></path>
+        <path d="M12 4v10"></path>
+        <path d="M12 18v2"></path>
+        <path d="M16 7a2 2 0 1 0 4 0a2 2 0 0 0 -4 0"></path>
+        <path d="M18 4v1"></path>
+        <path d="M18 9v11"></path>
+      </svg>
+    </button>
+    <div class="menu text-sm" tabindex="0">
+      <form id="search_preferences" action="" method="post">
+        {% csrf_token %}
+        {% if 'sort' in preferences_form.editable_fields %}
+          <div class="form-group">
+            <label for="{{ preferences_form.sort.id_for_label }}"
+                   class="form-label{% if 'sort' in search.modified_params %} text-bold{% endif %}">Sort by</label>
+            {{ preferences_form.sort|add_class:"form-select select-sm" }}
+          </div>
+        {% endif %}
+        {% if 'shared' in preferences_form.editable_fields %}
+          <div class="form-group radio-group">
+            <div class="form-label{% if 'shared' in search.modified_params %} text-bold{% endif %}">Shared filter</div>
+            {% for radio in preferences_form.shared %}
+              <label for="{{ radio.id_for_label }}" class="form-radio form-inline">
+                {{ radio.tag }}
+                <i class="form-icon"></i>
+                {{ radio.choice_label }}
+              </label>
+            {% endfor %}
+          </div>
+        {% endif %}
+        {% if 'unread' in preferences_form.editable_fields %}
+          <div class="form-group radio-group">
+            <div class="form-label{% if 'unread' in search.modified_params %} text-bold{% endif %}">Unread filter</div>
+            {% for radio in preferences_form.unread %}
+              <label for="{{ radio.id_for_label }}" class="form-radio form-inline">
+                {{ radio.tag }}
+                <i class="form-icon"></i>
+                {{ radio.choice_label }}
+              </label>
+            {% endfor %}
+          </div>
+        {% endif %}
+        <div class="actions">
+          <button type="submit" class="btn btn-sm btn-primary" name="apply">Apply</button>
+          {% if request.user.is_authenticated %}
+            <button type="submit" class="btn btn-sm" name="save">Save as default</button>
+          {% endif %}
+        </div>
+
+        {% for hidden_field in preferences_form.hidden_fields %}
+          {{ hidden_field }}
+        {% endfor %}
+      </form>
+    </div>
+  </div>
 </div>
 
+
 {# Replace search input with auto-complete component #}
 <script type="application/javascript">
   window.addEventListener("load", function () {
     const currentTagsString = '{{ tags_string }}';
     const currentTags = currentTagsString.split(' ');
     const uniqueTags = [...new Set(currentTags)]
-    const filters = {
-      q: '{{ filters.query }}',
-      user: '{{ filters.user }}',
+    const search = {
+      q: '{{ search.q }}',
+      user: '{{ search.user }}',
+      shared: '{{ search.shared }}',
+      unread: '{{ search.unread }}',
     }
     const apiClient = new linkding.ApiClient('{% url 'bookmarks:api-root' %}')
-    const wrapper = document.getElementById('search-input-wrap')
-    const newWrapper = document.createElement('div')
+    const input = document.querySelector('#search input[name="q"]')
+    const wrapper = document.createElement('div')
     new linkding.SearchAutoComplete({
-      target: newWrapper,
+      target: wrapper,
       props: {
         name: 'q',
         placeholder: 'Search for words or #tags',
-        value: '{{ filters.query }}',
+        value: input.value,
         tags: uniqueTags,
         mode: '{{ mode }}',
+        linkTarget: '{{ request.user_profile.bookmark_link_target }}',
         apiClient,
-        filters,
+        search,
       }
     })
-    wrapper.parentElement.replaceChild(newWrapper, wrapper)
+    input.replaceWith(wrapper.firstElementChild);
   });
 </script>

bookmarks/templates/bookmarks/shared.html

@@ -4,20 +4,22 @@
 {% load bookmarks %}
 
 {% block content %}
-  <div class="bookmarks-page columns"
+  <div class="bookmarks-page grid columns-md-1"
        ld-bookmark-page
        bookmarks-url="{% url 'bookmarks:partials.bookmark_list.shared' %}"
        tags-url="{% url 'bookmarks:partials.tag_cloud.shared' %}">
 
     {# Bookmark list #}
-    <section class="content-area column col-8 col-md-12">
+    <section class="content-area col-2">
       <div class="content-area-header">
         <h2>Shared bookmarks</h2>
-        <div class="spacer"></div>
-        {% bookmark_search bookmark_list.filters tag_cloud.tags mode='shared' %}
+        <div class="header-controls">
+          {% bookmark_search bookmark_list.search tag_cloud.tags mode='shared' %}
+          <button ld-modal modal-content=".tag-cloud" class="btn ml-2 show-md">Tags</button>
+        </div>
       </div>
 
-      <form class="bookmark-actions" action="{% url 'bookmarks:action' %}?return_url={{ bookmark_list.return_url }}"
+      <form class="bookmark-actions" action="{{ bookmark_list.action_url|safe }}"
             method="post">
         {% csrf_token %}
 
@@ -28,12 +30,12 @@
     </section>
 
     {# Filters #}
-    <section class="content-area column col-4 hide-md">
+    <section class="content-area col-1 hide-md">
       <div class="content-area-header">
         <h2>User</h2>
       </div>
       <div>
-        {% user_select filters users %}
+        {% user_select bookmark_list.search users %}
         <br>
       </div>
       <div class="content-area-header">
@@ -44,6 +46,4 @@
       </div>
     </section>
   </div>
-
-  <script src="{% static "bundle.js" %}?v={{ app_version }}"></script>
 {% endblock %}

bookmarks/templates/bookmarks/user_select.html

@@ -1,19 +1,12 @@
+{% load widget_tweaks %}
+
 <form id="user-select" action="" method="get">
-  {% if filters.query %}
-    <input type="hidden" name="q" value="{{ filters.query }}">
-  {% endif %}
+  {% for hidden_field in form.hidden_fields %}
+    {{ hidden_field }}
+  {% endfor %}
   <div class="form-group">
     <div class="d-flex">
-      <select name="user" class="form-select">
-        <option value="">Everyone</option>
-        {% for user in users %}
-          <option value="{{ user.username }}"
-                  {% if user.username == filters.user %}selected{% endif %}
-                  data-is-user-option>
-            {{ user.username }}
-          </option>
-        {% endfor %}
-      </select>
+      {{ form.user|add_class:"form-select" }}
       <noscript>
         <button type="submit" class="btn btn-link ml-2">Apply</button>
       </noscript>

bookmarks/templates/django_registration/registration_complete.html

@@ -4,13 +4,5 @@
 {% block title %}Registration complete{% endblock %}
 
 {% block content %}
-
-    <div class="auth-page">
-        <div class="columns">
-            <section class="content-area column col-12">
   <p>Registration complete. You can now use the application.</p>
-            </section>
-        </div>
-    </div>
-
 {% endblock %}

bookmarks/templates/django_registration/registration_form.html

@@ -4,41 +4,35 @@
 {% block title %}Registration{% endblock %}
 
 {% block content %}
-
-    <div class="auth-page">
-        <div class="columns">
-            <section class="content-area column col-5 col-md-12">
+  <section class="content-area mx-auto width-50 width-md-100">
     <div class="content-area-header">
       <h2>Register</h2>
     </div>
-                <form method="post" action="{% url 'django_registration_register' %}">
+    <form method="post" action="{% url 'django_registration_register' %}" novalidate>
       {% csrf_token %}
       <div class="form-group  {% if form.errors.username %}has-error{% endif %}">
         <label class="form-label" for="{{ form.username.id_for_label }}">Username</label>
-                        {{ form.username|add_class:'form-input' }}
+        {{ form.username|add_class:'form-input'|attr:"placeholder: " }}
         <div class="form-input-hint">{{ form.errors.username }}</div>
       </div>
       <div class="form-group {% if form.errors.email %}has-error{% endif %}">
         <label class="form-label" for="{{ form.email.id_for_label }}">Email</label>
-                        {{ form.email|add_class:'form-input' }}
+        {{ form.email|add_class:'form-input'|attr:"placeholder: " }}
         <div class="form-input-hint">{{ form.errors.email }}</div>
       </div>
       <div class="form-group {% if form.errors.password1 %}has-error{% endif %}">
         <label class="form-label" for="{{ form.password1.id_for_label }}">Password</label>
-                        {{ form.password1|add_class:'form-input' }}
+        {{ form.password1|add_class:'form-input'|attr:"placeholder: " }}
         <div class="form-input-hint">{{ form.errors.password1 }}</div>
       </div>
       <div class="form-group {% if form.errors.password2 %}has-error{% endif %}">
         <label class="form-label" for="{{ form.password2.id_for_label }}">Confirm Password</label>
-                        {{ form.password2|add_class:'form-input' }}
+        {{ form.password2|add_class:'form-input'|attr:"placeholder: " }}
         <div class="form-input-hint">{{ form.errors.password2 }}</div>
       </div>
       <br/>
-                    <input type="submit" value="Register" class="btn btn-primary col-md-12">
+      <input type="submit" value="Register" class="btn btn-primary btn-wide">
       <input type="hidden" name="next" value="{{ next }}">
     </form>
   </section>
-        </div>
-    </div>
-
 {% endblock %}

bookmarks/templates/registration/login.html

@@ -4,10 +4,7 @@
 {% block title %}Login{% endblock %}
 
 {% block content %}
-
-    <div class="auth-page">
-        <div class="columns">
-            <section class="content-area column col-5 col-md-12">
+  <section class="content-area mx-auto width-50 width-md-100">
     <div class="content-area-header">
       <h2>Login</h2>
     </div>
@@ -28,22 +25,14 @@
       </div>
 
       <br/>
-                    <div class="columns">
-                        <div class="column col-3">
-                            <input type="submit" value="Login" class="btn btn-primary">
+      <div class="d-flex justify-between">
+        <input type="submit" value="Login" class="btn btn-primary btn-wide">
         <input type="hidden" name="next" value="{{ next }}">
-                        </div>
         {% if allow_registration %}
-                        <div class="column col-auto col-ml-auto">
           <a href="{% url 'django_registration_register' %}" class="btn btn-link">Register</a>
-                        </div>
         {% endif %}
       </div>
 
     </form>
   </section>
-        </div>
-    </div>
-
-
 {% endblock %}