wip ref(core): move group collapsed status into profileSettingsTab

This commit is contained in:
Clem 2023-08-04 14:16:00 +02:00
parent 1c06a510bd
commit 44c449bd4c
3 changed files with 34 additions and 21 deletions

View file

@ -37,7 +37,6 @@ export interface ProfileGroup {
profiles: PartialProfile<Profile>[]
defaults: any
editable: boolean
collapsed: boolean
}
export type PartialProfileGroup<T extends ProfileGroup> = Omit<Omit<{

View file

@ -398,11 +398,9 @@ export class ProfilesService {
profiles = await this.getProfiles(includeNonUserGroup, true)
}
const profileGroupCollapsed = JSON.parse(window.localStorage.profileGroupCollapsed ?? '{}')
let groups: PartialProfileGroup<ProfileGroup>[] = deepClone(this.config.store.groups ?? [])
groups = groups.map(x => {
x.editable = true
x.collapsed = profileGroupCollapsed[x.id] ?? false
if (includeProfiles) {
x.profiles = profiles.filter(p => p.group === x.id)
@ -418,14 +416,12 @@ export class ProfilesService {
name: this.translate.instant('Built-in'),
editable: false,
}
builtIn.collapsed = profileGroupCollapsed[builtIn.id] ?? false
const ungrouped: PartialProfileGroup<ProfileGroup> = {
id: 'ungrouped',
name: this.translate.instant('Ungrouped'),
editable: false,
}
ungrouped.collapsed = profileGroupCollapsed[ungrouped.id] ?? false
if (includeProfiles) {
builtIn.profiles = profiles.filter(p => p.isBuiltin)
@ -470,7 +466,6 @@ export class ProfilesService {
async writeProfileGroup (group: PartialProfileGroup<ProfileGroup>, saveConfig = true): Promise<void> {
delete group.profiles
delete group.editable
delete group.collapsed
const cGroup = this.config.store.groups.find(g => g.id === group.id)
if (cGroup) {
@ -508,13 +503,4 @@ export class ProfilesService {
return this.config.store.groups.find(g => g.id === groupId)?.name ?? ''
}
/**
* Save ProfileGroup collapse state in localStorage
*/
saveProfileGroupCollapse (group: PartialProfileGroup<ProfileGroup>): void {
const profileGroupCollapsed = JSON.parse(window.localStorage.profileGroupCollapsed ?? '{}')
profileGroupCollapsed[group.id] = group.collapsed
window.localStorage.profileGroupCollapsed = JSON.stringify(profileGroupCollapsed)
}
}

View file

@ -8,6 +8,10 @@ import { EditProfileModalComponent } from './editProfileModal.component'
_('Filter')
_('Ungrouped')
interface CollapsableProfileGroup extends ProfileGroup {
collapsed: boolean
}
/** @hidden */
@Component({
templateUrl: './profilesSettingsTab.component.pug',
@ -16,7 +20,7 @@ _('Ungrouped')
export class ProfilesSettingsTabComponent extends BaseComponent {
builtinProfiles: PartialProfile<Profile>[] = []
templateProfiles: PartialProfile<Profile>[] = []
profileGroups: PartialProfileGroup<ProfileGroup>[]
profileGroups: PartialProfileGroup<CollapsableProfileGroup>[]
filter = ''
Platform = Platform
@ -137,21 +141,22 @@ export class ProfilesSettingsTabComponent extends BaseComponent {
}
async refresh (): Promise<void> {
const profileGroupCollapsed = JSON.parse(window.localStorage.profileGroupCollapsed ?? '{}')
const groups = await this.profilesService.getProfileGroups(true, true)
groups.sort((a, b) => a.name.localeCompare(b.name))
groups.sort((a, b) => (a.id === 'built-in' ? 1 : 0) - (b.id === 'built-in' ? 1 : 0))
groups.sort((a, b) => (a.id === 'ungrouped' ? 0 : 1) - (b.id === 'ungrouped' ? 0 : 1))
this.profileGroups = groups
this.profileGroups = groups.map(g => ProfilesSettingsTabComponent.intoPartialCollapsableProfileGroup(g, profileGroupCollapsed[g.id] ?? false))
}
async editGroup (group: PartialProfileGroup<ProfileGroup>): Promise<void> {
async editGroup (group: PartialProfileGroup<CollapsableProfileGroup>): Promise<void> {
const modal = this.ngbModal.open(PromptModalComponent)
modal.componentInstance.prompt = this.translate.instant('New name')
modal.componentInstance.value = group.name
const result = await modal.result
if (result) {
group.name = result.value
await this.profilesService.writeProfileGroup(group)
await this.profilesService.writeProfileGroup(ProfilesSettingsTabComponent.collapsableIntoPartialProfileGroup(group))
}
}
@ -217,9 +222,9 @@ export class ProfilesSettingsTabComponent extends BaseComponent {
}[this.profilesService.providerForProfile(profile)?.id ?? ''] ?? 'warning'
}
toggleGroupCollapse (group: PartialProfileGroup<ProfileGroup>): void {
toggleGroupCollapse (group: PartialProfileGroup<CollapsableProfileGroup>): void {
group.collapsed = !group.collapsed
this.profilesService.saveProfileGroupCollapse(group)
this.saveProfileGroupCollapse(group)
}
async editDefaults (provider: ProfileProvider<Profile>): Promise<void> {
@ -261,4 +266,27 @@ export class ProfilesSettingsTabComponent extends BaseComponent {
getQuickConnectProviders (): ProfileProvider<Profile>[] {
return this.profileProviders.filter(x => x.supportsQuickConnect)
}
/**
* Save ProfileGroup collapse state in localStorage
*/
private saveProfileGroupCollapse (group: PartialProfileGroup<CollapsableProfileGroup>): void {
const profileGroupCollapsed = JSON.parse(window.localStorage.profileGroupCollapsed ?? '{}')
profileGroupCollapsed[group.id] = group.collapsed
window.localStorage.profileGroupCollapsed = JSON.stringify(profileGroupCollapsed)
}
private static collapsableIntoPartialProfileGroup (group: PartialProfileGroup<CollapsableProfileGroup>): PartialProfileGroup<ProfileGroup> {
const g: any = { ...group }
delete g.collapsed
return g
}
private static intoPartialCollapsableProfileGroup (group: PartialProfileGroup<ProfileGroup>, collapsed: boolean): PartialProfileGroup<CollapsableProfileGroup> {
const collapsableGroup = {
...group,
collapsed,
}
return collapsableGroup
}
}