From 21e493d4d8acb7a650eff3a30cd7e086b3cb8a28 Mon Sep 17 00:00:00 2001 From: Chocobozzz Date: Wed, 10 Feb 2021 09:05:29 +0100 Subject: Add ability to set a custom quota --- .../select/select-channel.component.ts | 25 +++++++++++----------- .../select/select-checkbox.component.ts | 2 +- .../select/select-custom-value.component.html | 6 +++++- .../select/select-custom-value.component.ts | 4 +++- .../select/select-options.component.ts | 9 +------- .../select/select-shared.component.scss | 7 +++++- 6 files changed, 28 insertions(+), 25 deletions(-) (limited to 'client/src/app/shared/shared-forms') diff --git a/client/src/app/shared/shared-forms/select/select-channel.component.ts b/client/src/app/shared/shared-forms/select/select-channel.component.ts index 1d91d59bc..40a7c53bb 100644 --- a/client/src/app/shared/shared-forms/select/select-channel.component.ts +++ b/client/src/app/shared/shared-forms/select/select-channel.component.ts @@ -1,13 +1,7 @@ -import { Component, forwardRef, Input } from '@angular/core' +import { Component, forwardRef, Input, OnChanges } from '@angular/core' import { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms' import { VideoChannel } from '@app/shared/shared-main' - -export type SelectChannelItem = { - id: number - label: string - support: string - avatarPath?: string -} +import { SelectChannelItem } from '../../../../types/select-options-item.model' @Component({ selector: 'my-select-channel', @@ -21,9 +15,10 @@ export type SelectChannelItem = { } ] }) -export class SelectChannelComponent implements ControlValueAccessor { +export class SelectChannelComponent implements ControlValueAccessor, OnChanges { @Input() items: SelectChannelItem[] = [] + channels: SelectChannelItem[] = [] selectedId: number // ng-select options @@ -32,10 +27,14 @@ export class SelectChannelComponent implements ControlValueAccessor { clearable = false searchable = false - get channels () { - return this.items.map(c => Object.assign(c, { - avatarPath: c.avatarPath ? c.avatarPath : VideoChannel.GET_DEFAULT_AVATAR_URL() - })) + ngOnChanges () { + this.channels = this.items.map(c => { + const avatarPath = c.avatarPath + ? c.avatarPath + : VideoChannel.GET_DEFAULT_AVATAR_URL() + + return Object.assign({}, c, { avatarPath }) + }) } propagateChange = (_: any) => { /* empty */ } diff --git a/client/src/app/shared/shared-forms/select/select-checkbox.component.ts b/client/src/app/shared/shared-forms/select/select-checkbox.component.ts index eb0c49034..c2523f15c 100644 --- a/client/src/app/shared/shared-forms/select/select-checkbox.component.ts +++ b/client/src/app/shared/shared-forms/select/select-checkbox.component.ts @@ -1,6 +1,6 @@ import { Component, forwardRef, Input, OnInit } from '@angular/core' import { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms' -import { SelectOptionsItem } from './select-options.component' +import { SelectOptionsItem } from '../../../../types/select-options-item.model' export type ItemSelectCheckboxValue = { id?: string | number, group?: string } | string diff --git a/client/src/app/shared/shared-forms/select/select-custom-value.component.html b/client/src/app/shared/shared-forms/select/select-custom-value.component.html index 5fdf432ff..9dc8c2ec2 100644 --- a/client/src/app/shared/shared-forms/select/select-custom-value.component.html +++ b/client/src/app/shared/shared-forms/select/select-custom-value.component.html @@ -10,5 +10,9 @@ (ngModelChange)="onModelChange()" > - + + + + {{ inputSuffix }} + diff --git a/client/src/app/shared/shared-forms/select/select-custom-value.component.ts b/client/src/app/shared/shared-forms/select/select-custom-value.component.ts index a8e5ad0d3..bc6b863c7 100644 --- a/client/src/app/shared/shared-forms/select/select-custom-value.component.ts +++ b/client/src/app/shared/shared-forms/select/select-custom-value.component.ts @@ -1,6 +1,6 @@ import { Component, forwardRef, Input, OnChanges } from '@angular/core' import { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms' -import { SelectOptionsItem } from './select-options.component' +import { SelectOptionsItem } from '../../../../types/select-options-item.model' @Component({ selector: 'my-select-custom-value', @@ -20,6 +20,8 @@ export class SelectCustomValueComponent implements ControlValueAccessor, OnChang @Input() searchable = false @Input() groupBy: string @Input() labelForId: string + @Input() inputSuffix: string + @Input() inputType = 'text' customValue: number | string = '' selectedId: number | string diff --git a/client/src/app/shared/shared-forms/select/select-options.component.ts b/client/src/app/shared/shared-forms/select/select-options.component.ts index 51a3f515d..2890670e5 100644 --- a/client/src/app/shared/shared-forms/select/select-options.component.ts +++ b/client/src/app/shared/shared-forms/select/select-options.component.ts @@ -1,13 +1,6 @@ import { Component, forwardRef, Input } from '@angular/core' import { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms' - -export type SelectOptionsItem = { - id: string | number - label: string - description?: string - group?: string - groupLabel?: string -} +import { SelectOptionsItem } from '../../../../types/select-options-item.model' @Component({ selector: 'my-select-options', diff --git a/client/src/app/shared/shared-forms/select/select-shared.component.scss b/client/src/app/shared/shared-forms/select/select-shared.component.scss index 1a4192b55..80196b8df 100644 --- a/client/src/app/shared/shared-forms/select/select-shared.component.scss +++ b/client/src/app/shared/shared-forms/select/select-shared.component.scss @@ -33,15 +33,20 @@ ng-select ::ng-deep { .root { display:flex; + align-items: center; > my-select-options { flex-grow: 1; } } -input[type=text] { +my-select-options + input { margin-left: 5px; @include peertube-input-text($form-base-input-width); display: block; } + +.input-suffix { + margin-left: 5px; +} -- cgit v1.2.3