+
Paperless-ngx is running! 🎉
You're ready to start uploading documents! Explore the various features of this web app on your own, or start a quick tour using the button below.
More detail on how to use and configure Paperless-ngx is always available in the documentation.
diff --git a/src-ui/src/app/data/paperless-uisettings.ts b/src-ui/src/app/data/paperless-uisettings.ts
index 2f1e9e230..a8ef0f87f 100644
--- a/src-ui/src/app/data/paperless-uisettings.ts
+++ b/src-ui/src/app/data/paperless-uisettings.ts
@@ -43,6 +43,8 @@ export const SETTINGS_KEYS = {
'general-settings:saved-views:warn-on-unsaved-change',
DASHBOARD_VIEWS_SORT_ORDER:
'general-settings:saved-views:dashboard-views-sort-order',
+ SIDEBAR_VIEWS_SORT_ORDER:
+ 'general-settings:saved-views:sidebar-views-sort-order',
TOUR_COMPLETE: 'general-settings:tour-complete',
DEFAULT_PERMS_OWNER: 'general-settings:permissions:default-owner',
DEFAULT_PERMS_VIEW_USERS: 'general-settings:permissions:default-view-users',
@@ -187,4 +189,9 @@ export const SETTINGS: PaperlessUiSetting[] = [
type: 'array',
default: [],
},
+ {
+ key: SETTINGS_KEYS.SIDEBAR_VIEWS_SORT_ORDER,
+ type: 'array',
+ default: [],
+ },
]
diff --git a/src-ui/src/app/services/rest/saved-view.service.spec.ts b/src-ui/src/app/services/rest/saved-view.service.spec.ts
index 1e0c761aa..ffd2099ba 100644
--- a/src-ui/src/app/services/rest/saved-view.service.spec.ts
+++ b/src-ui/src/app/services/rest/saved-view.service.spec.ts
@@ -4,6 +4,8 @@ import { TestBed } from '@angular/core/testing'
import { environment } from 'src/environments/environment'
import { commonAbstractPaperlessServiceTests } from './abstract-paperless-service.spec'
import { SavedViewService } from './saved-view.service'
+import { SettingsService } from '../settings.service'
+import { SETTINGS_KEYS } from 'src/app/data/paperless-uisettings'
let httpTestingController: HttpTestingController
let service: SavedViewService
@@ -22,8 +24,8 @@ const saved_views = [
{
name: 'Saved View 2',
id: 2,
- show_on_dashboard: false,
- show_in_sidebar: false,
+ show_on_dashboard: true,
+ show_in_sidebar: true,
sort_field: 'name',
sort_reverse: true,
filter_rules: [],
@@ -32,6 +34,15 @@ const saved_views = [
name: 'Saved View 3',
id: 3,
show_on_dashboard: true,
+ show_in_sidebar: true,
+ sort_field: 'name',
+ sort_reverse: true,
+ filter_rules: [],
+ },
+ {
+ name: 'Saved View 4',
+ id: 4,
+ show_on_dashboard: false,
show_in_sidebar: false,
sort_field: 'name',
sort_reverse: true,
@@ -43,6 +54,8 @@ const saved_views = [
commonAbstractPaperlessServiceTests(endpoint, SavedViewService)
describe(`Additional service tests for SavedViewService`, () => {
+ let settingsService
+
it('should retrieve saved views and sort them', () => {
service.initialize()
const req = httpTestingController.expectOne(
@@ -51,9 +64,9 @@ describe(`Additional service tests for SavedViewService`, () => {
req.flush({
results: saved_views,
})
- expect(service.allViews).toHaveLength(3)
- expect(service.dashboardViews).toHaveLength(2)
- expect(service.sidebarViews).toHaveLength(1)
+ expect(service.allViews).toHaveLength(4)
+ expect(service.dashboardViews).toHaveLength(3)
+ expect(service.sidebarViews).toHaveLength(3)
})
it('should support patchMany', () => {
@@ -67,11 +80,36 @@ describe(`Additional service tests for SavedViewService`, () => {
})
})
+ it('should sort dashboard views', () => {
+ service['savedViews'] = saved_views
+ jest.spyOn(settingsService, 'get').mockImplementation((key) => {
+ if (key === SETTINGS_KEYS.DASHBOARD_VIEWS_SORT_ORDER) return [3, 1, 2]
+ })
+ expect(service.dashboardViews).toEqual([
+ saved_views[2],
+ saved_views[0],
+ saved_views[1],
+ ])
+ })
+
+ it('should sort sidebar views', () => {
+ service['savedViews'] = saved_views
+ jest.spyOn(settingsService, 'get').mockImplementation((key) => {
+ if (key === SETTINGS_KEYS.SIDEBAR_VIEWS_SORT_ORDER) return [3, 1, 2]
+ })
+ expect(service.sidebarViews).toEqual([
+ saved_views[2],
+ saved_views[0],
+ saved_views[1],
+ ])
+ })
+
beforeEach(() => {
// Dont need to setup again
httpTestingController = TestBed.inject(HttpTestingController)
service = TestBed.inject(SavedViewService)
+ settingsService = TestBed.inject(SettingsService)
})
afterEach(() => {
diff --git a/src-ui/src/app/services/rest/saved-view.service.ts b/src-ui/src/app/services/rest/saved-view.service.ts
index 307eaae10..bd0d9fb52 100644
--- a/src-ui/src/app/services/rest/saved-view.service.ts
+++ b/src-ui/src/app/services/rest/saved-view.service.ts
@@ -5,6 +5,8 @@ import { tap } from 'rxjs/operators'
import { PaperlessSavedView } from 'src/app/data/paperless-saved-view'
import { PermissionsService } from '../permissions.service'
import { AbstractPaperlessService } from './abstract-paperless-service'
+import { SettingsService } from '../settings.service'
+import { SETTINGS_KEYS } from 'src/app/data/paperless-uisettings'
@Injectable({
providedIn: 'root',
@@ -12,7 +14,11 @@ import { AbstractPaperlessService } from './abstract-paperless-service'
export class SavedViewService extends AbstractPaperlessService {
loading: boolean
- constructor(http: HttpClient, permissionService: PermissionsService) {
+ constructor(
+ http: HttpClient,
+ permissionService: PermissionsService,
+ private settingsService: SettingsService
+ ) {
super(http, 'saved_views')
}
@@ -25,6 +31,7 @@ export class SavedViewService extends AbstractPaperlessService {
this.savedViews = r.results
this.loading = false
+ this.settingsService.dashboardIsEmpty = this.dashboardViews.length === 0
})
}
@@ -34,12 +41,34 @@ export class SavedViewService extends AbstractPaperlessService v.show_in_sidebar)
+ get sidebarViews(): PaperlessSavedView[] {
+ const sidebarViews = this.savedViews.filter((v) => v.show_in_sidebar)
+
+ const sorted: number[] = this.settingsService.get(
+ SETTINGS_KEYS.SIDEBAR_VIEWS_SORT_ORDER
+ )
+
+ return sorted?.length > 0
+ ? sorted
+ .map((id) => sidebarViews.find((v) => v.id === id))
+ .concat(sidebarViews.filter((v) => !sorted.includes(v.id)))
+ .filter((v) => v)
+ : [...sidebarViews]
}
- get dashboardViews() {
- return this.savedViews.filter((v) => v.show_on_dashboard)
+ get dashboardViews(): PaperlessSavedView[] {
+ const dashboardViews = this.savedViews.filter((v) => v.show_on_dashboard)
+
+ const sorted: number[] = this.settingsService.get(
+ SETTINGS_KEYS.DASHBOARD_VIEWS_SORT_ORDER
+ )
+
+ return sorted?.length > 0
+ ? sorted
+ .map((id) => dashboardViews.find((v) => v.id === id))
+ .concat(dashboardViews.filter((v) => !sorted.includes(v.id)))
+ .filter((v) => v)
+ : [...dashboardViews]
}
create(o: PaperlessSavedView) {
diff --git a/src-ui/src/app/services/settings.service.spec.ts b/src-ui/src/app/services/settings.service.spec.ts
index e7d13dffc..d0814bad9 100644
--- a/src-ui/src/app/services/settings.service.spec.ts
+++ b/src-ui/src/app/services/settings.service.spec.ts
@@ -292,6 +292,14 @@ describe('SettingsService', () => {
SETTINGS_KEYS.DASHBOARD_VIEWS_SORT_ORDER,
[1, 4]
)
+ settingsService.updateSidebarViewsSort([
+ { id: 1 } as PaperlessSavedView,
+ { id: 4 } as PaperlessSavedView,
+ ])
+ expect(setSpy).toHaveBeenCalledWith(
+ SETTINGS_KEYS.SIDEBAR_VIEWS_SORT_ORDER,
+ [1, 4]
+ )
httpTestingController
.expectOne(`${environment.apiBaseUrl}ui_settings/`)
.flush(ui_settings)
diff --git a/src-ui/src/app/services/settings.service.ts b/src-ui/src/app/services/settings.service.ts
index 610913549..e60304a0c 100644
--- a/src-ui/src/app/services/settings.service.ts
+++ b/src-ui/src/app/services/settings.service.ts
@@ -24,7 +24,6 @@ import {
} from '../data/paperless-uisettings'
import { PaperlessUser } from '../data/paperless-user'
import { PermissionsService } from './permissions.service'
-import { SavedViewService } from './rest/saved-view.service'
import { ToastService } from './toast.service'
import { PaperlessSavedView } from '../data/paperless-saved-view'
@@ -55,8 +54,11 @@ export class SettingsService {
return this._renderer
}
+ public dashboardIsEmpty: boolean = false
+
public globalDropzoneEnabled: boolean = true
public globalDropzoneActive: boolean = false
+ public organizingSidebarSavedViews: boolean = false
constructor(
rendererFactory: RendererFactory2,
@@ -66,7 +68,6 @@ export class SettingsService {
@Inject(LOCALE_ID) private localeId: string,
protected http: HttpClient,
private toastService: ToastService,
- private savedViewService: SavedViewService,
private permissionsService: PermissionsService
) {
this._renderer = rendererFactory.createRenderer(null, null)
@@ -515,11 +516,7 @@ export class SettingsService {
}
offerTour(): boolean {
- return (
- !this.savedViewService.loading &&
- this.savedViewService.dashboardViews.length == 0 &&
- !this.get(SETTINGS_KEYS.TOUR_COMPLETE)
- )
+ return this.dashboardIsEmpty && !this.get(SETTINGS_KEYS.TOUR_COMPLETE)
}
completeTour() {
@@ -544,4 +541,11 @@ export class SettingsService {
])
return this.storeSettings()
}
+
+ updateSidebarViewsSort(sidebarViews: PaperlessSavedView[]): Observable {
+ this.set(SETTINGS_KEYS.SIDEBAR_VIEWS_SORT_ORDER, [
+ ...new Set(sidebarViews.map((v) => v.id)),
+ ])
+ return this.storeSettings()
+ }
}
diff --git a/src-ui/src/styles.scss b/src-ui/src/styles.scss
index 1bb96a6f6..244fba8bb 100644
--- a/src-ui/src/styles.scss
+++ b/src-ui/src/styles.scss
@@ -642,3 +642,17 @@ code {
.me-1px {
margin-right: 1px !important;
}
+
+.cdk-drag-placeholder {
+ opacity: .5;
+}
+
+/* Animate items as they're being sorted. */
+.cdk-drop-list-dragging .cdk-drag {
+ transition: transform 250ms cubic-bezier(0, 0, 0.2, 1);
+}
+
+/* Animate an item that has been dropped. */
+.cdk-drag-animating {
+ transition: transform 300ms cubic-bezier(0, 0, 0.2, 1);
+}
diff --git a/src-ui/src/theme.scss b/src-ui/src/theme.scss
index f415ed537..095b83d20 100644
--- a/src-ui/src/theme.scss
+++ b/src-ui/src/theme.scss
@@ -226,7 +226,7 @@ $form-check-radio-checked-bg-image-dark: url("data:image/svg+xml,