mirror of https://github.com/immich-app/immich.git
feat(server,web): migrate oauth settings from env to system config (#1061)
parent
cefdd86b7f
commit
5e680551b9
@ -0,0 +1,143 @@
|
||||
//
|
||||
// AUTO-GENERATED FILE, DO NOT MODIFY!
|
||||
//
|
||||
// @dart=2.12
|
||||
|
||||
// ignore_for_file: unused_element, unused_import
|
||||
// ignore_for_file: always_put_required_named_parameters_first
|
||||
// ignore_for_file: constant_identifier_names
|
||||
// ignore_for_file: lines_longer_than_80_chars
|
||||
|
||||
part of openapi.api;
|
||||
|
||||
class SystemConfigFFmpegDto {
|
||||
/// Returns a new [SystemConfigFFmpegDto] instance.
|
||||
SystemConfigFFmpegDto({
|
||||
required this.crf,
|
||||
required this.preset,
|
||||
required this.targetVideoCodec,
|
||||
required this.targetAudioCodec,
|
||||
required this.targetScaling,
|
||||
});
|
||||
|
||||
String crf;
|
||||
|
||||
String preset;
|
||||
|
||||
String targetVideoCodec;
|
||||
|
||||
String targetAudioCodec;
|
||||
|
||||
String targetScaling;
|
||||
|
||||
@override
|
||||
bool operator ==(Object other) => identical(this, other) || other is SystemConfigFFmpegDto &&
|
||||
other.crf == crf &&
|
||||
other.preset == preset &&
|
||||
other.targetVideoCodec == targetVideoCodec &&
|
||||
other.targetAudioCodec == targetAudioCodec &&
|
||||
other.targetScaling == targetScaling;
|
||||
|
||||
@override
|
||||
int get hashCode =>
|
||||
// ignore: unnecessary_parenthesis
|
||||
(crf.hashCode) +
|
||||
(preset.hashCode) +
|
||||
(targetVideoCodec.hashCode) +
|
||||
(targetAudioCodec.hashCode) +
|
||||
(targetScaling.hashCode);
|
||||
|
||||
@override
|
||||
String toString() => 'SystemConfigFFmpegDto[crf=$crf, preset=$preset, targetVideoCodec=$targetVideoCodec, targetAudioCodec=$targetAudioCodec, targetScaling=$targetScaling]';
|
||||
|
||||
Map<String, dynamic> toJson() {
|
||||
final _json = <String, dynamic>{};
|
||||
_json[r'crf'] = crf;
|
||||
_json[r'preset'] = preset;
|
||||
_json[r'targetVideoCodec'] = targetVideoCodec;
|
||||
_json[r'targetAudioCodec'] = targetAudioCodec;
|
||||
_json[r'targetScaling'] = targetScaling;
|
||||
return _json;
|
||||
}
|
||||
|
||||
/// Returns a new [SystemConfigFFmpegDto] instance and imports its values from
|
||||
/// [value] if it's a [Map], null otherwise.
|
||||
// ignore: prefer_constructors_over_static_methods
|
||||
static SystemConfigFFmpegDto? fromJson(dynamic value) {
|
||||
if (value is Map) {
|
||||
final json = value.cast<String, dynamic>();
|
||||
|
||||
// Ensure that the map contains the required keys.
|
||||
// Note 1: the values aren't checked for validity beyond being non-null.
|
||||
// Note 2: this code is stripped in release mode!
|
||||
assert(() {
|
||||
requiredKeys.forEach((key) {
|
||||
assert(json.containsKey(key), 'Required key "SystemConfigFFmpegDto[$key]" is missing from JSON.');
|
||||
assert(json[key] != null, 'Required key "SystemConfigFFmpegDto[$key]" has a null value in JSON.');
|
||||
});
|
||||
return true;
|
||||
}());
|
||||
|
||||
return SystemConfigFFmpegDto(
|
||||
crf: mapValueOfType<String>(json, r'crf')!,
|
||||
preset: mapValueOfType<String>(json, r'preset')!,
|
||||
targetVideoCodec: mapValueOfType<String>(json, r'targetVideoCodec')!,
|
||||
targetAudioCodec: mapValueOfType<String>(json, r'targetAudioCodec')!,
|
||||
targetScaling: mapValueOfType<String>(json, r'targetScaling')!,
|
||||
);
|
||||
}
|
||||
return null;
|
||||
}
|
||||
|
||||
static List<SystemConfigFFmpegDto>? listFromJson(dynamic json, {bool growable = false,}) {
|
||||
final result = <SystemConfigFFmpegDto>[];
|
||||
if (json is List && json.isNotEmpty) {
|
||||
for (final row in json) {
|
||||
final value = SystemConfigFFmpegDto.fromJson(row);
|
||||
if (value != null) {
|
||||
result.add(value);
|
||||
}
|
||||
}
|
||||
}
|
||||
return result.toList(growable: growable);
|
||||
}
|
||||
|
||||
static Map<String, SystemConfigFFmpegDto> mapFromJson(dynamic json) {
|
||||
final map = <String, SystemConfigFFmpegDto>{};
|
||||
if (json is Map && json.isNotEmpty) {
|
||||
json = json.cast<String, dynamic>(); // ignore: parameter_assignments
|
||||
for (final entry in json.entries) {
|
||||
final value = SystemConfigFFmpegDto.fromJson(entry.value);
|
||||
if (value != null) {
|
||||
map[entry.key] = value;
|
||||
}
|
||||
}
|
||||
}
|
||||
return map;
|
||||
}
|
||||
|
||||
// maps a json object with a list of SystemConfigFFmpegDto-objects as value to a dart map
|
||||
static Map<String, List<SystemConfigFFmpegDto>> mapListFromJson(dynamic json, {bool growable = false,}) {
|
||||
final map = <String, List<SystemConfigFFmpegDto>>{};
|
||||
if (json is Map && json.isNotEmpty) {
|
||||
json = json.cast<String, dynamic>(); // ignore: parameter_assignments
|
||||
for (final entry in json.entries) {
|
||||
final value = SystemConfigFFmpegDto.listFromJson(entry.value, growable: growable,);
|
||||
if (value != null) {
|
||||
map[entry.key] = value;
|
||||
}
|
||||
}
|
||||
}
|
||||
return map;
|
||||
}
|
||||
|
||||
/// The list of required keys that must be present in a JSON.
|
||||
static const requiredKeys = <String>{
|
||||
'crf',
|
||||
'preset',
|
||||
'targetVideoCodec',
|
||||
'targetAudioCodec',
|
||||
'targetScaling',
|
||||
};
|
||||
}
|
||||
|
||||
@ -1,94 +0,0 @@
|
||||
//
|
||||
// AUTO-GENERATED FILE, DO NOT MODIFY!
|
||||
//
|
||||
// @dart=2.12
|
||||
|
||||
// ignore_for_file: unused_element, unused_import
|
||||
// ignore_for_file: always_put_required_named_parameters_first
|
||||
// ignore_for_file: constant_identifier_names
|
||||
// ignore_for_file: lines_longer_than_80_chars
|
||||
|
||||
part of openapi.api;
|
||||
|
||||
|
||||
class SystemConfigKey {
|
||||
/// Instantiate a new enum with the provided [value].
|
||||
const SystemConfigKey._(this.value);
|
||||
|
||||
/// The underlying value of this enum member.
|
||||
final String value;
|
||||
|
||||
@override
|
||||
String toString() => value;
|
||||
|
||||
String toJson() => value;
|
||||
|
||||
static const crf = SystemConfigKey._(r'ffmpeg_crf');
|
||||
static const preset = SystemConfigKey._(r'ffmpeg_preset');
|
||||
static const targetVideoCodec = SystemConfigKey._(r'ffmpeg_target_video_codec');
|
||||
static const targetAudioCodec = SystemConfigKey._(r'ffmpeg_target_audio_codec');
|
||||
static const targetScaling = SystemConfigKey._(r'ffmpeg_target_scaling');
|
||||
|
||||
/// List of all possible values in this [enum][SystemConfigKey].
|
||||
static const values = <SystemConfigKey>[
|
||||
crf,
|
||||
preset,
|
||||
targetVideoCodec,
|
||||
targetAudioCodec,
|
||||
targetScaling,
|
||||
];
|
||||
|
||||
static SystemConfigKey? fromJson(dynamic value) => SystemConfigKeyTypeTransformer().decode(value);
|
||||
|
||||
static List<SystemConfigKey>? listFromJson(dynamic json, {bool growable = false,}) {
|
||||
final result = <SystemConfigKey>[];
|
||||
if (json is List && json.isNotEmpty) {
|
||||
for (final row in json) {
|
||||
final value = SystemConfigKey.fromJson(row);
|
||||
if (value != null) {
|
||||
result.add(value);
|
||||
}
|
||||
}
|
||||
}
|
||||
return result.toList(growable: growable);
|
||||
}
|
||||
}
|
||||
|
||||
/// Transformation class that can [encode] an instance of [SystemConfigKey] to String,
|
||||
/// and [decode] dynamic data back to [SystemConfigKey].
|
||||
class SystemConfigKeyTypeTransformer {
|
||||
factory SystemConfigKeyTypeTransformer() => _instance ??= const SystemConfigKeyTypeTransformer._();
|
||||
|
||||
const SystemConfigKeyTypeTransformer._();
|
||||
|
||||
String encode(SystemConfigKey data) => data.value;
|
||||
|
||||
/// Decodes a [dynamic value][data] to a SystemConfigKey.
|
||||
///
|
||||
/// If [allowNull] is true and the [dynamic value][data] cannot be decoded successfully,
|
||||
/// then null is returned. However, if [allowNull] is false and the [dynamic value][data]
|
||||
/// cannot be decoded successfully, then an [UnimplementedError] is thrown.
|
||||
///
|
||||
/// The [allowNull] is very handy when an API changes and a new enum value is added or removed,
|
||||
/// and users are still using an old app with the old code.
|
||||
SystemConfigKey? decode(dynamic data, {bool allowNull = true}) {
|
||||
if (data != null) {
|
||||
switch (data.toString()) {
|
||||
case r'ffmpeg_crf': return SystemConfigKey.crf;
|
||||
case r'ffmpeg_preset': return SystemConfigKey.preset;
|
||||
case r'ffmpeg_target_video_codec': return SystemConfigKey.targetVideoCodec;
|
||||
case r'ffmpeg_target_audio_codec': return SystemConfigKey.targetAudioCodec;
|
||||
case r'ffmpeg_target_scaling': return SystemConfigKey.targetScaling;
|
||||
default:
|
||||
if (!allowNull) {
|
||||
throw ArgumentError('Unknown enum value to decode: $data');
|
||||
}
|
||||
}
|
||||
}
|
||||
return null;
|
||||
}
|
||||
|
||||
/// Singleton [SystemConfigKeyTypeTransformer] instance.
|
||||
static SystemConfigKeyTypeTransformer? _instance;
|
||||
}
|
||||
|
||||
@ -0,0 +1,159 @@
|
||||
//
|
||||
// AUTO-GENERATED FILE, DO NOT MODIFY!
|
||||
//
|
||||
// @dart=2.12
|
||||
|
||||
// ignore_for_file: unused_element, unused_import
|
||||
// ignore_for_file: always_put_required_named_parameters_first
|
||||
// ignore_for_file: constant_identifier_names
|
||||
// ignore_for_file: lines_longer_than_80_chars
|
||||
|
||||
part of openapi.api;
|
||||
|
||||
class SystemConfigOAuthDto {
|
||||
/// Returns a new [SystemConfigOAuthDto] instance.
|
||||
SystemConfigOAuthDto({
|
||||
required this.enabled,
|
||||
required this.issuerUrl,
|
||||
required this.clientId,
|
||||
required this.clientSecret,
|
||||
required this.scope,
|
||||
required this.buttonText,
|
||||
required this.autoRegister,
|
||||
});
|
||||
|
||||
bool enabled;
|
||||
|
||||
String issuerUrl;
|
||||
|
||||
String clientId;
|
||||
|
||||
String clientSecret;
|
||||
|
||||
String scope;
|
||||
|
||||
String buttonText;
|
||||
|
||||
bool autoRegister;
|
||||
|
||||
@override
|
||||
bool operator ==(Object other) => identical(this, other) || other is SystemConfigOAuthDto &&
|
||||
other.enabled == enabled &&
|
||||
other.issuerUrl == issuerUrl &&
|
||||
other.clientId == clientId &&
|
||||
other.clientSecret == clientSecret &&
|
||||
other.scope == scope &&
|
||||
other.buttonText == buttonText &&
|
||||
other.autoRegister == autoRegister;
|
||||
|
||||
@override
|
||||
int get hashCode =>
|
||||
// ignore: unnecessary_parenthesis
|
||||
(enabled.hashCode) +
|
||||
(issuerUrl.hashCode) +
|
||||
(clientId.hashCode) +
|
||||
(clientSecret.hashCode) +
|
||||
(scope.hashCode) +
|
||||
(buttonText.hashCode) +
|
||||
(autoRegister.hashCode);
|
||||
|
||||
@override
|
||||
String toString() => 'SystemConfigOAuthDto[enabled=$enabled, issuerUrl=$issuerUrl, clientId=$clientId, clientSecret=$clientSecret, scope=$scope, buttonText=$buttonText, autoRegister=$autoRegister]';
|
||||
|
||||
Map<String, dynamic> toJson() {
|
||||
final _json = <String, dynamic>{};
|
||||
_json[r'enabled'] = enabled;
|
||||
_json[r'issuerUrl'] = issuerUrl;
|
||||
_json[r'clientId'] = clientId;
|
||||
_json[r'clientSecret'] = clientSecret;
|
||||
_json[r'scope'] = scope;
|
||||
_json[r'buttonText'] = buttonText;
|
||||
_json[r'autoRegister'] = autoRegister;
|
||||
return _json;
|
||||
}
|
||||
|
||||
/// Returns a new [SystemConfigOAuthDto] instance and imports its values from
|
||||
/// [value] if it's a [Map], null otherwise.
|
||||
// ignore: prefer_constructors_over_static_methods
|
||||
static SystemConfigOAuthDto? fromJson(dynamic value) {
|
||||
if (value is Map) {
|
||||
final json = value.cast<String, dynamic>();
|
||||
|
||||
// Ensure that the map contains the required keys.
|
||||
// Note 1: the values aren't checked for validity beyond being non-null.
|
||||
// Note 2: this code is stripped in release mode!
|
||||
assert(() {
|
||||
requiredKeys.forEach((key) {
|
||||
assert(json.containsKey(key), 'Required key "SystemConfigOAuthDto[$key]" is missing from JSON.');
|
||||
assert(json[key] != null, 'Required key "SystemConfigOAuthDto[$key]" has a null value in JSON.');
|
||||
});
|
||||
return true;
|
||||
}());
|
||||
|
||||
return SystemConfigOAuthDto(
|
||||
enabled: mapValueOfType<bool>(json, r'enabled')!,
|
||||
issuerUrl: mapValueOfType<String>(json, r'issuerUrl')!,
|
||||
clientId: mapValueOfType<String>(json, r'clientId')!,
|
||||
clientSecret: mapValueOfType<String>(json, r'clientSecret')!,
|
||||
scope: mapValueOfType<String>(json, r'scope')!,
|
||||
buttonText: mapValueOfType<String>(json, r'buttonText')!,
|
||||
autoRegister: mapValueOfType<bool>(json, r'autoRegister')!,
|
||||
);
|
||||
}
|
||||
return null;
|
||||
}
|
||||
|
||||
static List<SystemConfigOAuthDto>? listFromJson(dynamic json, {bool growable = false,}) {
|
||||
final result = <SystemConfigOAuthDto>[];
|
||||
if (json is List && json.isNotEmpty) {
|
||||
for (final row in json) {
|
||||
final value = SystemConfigOAuthDto.fromJson(row);
|
||||
if (value != null) {
|
||||
result.add(value);
|
||||
}
|
||||
}
|
||||
}
|
||||
return result.toList(growable: growable);
|
||||
}
|
||||
|
||||
static Map<String, SystemConfigOAuthDto> mapFromJson(dynamic json) {
|
||||
final map = <String, SystemConfigOAuthDto>{};
|
||||
if (json is Map && json.isNotEmpty) {
|
||||
json = json.cast<String, dynamic>(); // ignore: parameter_assignments
|
||||
for (final entry in json.entries) {
|
||||
final value = SystemConfigOAuthDto.fromJson(entry.value);
|
||||
if (value != null) {
|
||||
map[entry.key] = value;
|
||||
}
|
||||
}
|
||||
}
|
||||
return map;
|
||||
}
|
||||
|
||||
// maps a json object with a list of SystemConfigOAuthDto-objects as value to a dart map
|
||||
static Map<String, List<SystemConfigOAuthDto>> mapListFromJson(dynamic json, {bool growable = false,}) {
|
||||
final map = <String, List<SystemConfigOAuthDto>>{};
|
||||
if (json is Map && json.isNotEmpty) {
|
||||
json = json.cast<String, dynamic>(); // ignore: parameter_assignments
|
||||
for (final entry in json.entries) {
|
||||
final value = SystemConfigOAuthDto.listFromJson(entry.value, growable: growable,);
|
||||
if (value != null) {
|
||||
map[entry.key] = value;
|
||||
}
|
||||
}
|
||||
}
|
||||
return map;
|
||||
}
|
||||
|
||||
/// The list of required keys that must be present in a JSON.
|
||||
static const requiredKeys = <String>{
|
||||
'enabled',
|
||||
'issuerUrl',
|
||||
'clientId',
|
||||
'clientSecret',
|
||||
'scope',
|
||||
'buttonText',
|
||||
'autoRegister',
|
||||
};
|
||||
}
|
||||
|
||||
@ -1,135 +0,0 @@
|
||||
//
|
||||
// AUTO-GENERATED FILE, DO NOT MODIFY!
|
||||
//
|
||||
// @dart=2.12
|
||||
|
||||
// ignore_for_file: unused_element, unused_import
|
||||
// ignore_for_file: always_put_required_named_parameters_first
|
||||
// ignore_for_file: constant_identifier_names
|
||||
// ignore_for_file: lines_longer_than_80_chars
|
||||
|
||||
part of openapi.api;
|
||||
|
||||
class SystemConfigResponseItem {
|
||||
/// Returns a new [SystemConfigResponseItem] instance.
|
||||
SystemConfigResponseItem({
|
||||
required this.name,
|
||||
required this.key,
|
||||
required this.value,
|
||||
required this.defaultValue,
|
||||
});
|
||||
|
||||
String name;
|
||||
|
||||
SystemConfigKey key;
|
||||
|
||||
String value;
|
||||
|
||||
String defaultValue;
|
||||
|
||||
@override
|
||||
bool operator ==(Object other) => identical(this, other) || other is SystemConfigResponseItem &&
|
||||
other.name == name &&
|
||||
other.key == key &&
|
||||
other.value == value &&
|
||||
other.defaultValue == defaultValue;
|
||||
|
||||
@override
|
||||
int get hashCode =>
|
||||
// ignore: unnecessary_parenthesis
|
||||
(name.hashCode) +
|
||||
(key.hashCode) +
|
||||
(value.hashCode) +
|
||||
(defaultValue.hashCode);
|
||||
|
||||
@override
|
||||
String toString() => 'SystemConfigResponseItem[name=$name, key=$key, value=$value, defaultValue=$defaultValue]';
|
||||
|
||||
Map<String, dynamic> toJson() {
|
||||
final _json = <String, dynamic>{};
|
||||
_json[r'name'] = name;
|
||||
_json[r'key'] = key;
|
||||
_json[r'value'] = value;
|
||||
_json[r'defaultValue'] = defaultValue;
|
||||
return _json;
|
||||
}
|
||||
|
||||
/// Returns a new [SystemConfigResponseItem] instance and imports its values from
|
||||
/// [value] if it's a [Map], null otherwise.
|
||||
// ignore: prefer_constructors_over_static_methods
|
||||
static SystemConfigResponseItem? fromJson(dynamic value) {
|
||||
if (value is Map) {
|
||||
final json = value.cast<String, dynamic>();
|
||||
|
||||
// Ensure that the map contains the required keys.
|
||||
// Note 1: the values aren't checked for validity beyond being non-null.
|
||||
// Note 2: this code is stripped in release mode!
|
||||
assert(() {
|
||||
requiredKeys.forEach((key) {
|
||||
assert(json.containsKey(key), 'Required key "SystemConfigResponseItem[$key]" is missing from JSON.');
|
||||
assert(json[key] != null, 'Required key "SystemConfigResponseItem[$key]" has a null value in JSON.');
|
||||
});
|
||||
return true;
|
||||
}());
|
||||
|
||||
return SystemConfigResponseItem(
|
||||
name: mapValueOfType<String>(json, r'name')!,
|
||||
key: SystemConfigKey.fromJson(json[r'key'])!,
|
||||
value: mapValueOfType<String>(json, r'value')!,
|
||||
defaultValue: mapValueOfType<String>(json, r'defaultValue')!,
|
||||
);
|
||||
}
|
||||
return null;
|
||||
}
|
||||
|
||||
static List<SystemConfigResponseItem>? listFromJson(dynamic json, {bool growable = false,}) {
|
||||
final result = <SystemConfigResponseItem>[];
|
||||
if (json is List && json.isNotEmpty) {
|
||||
for (final row in json) {
|
||||
final value = SystemConfigResponseItem.fromJson(row);
|
||||
if (value != null) {
|
||||
result.add(value);
|
||||
}
|
||||
}
|
||||
}
|
||||
return result.toList(growable: growable);
|
||||
}
|
||||
|
||||
static Map<String, SystemConfigResponseItem> mapFromJson(dynamic json) {
|
||||
final map = <String, SystemConfigResponseItem>{};
|
||||
if (json is Map && json.isNotEmpty) {
|
||||
json = json.cast<String, dynamic>(); // ignore: parameter_assignments
|
||||
for (final entry in json.entries) {
|
||||
final value = SystemConfigResponseItem.fromJson(entry.value);
|
||||
if (value != null) {
|
||||
map[entry.key] = value;
|
||||
}
|
||||
}
|
||||
}
|
||||
return map;
|
||||
}
|
||||
|
||||
// maps a json object with a list of SystemConfigResponseItem-objects as value to a dart map
|
||||
static Map<String, List<SystemConfigResponseItem>> mapListFromJson(dynamic json, {bool growable = false,}) {
|
||||
final map = <String, List<SystemConfigResponseItem>>{};
|
||||
if (json is Map && json.isNotEmpty) {
|
||||
json = json.cast<String, dynamic>(); // ignore: parameter_assignments
|
||||
for (final entry in json.entries) {
|
||||
final value = SystemConfigResponseItem.listFromJson(entry.value, growable: growable,);
|
||||
if (value != null) {
|
||||
map[entry.key] = value;
|
||||
}
|
||||
}
|
||||
}
|
||||
return map;
|
||||
}
|
||||
|
||||
/// The list of required keys that must be present in a JSON.
|
||||
static const requiredKeys = <String>{
|
||||
'name',
|
||||
'key',
|
||||
'value',
|
||||
'defaultValue',
|
||||
};
|
||||
}
|
||||
|
||||
@ -0,0 +1,47 @@
|
||||
//
|
||||
// AUTO-GENERATED FILE, DO NOT MODIFY!
|
||||
//
|
||||
// @dart=2.12
|
||||
|
||||
// ignore_for_file: unused_element, unused_import
|
||||
// ignore_for_file: always_put_required_named_parameters_first
|
||||
// ignore_for_file: constant_identifier_names
|
||||
// ignore_for_file: lines_longer_than_80_chars
|
||||
|
||||
import 'package:openapi/api.dart';
|
||||
import 'package:test/test.dart';
|
||||
|
||||
// tests for SystemConfigFFmpegDto
|
||||
void main() {
|
||||
// final instance = SystemConfigFFmpegDto();
|
||||
|
||||
group('test SystemConfigFFmpegDto', () {
|
||||
// String crf
|
||||
test('to test the property `crf`', () async {
|
||||
// TODO
|
||||
});
|
||||
|
||||
// String preset
|
||||
test('to test the property `preset`', () async {
|
||||
// TODO
|
||||
});
|
||||
|
||||
// String targetVideoCodec
|
||||
test('to test the property `targetVideoCodec`', () async {
|
||||
// TODO
|
||||
});
|
||||
|
||||
// String targetAudioCodec
|
||||
test('to test the property `targetAudioCodec`', () async {
|
||||
// TODO
|
||||
});
|
||||
|
||||
// String targetScaling
|
||||
test('to test the property `targetScaling`', () async {
|
||||
// TODO
|
||||
});
|
||||
|
||||
|
||||
});
|
||||
|
||||
}
|
||||
@ -1,21 +0,0 @@
|
||||
//
|
||||
// AUTO-GENERATED FILE, DO NOT MODIFY!
|
||||
//
|
||||
// @dart=2.12
|
||||
|
||||
// ignore_for_file: unused_element, unused_import
|
||||
// ignore_for_file: always_put_required_named_parameters_first
|
||||
// ignore_for_file: constant_identifier_names
|
||||
// ignore_for_file: lines_longer_than_80_chars
|
||||
|
||||
import 'package:openapi/api.dart';
|
||||
import 'package:test/test.dart';
|
||||
|
||||
// tests for SystemConfigKey
|
||||
void main() {
|
||||
|
||||
group('test SystemConfigKey', () {
|
||||
|
||||
});
|
||||
|
||||
}
|
||||
@ -0,0 +1,57 @@
|
||||
//
|
||||
// AUTO-GENERATED FILE, DO NOT MODIFY!
|
||||
//
|
||||
// @dart=2.12
|
||||
|
||||
// ignore_for_file: unused_element, unused_import
|
||||
// ignore_for_file: always_put_required_named_parameters_first
|
||||
// ignore_for_file: constant_identifier_names
|
||||
// ignore_for_file: lines_longer_than_80_chars
|
||||
|
||||
import 'package:openapi/api.dart';
|
||||
import 'package:test/test.dart';
|
||||
|
||||
// tests for SystemConfigOAuthDto
|
||||
void main() {
|
||||
// final instance = SystemConfigOAuthDto();
|
||||
|
||||
group('test SystemConfigOAuthDto', () {
|
||||
// bool enabled
|
||||
test('to test the property `enabled`', () async {
|
||||
// TODO
|
||||
});
|
||||
|
||||
// String issuerUrl
|
||||
test('to test the property `issuerUrl`', () async {
|
||||
// TODO
|
||||
});
|
||||
|
||||
// String clientId
|
||||
test('to test the property `clientId`', () async {
|
||||
// TODO
|
||||
});
|
||||
|
||||
// String clientSecret
|
||||
test('to test the property `clientSecret`', () async {
|
||||
// TODO
|
||||
});
|
||||
|
||||
// String scope
|
||||
test('to test the property `scope`', () async {
|
||||
// TODO
|
||||
});
|
||||
|
||||
// String buttonText
|
||||
test('to test the property `buttonText`', () async {
|
||||
// TODO
|
||||
});
|
||||
|
||||
// bool autoRegister
|
||||
test('to test the property `autoRegister`', () async {
|
||||
// TODO
|
||||
});
|
||||
|
||||
|
||||
});
|
||||
|
||||
}
|
||||
@ -1,42 +0,0 @@
|
||||
//
|
||||
// AUTO-GENERATED FILE, DO NOT MODIFY!
|
||||
//
|
||||
// @dart=2.12
|
||||
|
||||
// ignore_for_file: unused_element, unused_import
|
||||
// ignore_for_file: always_put_required_named_parameters_first
|
||||
// ignore_for_file: constant_identifier_names
|
||||
// ignore_for_file: lines_longer_than_80_chars
|
||||
|
||||
import 'package:openapi/api.dart';
|
||||
import 'package:test/test.dart';
|
||||
|
||||
// tests for SystemConfigResponseItem
|
||||
void main() {
|
||||
// final instance = SystemConfigResponseItem();
|
||||
|
||||
group('test SystemConfigResponseItem', () {
|
||||
// String name
|
||||
test('to test the property `name`', () async {
|
||||
// TODO
|
||||
});
|
||||
|
||||
// SystemConfigKey key
|
||||
test('to test the property `key`', () async {
|
||||
// TODO
|
||||
});
|
||||
|
||||
// String value
|
||||
test('to test the property `value`', () async {
|
||||
// TODO
|
||||
});
|
||||
|
||||
// String defaultValue
|
||||
test('to test the property `defaultValue`', () async {
|
||||
// TODO
|
||||
});
|
||||
|
||||
|
||||
});
|
||||
|
||||
}
|
||||
@ -0,0 +1,18 @@
|
||||
import { IsString } from 'class-validator';
|
||||
|
||||
export class SystemConfigFFmpegDto {
|
||||
@IsString()
|
||||
crf!: string;
|
||||
|
||||
@IsString()
|
||||
preset!: string;
|
||||
|
||||
@IsString()
|
||||
targetVideoCodec!: string;
|
||||
|
||||
@IsString()
|
||||
targetAudioCodec!: string;
|
||||
|
||||
@IsString()
|
||||
targetScaling!: string;
|
||||
}
|
||||
@ -0,0 +1,32 @@
|
||||
import { IsBoolean, IsNotEmpty, IsString, ValidateIf } from 'class-validator';
|
||||
|
||||
const isEnabled = (config: SystemConfigOAuthDto) => config.enabled;
|
||||
|
||||
export class SystemConfigOAuthDto {
|
||||
@IsBoolean()
|
||||
enabled!: boolean;
|
||||
|
||||
@ValidateIf(isEnabled)
|
||||
@IsNotEmpty()
|
||||
@IsString()
|
||||
issuerUrl!: string;
|
||||
|
||||
@ValidateIf(isEnabled)
|
||||
@IsNotEmpty()
|
||||
@IsString()
|
||||
clientId!: string;
|
||||
|
||||
@ValidateIf(isEnabled)
|
||||
@IsNotEmpty()
|
||||
@IsString()
|
||||
clientSecret!: string;
|
||||
|
||||
@IsString()
|
||||
scope!: string;
|
||||
|
||||
@IsString()
|
||||
buttonText!: string;
|
||||
|
||||
@IsBoolean()
|
||||
autoRegister!: boolean;
|
||||
}
|
||||
@ -0,0 +1,16 @@
|
||||
import { SystemConfig } from '@app/database/entities/system-config.entity';
|
||||
import { ValidateNested } from 'class-validator';
|
||||
import { SystemConfigFFmpegDto } from './system-config-ffmpeg.dto';
|
||||
import { SystemConfigOAuthDto } from './system-config-oauth.dto';
|
||||
|
||||
export class SystemConfigDto {
|
||||
@ValidateNested()
|
||||
ffmpeg!: SystemConfigFFmpegDto;
|
||||
|
||||
@ValidateNested()
|
||||
oauth!: SystemConfigOAuthDto;
|
||||
}
|
||||
|
||||
export function mapConfig(config: SystemConfig): SystemConfigDto {
|
||||
return config;
|
||||
}
|
||||
@ -1,20 +0,0 @@
|
||||
import { SystemConfigKey, SystemConfigValue } from '@app/database/entities/system-config.entity';
|
||||
import { ApiProperty } from '@nestjs/swagger';
|
||||
import { IsEnum, IsNotEmpty, ValidateNested } from 'class-validator';
|
||||
|
||||
export class UpdateSystemConfigDto {
|
||||
@IsNotEmpty()
|
||||
@ValidateNested({ each: true })
|
||||
config!: SystemConfigItem[];
|
||||
}
|
||||
|
||||
export class SystemConfigItem {
|
||||
@IsNotEmpty()
|
||||
@IsEnum(SystemConfigKey)
|
||||
@ApiProperty({
|
||||
enum: SystemConfigKey,
|
||||
enumName: 'SystemConfigKey',
|
||||
})
|
||||
key!: SystemConfigKey;
|
||||
value!: SystemConfigValue;
|
||||
}
|
||||
@ -1,20 +0,0 @@
|
||||
import { SystemConfigKey, SystemConfigValue } from '@app/database/entities/system-config.entity';
|
||||
import { ApiProperty } from '@nestjs/swagger';
|
||||
|
||||
export class SystemConfigResponseDto {
|
||||
config!: SystemConfigResponseItem[];
|
||||
}
|
||||
|
||||
export class SystemConfigResponseItem {
|
||||
@ApiProperty({ type: 'string' })
|
||||
name!: string;
|
||||
|
||||
@ApiProperty({ enumName: 'SystemConfigKey', enum: SystemConfigKey })
|
||||
key!: SystemConfigKey;
|
||||
|
||||
@ApiProperty({ type: 'string' })
|
||||
value!: SystemConfigValue;
|
||||
|
||||
@ApiProperty({ type: 'string' })
|
||||
defaultValue!: SystemConfigValue;
|
||||
}
|
||||
@ -1,20 +1,23 @@
|
||||
import { Injectable } from '@nestjs/common';
|
||||
import { ImmichConfigService } from 'libs/immich-config/src';
|
||||
import { UpdateSystemConfigDto } from './dto/update-system-config';
|
||||
import { SystemConfigResponseDto } from './response-dto/system-config-response.dto';
|
||||
import { mapConfig, SystemConfigDto } from './dto/system-config.dto';
|
||||
|
||||
@Injectable()
|
||||
export class SystemConfigService {
|
||||
constructor(private immichConfigService: ImmichConfigService) {}
|
||||
|
||||
async getConfig(): Promise<SystemConfigResponseDto> {
|
||||
const config = await this.immichConfigService.getSystemConfig();
|
||||
return { config };
|
||||
public async getConfig(): Promise<SystemConfigDto> {
|
||||
const config = await this.immichConfigService.getConfig();
|
||||
return mapConfig(config);
|
||||
}
|
||||
|
||||
async updateConfig(dto: UpdateSystemConfigDto): Promise<SystemConfigResponseDto> {
|
||||
await this.immichConfigService.updateSystemConfig(dto.config);
|
||||
const config = await this.immichConfigService.getSystemConfig();
|
||||
return { config };
|
||||
public getDefaults(): SystemConfigDto {
|
||||
const config = this.immichConfigService.getDefaults();
|
||||
return mapConfig(config);
|
||||
}
|
||||
|
||||
public async updateConfig(dto: SystemConfigDto): Promise<SystemConfigDto> {
|
||||
await this.immichConfigService.updateConfig(dto);
|
||||
return this.getConfig();
|
||||
}
|
||||
}
|
||||
|
||||
@ -1,27 +1,47 @@
|
||||
import { Column, Entity, PrimaryColumn } from 'typeorm';
|
||||
|
||||
@Entity('system_config')
|
||||
export class SystemConfigEntity {
|
||||
export class SystemConfigEntity<T = string> {
|
||||
@PrimaryColumn()
|
||||
key!: SystemConfigKey;
|
||||
|
||||
@Column({ type: 'varchar', nullable: true })
|
||||
value!: SystemConfigValue;
|
||||
@Column({ type: 'varchar', nullable: true, transformer: { to: JSON.stringify, from: JSON.parse } })
|
||||
value!: T;
|
||||
}
|
||||
|
||||
export type SystemConfig = SystemConfigEntity[];
|
||||
export type SystemConfigValue = any;
|
||||
|
||||
// dot notation matches path in `SystemConfig`
|
||||
export enum SystemConfigKey {
|
||||
FFMPEG_CRF = 'ffmpeg_crf',
|
||||
FFMPEG_PRESET = 'ffmpeg_preset',
|
||||
FFMPEG_TARGET_VIDEO_CODEC = 'ffmpeg_target_video_codec',
|
||||
FFMPEG_TARGET_AUDIO_CODEC = 'ffmpeg_target_audio_codec',
|
||||
FFMPEG_TARGET_SCALING = 'ffmpeg_target_scaling',
|
||||
FFMPEG_CRF = 'ffmpeg.crf',
|
||||
FFMPEG_PRESET = 'ffmpeg.preset',
|
||||
FFMPEG_TARGET_VIDEO_CODEC = 'ffmpeg.targetVideoCodec',
|
||||
FFMPEG_TARGET_AUDIO_CODEC = 'ffmpeg.targetAudioCodec',
|
||||
FFMPEG_TARGET_SCALING = 'ffmpeg.targetScaling',
|
||||
OAUTH_ENABLED = 'oauth.enabled',
|
||||
OAUTH_ISSUER_URL = 'oauth.issuerUrl',
|
||||
OAUTH_CLIENT_ID = 'oauth.clientId',
|
||||
OAUTH_CLIENT_SECRET = 'oauth.clientSecret',
|
||||
OAUTH_SCOPE = 'oauth.scope',
|
||||
OAUTH_BUTTON_TEXT = 'oauth.buttonText',
|
||||
OAUTH_AUTO_REGISTER = 'oauth.autoRegister',
|
||||
}
|
||||
|
||||
export type SystemConfigValue = string | null;
|
||||
|
||||
export interface SystemConfigItem {
|
||||
key: SystemConfigKey;
|
||||
value: SystemConfigValue;
|
||||
export interface SystemConfig {
|
||||
ffmpeg: {
|
||||
crf: string;
|
||||
preset: string;
|
||||
targetVideoCodec: string;
|
||||
targetAudioCodec: string;
|
||||
targetScaling: string;
|
||||
};
|
||||
oauth: {
|
||||
enabled: boolean;
|
||||
issuerUrl: string;
|
||||
clientId: string;
|
||||
clientSecret: string;
|
||||
scope: string;
|
||||
buttonText: string;
|
||||
autoRegister: boolean;
|
||||
};
|
||||
}
|
||||
|
||||
@ -0,0 +1,11 @@
|
||||
import { MigrationInterface, QueryRunner } from 'typeorm';
|
||||
|
||||
export class TruncateOldConfigItems1670607437008 implements MigrationInterface {
|
||||
public async up(queryRunner: QueryRunner): Promise<void> {
|
||||
await queryRunner.query(`TRUNCATE TABLE "system_config"`);
|
||||
}
|
||||
|
||||
public async down(): Promise<void> {
|
||||
// noop
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,126 @@
|
||||
<script lang="ts">
|
||||
import {
|
||||
notificationController,
|
||||
NotificationType
|
||||
} from '$lib/components/shared-components/notification/notification';
|
||||
import { api, SystemConfigFFmpegDto } from '@api';
|
||||
import SettingButtonsRow from '../setting-buttons-row.svelte';
|
||||
import SettingInputField, { SettingInputFieldType } from '../setting-input-field.svelte';
|
||||
import _ from 'lodash';
|
||||
export let ffmpegConfig: SystemConfigFFmpegDto; // this is the config that is being edited
|
||||
import { fade } from 'svelte/transition';
|
||||
|
||||
let savedConfig: SystemConfigFFmpegDto;
|
||||
let defaultConfig: SystemConfigFFmpegDto;
|
||||
|
||||
async function getConfigs() {
|
||||
[savedConfig, defaultConfig] = await Promise.all([
|
||||
api.systemConfigApi.getConfig().then((res) => res.data.ffmpeg),
|
||||
api.systemConfigApi.getDefaults().then((res) => res.data.ffmpeg)
|
||||
]);
|
||||
}
|
||||
|
||||
async function saveSetting() {
|
||||
try {
|
||||
const { data: configs } = await api.systemConfigApi.getConfig();
|
||||
|
||||
const result = await api.systemConfigApi.updateConfig({
|
||||
ffmpeg: ffmpegConfig,
|
||||
oauth: configs.oauth
|
||||
});
|
||||
|
||||
ffmpegConfig = result.data.ffmpeg;
|
||||
savedConfig = result.data.ffmpeg;
|
||||
|
||||
notificationController.show({
|
||||
message: 'FFmpeg settings saved',
|
||||
type: NotificationType.Info
|
||||
});
|
||||
} catch (e) {
|
||||
console.error('Error [ffmpeg-settings] [saveSetting]', e);
|
||||
notificationController.show({
|
||||
message: 'Unable to save settings',
|
||||
type: NotificationType.Error
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
async function reset() {
|
||||
const { data: resetConfig } = await api.systemConfigApi.getConfig();
|
||||
|
||||
ffmpegConfig = resetConfig.ffmpeg;
|
||||
savedConfig = resetConfig.ffmpeg;
|
||||
|
||||
notificationController.show({
|
||||
message: 'Reset FFmpeg settings to the recent saved settings',
|
||||
type: NotificationType.Info
|
||||
});
|
||||
}
|
||||
|
||||
async function resetToDefault() {
|
||||
const { data: configs } = await api.systemConfigApi.getDefaults();
|
||||
|
||||
ffmpegConfig = configs.ffmpeg;
|
||||
defaultConfig = configs.ffmpeg;
|
||||
|
||||
notificationController.show({
|
||||
message: 'Reset FFmpeg settings to default',
|
||||
type: NotificationType.Info
|
||||
});
|
||||
}
|
||||
</script>
|
||||
|
||||
<div>
|
||||
{#await getConfigs() then}
|
||||
<div in:fade={{ duration: 500 }}>
|
||||
<form autocomplete="off" on:submit|preventDefault>
|
||||
<SettingInputField
|
||||
inputType={SettingInputFieldType.NUMBER}
|
||||
label="CRF"
|
||||
bind:value={ffmpegConfig.crf}
|
||||
required={true}
|
||||
isEdited={!(ffmpegConfig.crf == savedConfig.crf)}
|
||||
/>
|
||||
|
||||
<SettingInputField
|
||||
inputType={SettingInputFieldType.TEXT}
|
||||
label="PRESET"
|
||||
bind:value={ffmpegConfig.preset}
|
||||
required={true}
|
||||
isEdited={!(ffmpegConfig.preset == savedConfig.preset)}
|
||||
/>
|
||||
|
||||
<SettingInputField
|
||||
inputType={SettingInputFieldType.TEXT}
|
||||
label="AUDIO CODEC"
|
||||
bind:value={ffmpegConfig.targetAudioCodec}
|
||||
required={true}
|
||||
isEdited={!(ffmpegConfig.targetAudioCodec == savedConfig.targetAudioCodec)}
|
||||
/>
|
||||
|
||||
<SettingInputField
|
||||
inputType={SettingInputFieldType.TEXT}
|
||||
label="VIDEO CODEC"
|
||||
bind:value={ffmpegConfig.targetVideoCodec}
|
||||
required={true}
|
||||
isEdited={!(ffmpegConfig.targetVideoCodec == savedConfig.targetVideoCodec)}
|
||||
/>
|
||||
|
||||
<SettingInputField
|
||||
inputType={SettingInputFieldType.TEXT}
|
||||
label="SCALING"
|
||||
bind:value={ffmpegConfig.targetScaling}
|
||||
required={true}
|
||||
isEdited={!(ffmpegConfig.targetScaling == savedConfig.targetScaling)}
|
||||
/>
|
||||
|
||||
<SettingButtonsRow
|
||||
on:reset={reset}
|
||||
on:save={saveSetting}
|
||||
on:reset-to-default={resetToDefault}
|
||||
showResetToDefault={!_.isEqual(savedConfig, defaultConfig)}
|
||||
/>
|
||||
</form>
|
||||
</div>
|
||||
{/await}
|
||||
</div>
|
||||
@ -0,0 +1,147 @@
|
||||
<script lang="ts">
|
||||
import {
|
||||
notificationController,
|
||||
NotificationType
|
||||
} from '$lib/components/shared-components/notification/notification';
|
||||
import { api, SystemConfigOAuthDto } from '@api';
|
||||
import SettingButtonsRow from '../setting-buttons-row.svelte';
|
||||
import SettingInputField, { SettingInputFieldType } from '../setting-input-field.svelte';
|
||||
import SettingSwitch from '../setting-switch.svelte';
|
||||
import _ from 'lodash';
|
||||
import { fade } from 'svelte/transition';
|
||||
|
||||
export let oauthConfig: SystemConfigOAuthDto;
|
||||
|
||||
let savedConfig: SystemConfigOAuthDto;
|
||||
let defaultConfig: SystemConfigOAuthDto;
|
||||
|
||||
async function getConfigs() {
|
||||
[savedConfig, defaultConfig] = await Promise.all([
|
||||
api.systemConfigApi.getConfig().then((res) => res.data.oauth),
|
||||
api.systemConfigApi.getDefaults().then((res) => res.data.oauth)
|
||||
]);
|
||||
}
|
||||
|
||||
async function reset() {
|
||||
const { data: resetConfig } = await api.systemConfigApi.getConfig();
|
||||
|
||||
oauthConfig = resetConfig.oauth;
|
||||
savedConfig = resetConfig.oauth;
|
||||
|
||||
notificationController.show({
|
||||
message: 'Reset OAuth settings to the recent saved settings',
|
||||
type: NotificationType.Info
|
||||
});
|
||||
}
|
||||
|
||||
async function saveSetting() {
|
||||
try {
|
||||
const { data: currentConfig } = await api.systemConfigApi.getConfig();
|
||||
|
||||
const result = await api.systemConfigApi.updateConfig({
|
||||
ffmpeg: currentConfig.ffmpeg,
|
||||
oauth: oauthConfig
|
||||
});
|
||||
|
||||
oauthConfig = result.data.oauth;
|
||||
savedConfig = result.data.oauth;
|
||||
|
||||
notificationController.show({
|
||||
message: 'OAuth settings saved',
|
||||
type: NotificationType.Info
|
||||
});
|
||||
} catch (e) {
|
||||
console.error('Error [oauth-settings] [saveSetting]', e);
|
||||
notificationController.show({
|
||||
message: 'Unable to save settings',
|
||||
type: NotificationType.Error
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
async function resetToDefault() {
|
||||
const { data: defaultConfig } = await api.systemConfigApi.getDefaults();
|
||||
|
||||
oauthConfig = defaultConfig.oauth;
|
||||
|
||||
notificationController.show({
|
||||
message: 'Reset OAuth settings to default',
|
||||
type: NotificationType.Info
|
||||
});
|
||||
}
|
||||
</script>
|
||||
|
||||
<div class="mt-2">
|
||||
{#await getConfigs() then}
|
||||
<div in:fade={{ duration: 500 }}>
|
||||
<form autocomplete="off" on:submit|preventDefault>
|
||||
<div class="mt-4">
|
||||
<SettingSwitch title="Enable" bind:checked={oauthConfig.enabled} />
|
||||
</div>
|
||||
|
||||
<hr class="m-4" />
|
||||
|
||||
<SettingInputField
|
||||
inputType={SettingInputFieldType.TEXT}
|
||||
label="ISSUER URL"
|
||||
bind:value={oauthConfig.issuerUrl}
|
||||
required={true}
|
||||
disabled={!oauthConfig.enabled}
|
||||
isEdited={!(oauthConfig.issuerUrl == savedConfig.issuerUrl)}
|
||||
/>
|
||||
|
||||
<SettingInputField
|
||||
inputType={SettingInputFieldType.TEXT}
|
||||
label="CLIENT ID"
|
||||
bind:value={oauthConfig.clientId}
|
||||
required={true}
|
||||
disabled={!oauthConfig.enabled}
|
||||
isEdited={!(oauthConfig.clientId == savedConfig.clientId)}
|
||||
/>
|
||||
|
||||
<SettingInputField
|
||||
inputType={SettingInputFieldType.TEXT}
|
||||
label="CLIENT SECRET"
|
||||
bind:value={oauthConfig.clientSecret}
|
||||
required={true}
|
||||
disabled={!oauthConfig.enabled}
|
||||
isEdited={!(oauthConfig.clientSecret == savedConfig.clientSecret)}
|
||||
/>
|
||||
|
||||
<SettingInputField
|
||||
inputType={SettingInputFieldType.TEXT}
|
||||
label="SCOPE"
|
||||
bind:value={oauthConfig.scope}
|
||||
required={true}
|
||||
disabled={!oauthConfig.enabled}
|
||||
isEdited={!(oauthConfig.scope == savedConfig.scope)}
|
||||
/>
|
||||
|
||||
<SettingInputField
|
||||
inputType={SettingInputFieldType.TEXT}
|
||||
label="BUTTON TEXT"
|
||||
bind:value={oauthConfig.buttonText}
|
||||
required={false}
|
||||
disabled={!oauthConfig.enabled}
|
||||
isEdited={!(oauthConfig.buttonText == savedConfig.buttonText)}
|
||||
/>
|
||||
|
||||
<div class="mt-4">
|
||||
<SettingSwitch
|
||||
title="AUTO REGISTER"
|
||||
subtitle="Automatically register new users after singning in with OAuth"
|
||||
bind:checked={oauthConfig.autoRegister}
|
||||
disabled={!oauthConfig.enabled}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<SettingButtonsRow
|
||||
on:reset={reset}
|
||||
on:save={saveSetting}
|
||||
on:reset-to-default={resetToDefault}
|
||||
showResetToDefault={!_.isEqual(savedConfig, defaultConfig)}
|
||||
/>
|
||||
</form>
|
||||
</div>
|
||||
{/await}
|
||||
</div>
|
||||
@ -0,0 +1,56 @@
|
||||
<script lang="ts">
|
||||
import { slide } from 'svelte/transition';
|
||||
export let title: string;
|
||||
export let subtitle = '';
|
||||
|
||||
let isOpen = false;
|
||||
const toggle = () => (isOpen = !isOpen);
|
||||
</script>
|
||||
|
||||
<div class="border-b-[1px] border-gray-200 dark:border-gray-700 py-4">
|
||||
<div class="flex justify-between place-items-center">
|
||||
<div>
|
||||
<h2 class="font-medium text-immich-primary dark:text-immich-dark-primary">
|
||||
{title}
|
||||
</h2>
|
||||
|
||||
<p class="text-sm dark:text-immich-dark-fg">{subtitle}</p>
|
||||
</div>
|
||||
|
||||
<button
|
||||
on:click={toggle}
|
||||
aria-expanded={isOpen}
|
||||
class="immich-circle-icon-button hover:bg-immich-primary/10 dark:text-immich-dark-fg hover:dark:bg-immich-dark-primary/20 rounded-full p-3 flex place-items-center place-content-center transition-all"
|
||||
>
|
||||
<svg
|
||||
style="tran"
|
||||
width="20"
|
||||
height="20"
|
||||
fill="none"
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
stroke-width="2"
|
||||
viewBox="0 0 24 24"
|
||||
stroke="currentColor"
|
||||
>
|
||||
<path d="M19 9l-7 7-7-7" />
|
||||
</svg>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
{#if isOpen}
|
||||
<ul transition:slide={{ duration: 250 }} class="mb-2 ml-4">
|
||||
<slot />
|
||||
</ul>
|
||||
{/if}
|
||||
</div>
|
||||
|
||||
<style>
|
||||
svg {
|
||||
transition: transform 0.2s ease-in;
|
||||
}
|
||||
|
||||
[aria-expanded='true'] svg {
|
||||
transform: rotate(0.5turn);
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,35 @@
|
||||
<script lang="ts">
|
||||
import { createEventDispatcher } from 'svelte';
|
||||
|
||||
const dispatch = createEventDispatcher();
|
||||
|
||||
export let showResetToDefault = true;
|
||||
</script>
|
||||
|
||||
<div class="flex justify-between gap-2 mx-4 mt-8">
|
||||
<div class="left">
|
||||
{#if showResetToDefault}
|
||||
<button
|
||||
on:click|preventDefault={() => dispatch('reset-to-default')}
|
||||
class="text-sm dark:text-immich-dark-primary hover:dark:text-immich-dark-primary/75 text-immich-primary hover:text-immich-primary/75 font-medium bg-none"
|
||||
>
|
||||
Reset to default
|
||||
</button>
|
||||
{/if}
|
||||
</div>
|
||||
|
||||
<div class="right">
|
||||
<button
|
||||
on:click|preventDefault={() => dispatch('reset')}
|
||||
class="text-sm bg-gray-500 dark:bg-gray-200 hover:bg-gray-500/75 dark:hover:bg-gray-200/80 px-4 py-2 text-white dark:text-immich-dark-gray rounded-full shadow-md font-medium disabled:opacity-50 disabled:cursor-not-allowed"
|
||||
>Reset
|
||||
</button>
|
||||
|
||||
<button
|
||||
type="submit"
|
||||
on:click={() => dispatch('save')}
|
||||
class="text-sm bg-immich-primary dark:bg-immich-dark-primary hover:bg-immich-primary/75 dark:hover:bg-immich-dark-primary/80 px-4 py-2 text-white dark:text-immich-dark-gray rounded-full shadow-md font-medium disabled:opacity-50 disabled:cursor-not-allowed"
|
||||
>Save
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
@ -0,0 +1,51 @@
|
||||
<script lang="ts" context="module">
|
||||
export enum SettingInputFieldType {
|
||||
TEXT = 'text',
|
||||
NUMBER = 'number',
|
||||
PASSWORD = 'password'
|
||||
}
|
||||
</script>
|
||||
|
||||
<script lang="ts">
|
||||
import { quintOut } from 'svelte/easing';
|
||||
import { fly } from 'svelte/transition';
|
||||
|
||||
export let inputType: SettingInputFieldType;
|
||||
export let value: string;
|
||||
export let label: string;
|
||||
export let required = false;
|
||||
export let disabled = false;
|
||||
export let isEdited: boolean;
|
||||
|
||||
const handleInput = (e: Event) => {
|
||||
value = (e.target as HTMLInputElement).value;
|
||||
};
|
||||
</script>
|
||||
|
||||
<div class="m-4 flex flex-col gap-2">
|
||||
<div class="flex place-items-center gap-1">
|
||||
<label class="immich-form-label" for={label}>{label.toUpperCase()} </label>
|
||||
{#if required}
|
||||
<div class="text-red-400">*</div>
|
||||
{/if}
|
||||
|
||||
{#if isEdited}
|
||||
<div
|
||||
transition:fly={{ x: 10, duration: 200, easing: quintOut }}
|
||||
class="text-gray-500 text-xs italic"
|
||||
>
|
||||
Unsaved change
|
||||
</div>
|
||||
{/if}
|
||||
</div>
|
||||
<input
|
||||
class="immich-form-input"
|
||||
id={label}
|
||||
name={label}
|
||||
type={inputType}
|
||||
{required}
|
||||
{value}
|
||||
on:input={handleInput}
|
||||
{disabled}
|
||||
/>
|
||||
</div>
|
||||
@ -0,0 +1,81 @@
|
||||
<script lang="ts">
|
||||
export let title: string;
|
||||
export let subtitle = '';
|
||||
export let checked = false;
|
||||
export let disabled = false;
|
||||
</script>
|
||||
|
||||
<div class="flex justify-between mx-4 place-items-center">
|
||||
<div>
|
||||
<h2 class="immich-form-label">
|
||||
{title.toUpperCase()}
|
||||
</h2>
|
||||
|
||||
<p class="text-sm dark:text-immich-dark-fg">{subtitle}</p>
|
||||
</div>
|
||||
|
||||
<label class="relative inline-block w-[36px] h-[10px]" {disabled}>
|
||||
<input
|
||||
class="opacity-0 w-0 h-0 disabled::cursor-not-allowed"
|
||||
type="checkbox"
|
||||
bind:checked
|
||||
{disabled}
|
||||
/>
|
||||
|
||||
{#if disabled}
|
||||
<span class="slider-disable" />
|
||||
{:else}
|
||||
<span class="slider" />
|
||||
{/if}
|
||||
</label>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.slider,
|
||||
.slider-disable {
|
||||
position: absolute;
|
||||
cursor: pointer;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
background-color: #ccc;
|
||||
-webkit-transition: 0.4s;
|
||||
transition: 0.4s;
|
||||
border-radius: 34px;
|
||||
}
|
||||
|
||||
input:disabled {
|
||||
cursor: not-allowed;
|
||||
}
|
||||
|
||||
.slider:before,
|
||||
.slider-disable:before {
|
||||
position: absolute;
|
||||
content: '';
|
||||
height: 20px;
|
||||
width: 20px;
|
||||
left: 0px;
|
||||
right: 0px;
|
||||
bottom: -4px;
|
||||
background-color: gray;
|
||||
-webkit-transition: 0.4s;
|
||||
transition: 0.4s;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
input:checked + .slider-disable {
|
||||
background-color: gray;
|
||||
}
|
||||
|
||||
input:checked + .slider {
|
||||
background-color: #adcbfa;
|
||||
}
|
||||
|
||||
input:checked + .slider:before {
|
||||
-webkit-transform: translateX(18px);
|
||||
-ms-transform: translateX(18px);
|
||||
transform: translateX(18px);
|
||||
background-color: #4250af;
|
||||
}
|
||||
</style>
|
||||
@ -1,97 +0,0 @@
|
||||
<script lang="ts">
|
||||
import LoadingSpinner from '$lib/components/shared-components/loading-spinner.svelte';
|
||||
import {
|
||||
notificationController,
|
||||
NotificationType
|
||||
} from '$lib/components/shared-components/notification/notification';
|
||||
import { api, SystemConfigResponseItem } from '@api';
|
||||
import { onMount } from 'svelte';
|
||||
|
||||
let isSaving = false;
|
||||
let items: Array<SystemConfigResponseItem & { originalValue: string }> = [];
|
||||
|
||||
const refreshConfig = async () => {
|
||||
const { data: systemConfig } = await api.systemConfigApi.getConfig();
|
||||
items = systemConfig.config.map((item) => ({ ...item, originalValue: item.value }));
|
||||
};
|
||||
|
||||
onMount(() => refreshConfig());
|
||||
|
||||
const handleSave = async () => {
|
||||
try {
|
||||
isSaving = true;
|
||||
const updates = items
|
||||
.filter((item) => item.value !== item.originalValue)
|
||||
.map(({ key, value }) => ({ key, value: value || null }));
|
||||
if (updates.length > 0) {
|
||||
await api.systemConfigApi.updateConfig({ config: updates });
|
||||
refreshConfig();
|
||||
}
|
||||
|
||||
notificationController.show({
|
||||
message: `Saved settings`,
|
||||
type: NotificationType.Info
|
||||
});
|
||||
} catch (e) {
|
||||
console.error('Error [updateSystemConfig]', e);
|
||||
notificationController.show({
|
||||
message: `Unable to save changes.`,
|
||||
type: NotificationType.Error
|
||||
});
|
||||
} finally {
|
||||
isSaving = false;
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<section>
|
||||
<table class="text-left my-4 w-full">
|
||||
<thead
|
||||
class="border rounded-md mb-4 bg-gray-50 flex text-immich-primary h-12 dark:bg-immich-dark-gray dark:text-immich-dark-primary dark:border-immich-dark-gray"
|
||||
>
|
||||
<tr class="flex w-full place-items-center">
|
||||
<th class="text-center w-1/2 font-medium text-sm">Setting</th>
|
||||
<th class="text-center w-1/2 font-medium text-sm">Value</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody class="rounded-md block border dark:border-immich-dark-gray">
|
||||
{#each items as item, i}
|
||||
<tr
|
||||
class={`text-center flex place-items-center w-full h-[80px] dark:text-immich-dark-fg ${
|
||||
i % 2 == 0 ? 'bg-slate-50 dark:bg-[#181818]' : 'bg-immich-bg dark:bg-immich-dark-bg'
|
||||
}`}
|
||||
>
|
||||
<td class="text-sm px-4 w-1/2 text-ellipsis">
|
||||
{item.name}
|
||||
</td>
|
||||
<td class="text-sm px-4 w-1/2 text-ellipsis">
|
||||
<input
|
||||
style="text-align: center"
|
||||
class="immich-form-input"
|
||||
id={item.key}
|
||||
disabled={isSaving}
|
||||
name={item.key}
|
||||
type="text"
|
||||
bind:value={item.value}
|
||||
placeholder={item.defaultValue + ''}
|
||||
/>
|
||||
</td>
|
||||
</tr>
|
||||
{/each}
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
<div class="flex justify-end">
|
||||
<button
|
||||
on:click={handleSave}
|
||||
class="px-6 py-3 text-sm bg-immich-primary dark:bg-immich-dark-primary font-medium rounded-2xl hover:bg-immich-primary/50 transition-all hover:cursor-pointer disabled:cursor-not-allowed shadow-sm text-immich-bg dark:text-immich-dark-gray"
|
||||
disabled={isSaving}
|
||||
>
|
||||
{#if isSaving}
|
||||
<LoadingSpinner />
|
||||
{:else}
|
||||
Save
|
||||
{/if}
|
||||
</button>
|
||||
</div>
|
||||
</section>
|
||||
@ -1,91 +0,0 @@
|
||||
<script lang="ts">
|
||||
import { UserResponseDto } from '@api';
|
||||
|
||||
import { createEventDispatcher } from 'svelte';
|
||||
import PencilOutline from 'svelte-material-icons/PencilOutline.svelte';
|
||||
import TrashCanOutline from 'svelte-material-icons/TrashCanOutline.svelte';
|
||||
import DeleteRestore from 'svelte-material-icons/DeleteRestore.svelte';
|
||||
|
||||
export let allUsers: Array<UserResponseDto>;
|
||||
|
||||
const dispatch = createEventDispatcher();
|
||||
|
||||
const isDeleted = (user: UserResponseDto): boolean => {
|
||||
return user.deletedAt != null;
|
||||
};
|
||||
|
||||
const locale = navigator.language;
|
||||
const deleteDateFormat: Intl.DateTimeFormatOptions = {
|
||||
month: 'long',
|
||||
day: 'numeric',
|
||||
year: 'numeric'
|
||||
};
|
||||
|
||||
const getDeleteDate = (user: UserResponseDto): string => {
|
||||
let deletedAt = new Date(user.deletedAt ? user.deletedAt : Date.now());
|
||||
deletedAt.setDate(deletedAt.getDate() + 7);
|
||||
return deletedAt.toLocaleString(locale, deleteDateFormat);
|
||||
};
|
||||
</script>
|
||||
|
||||
<table class="text-left w-full my-5">
|
||||
<thead
|
||||
class="border rounded-md mb-4 bg-gray-50 flex text-immich-primary w-full h-12 dark:bg-immich-dark-gray dark:text-immich-dark-primary dark:border-immich-dark-gray"
|
||||
>
|
||||
<tr class="flex w-full place-items-center">
|
||||
<th class="text-center w-1/4 font-medium text-sm">Email</th>
|
||||
<th class="text-center w-1/4 font-medium text-sm">First name</th>
|
||||
<th class="text-center w-1/4 font-medium text-sm">Last name</th>
|
||||
<th class="text-center w-1/4 font-medium text-sm">Action</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody
|
||||
class="overflow-y-auto rounded-md w-full max-h-[320px] block border dark:border-immich-dark-gray"
|
||||
>
|
||||
{#each allUsers as user, i}
|
||||
<tr
|
||||
class={`text-center flex place-items-center w-full h-[80px] dark:text-immich-dark-fg ${
|
||||
isDeleted(user)
|
||||
? 'bg-red-300 dark:bg-red-900'
|
||||
: i % 2 == 0
|
||||
? 'bg-immich-gray dark:bg-immich-dark-gray/75'
|
||||
: 'bg-immich-bg dark:bg-immich-dark-gray/50'
|
||||
}`}
|
||||
>
|
||||
<td class="text-sm px-4 w-1/4 text-ellipsis">{user.email}</td>
|
||||
<td class="text-sm px-4 w-1/4 text-ellipsis">{user.firstName}</td>
|
||||
<td class="text-sm px-4 w-1/4 text-ellipsis">{user.lastName}</td>
|
||||
<td class="text-sm px-4 w-1/4 text-ellipsis">
|
||||
{#if !isDeleted(user)}
|
||||
<button
|
||||
on:click={() => {
|
||||
dispatch('edit-user', { user });
|
||||
}}
|
||||
class="bg-immich-primary dark:bg-immich-dark-primary text-gray-100 dark:text-gray-700 rounded-full p-3 transition-all duration-150 hover:bg-immich-primary/75"
|
||||
><PencilOutline size="16" /></button
|
||||
>
|
||||
<button
|
||||
on:click={() => {
|
||||
dispatch('delete-user', { user });
|
||||
}}
|
||||
class="bg-immich-primary dark:bg-immich-dark-primary text-gray-100 dark:text-gray-700 rounded-full p-3 transition-all duration-150 hover:bg-immich-primary/75"
|
||||
><TrashCanOutline size="16" /></button
|
||||
>
|
||||
{/if}
|
||||
{#if isDeleted(user)}
|
||||
<button
|
||||
on:click={() => {
|
||||
dispatch('restore-user', { user });
|
||||
}}
|
||||
class="bg-immich-primary dark:bg-immich-dark-primary text-gray-100 dark:text-gray-700 rounded-full p-3 transition-all duration-150 hover:bg-immich-primary/75"
|
||||
title={`scheduled removal on ${getDeleteDate(user)}`}
|
||||
><DeleteRestore size="16" /></button
|
||||
>
|
||||
{/if}
|
||||
</td>
|
||||
</tr>
|
||||
{/each}
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
<button on:click={() => dispatch('create-user')} class="immich-btn-primary">Create user</button>
|
||||
@ -1,2 +1,13 @@
|
||||
import { env } from '$env/dynamic/public';
|
||||
export const loginPageMessage: string | undefined = env.PUBLIC_LOGIN_PAGE_MESSAGE;
|
||||
|
||||
export enum AppRoute {
|
||||
ADMIN_USER_MANAGEMENT = '/admin/user-management',
|
||||
ADMIN_SETTINGS = '/admin/settings',
|
||||
ADMIN_STATS = '/admin/server-status',
|
||||
ADMIN_JOBS = '/admin/jobs-status',
|
||||
|
||||
ALBUMS = '/albums',
|
||||
PHOTOS = '/photos',
|
||||
SHARING = '/sharing'
|
||||
}
|
||||
|
||||
@ -1,13 +0,0 @@
|
||||
export enum AdminSideBarSelection {
|
||||
USER_MANAGEMENT = 'User management',
|
||||
JOBS = 'Jobs',
|
||||
SETTINGS = 'Settings',
|
||||
STATS = 'Server Stats'
|
||||
}
|
||||
|
||||
export enum AppSideBarSelection {
|
||||
PHOTOS = 'Photos',
|
||||
EXPLORE = 'Explore',
|
||||
ALBUMS = 'Albums',
|
||||
SHARING = 'Sharing'
|
||||
}
|
||||
@ -1,3 +1,82 @@
|
||||
<script lang="ts">
|
||||
import { page } from '$app/stores';
|
||||
import NavigationBar from '$lib/components/shared-components/navigation-bar.svelte';
|
||||
import SideBarButton from '$lib/components/shared-components/side-bar/side-bar-button.svelte';
|
||||
import AccountMultipleOutline from 'svelte-material-icons/AccountMultipleOutline.svelte';
|
||||
import Sync from 'svelte-material-icons/Sync.svelte';
|
||||
import Cog from 'svelte-material-icons/Cog.svelte';
|
||||
import Server from 'svelte-material-icons/Server.svelte';
|
||||
import StatusBox from '$lib/components/shared-components/status-box.svelte';
|
||||
import { goto } from '$app/navigation';
|
||||
import { AppRoute } from '../../lib/constants';
|
||||
|
||||
const getPageTitle = (routeId: string | null) => {
|
||||
switch (routeId) {
|
||||
case AppRoute.ADMIN_USER_MANAGEMENT:
|
||||
return 'User Management';
|
||||
case AppRoute.ADMIN_SETTINGS:
|
||||
return 'Settings';
|
||||
case AppRoute.ADMIN_JOBS:
|
||||
return 'Jobs';
|
||||
case AppRoute.ADMIN_STATS:
|
||||
return 'Server Stats';
|
||||
default:
|
||||
return '';
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<svelte:head>
|
||||
<title>Administration - Immich</title>
|
||||
</svelte:head>
|
||||
|
||||
<NavigationBar user={$page.data.user} />
|
||||
|
||||
<main>
|
||||
<slot />
|
||||
<section class="grid grid-cols-[250px_auto] pt-[72px] h-screen">
|
||||
<section id="admin-sidebar" class="pt-8 pr-6 flex flex-col gap-1">
|
||||
<SideBarButton
|
||||
title="Users"
|
||||
logo={AccountMultipleOutline}
|
||||
isSelected={$page.route.id === AppRoute.ADMIN_USER_MANAGEMENT}
|
||||
on:selected={() => goto(AppRoute.ADMIN_USER_MANAGEMENT)}
|
||||
/>
|
||||
<SideBarButton
|
||||
title="Jobs"
|
||||
logo={Sync}
|
||||
isSelected={$page.route.id === AppRoute.ADMIN_JOBS}
|
||||
on:selected={() => goto(AppRoute.ADMIN_JOBS)}
|
||||
/>
|
||||
<SideBarButton
|
||||
title="Settings"
|
||||
logo={Cog}
|
||||
isSelected={$page.route.id === AppRoute.ADMIN_SETTINGS}
|
||||
on:selected={() => goto(AppRoute.ADMIN_SETTINGS)}
|
||||
/>
|
||||
<SideBarButton
|
||||
title="Server Stats"
|
||||
logo={Server}
|
||||
isSelected={$page.route.id === AppRoute.ADMIN_STATS}
|
||||
on:selected={() => goto(AppRoute.ADMIN_STATS)}
|
||||
/>
|
||||
<div class="mb-6 mt-auto">
|
||||
<StatusBox />
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="overflow-y-auto ">
|
||||
<div id="setting-title" class="pt-10 fixed w-full z-50 bg-immich-bg dark:bg-immich-dark-bg">
|
||||
<h1 class="text-lg ml-8 mb-4 text-immich-primary dark:text-immich-dark-primary font-medium">
|
||||
{getPageTitle($page.route.id)}
|
||||
</h1>
|
||||
<hr class="dark:border-immich-dark-gray" />
|
||||
</div>
|
||||
|
||||
<section id="setting-content" class="pt-[85px] flex place-content-center">
|
||||
<section class="w-[800px] pt-5">
|
||||
<slot />
|
||||
</section>
|
||||
</section>
|
||||
</section>
|
||||
</section>
|
||||
</main>
|
||||
|
||||
@ -1,249 +0,0 @@
|
||||
<script lang="ts">
|
||||
import { onMount } from 'svelte';
|
||||
|
||||
import { AdminSideBarSelection } from '$lib/models/admin-sidebar-selection';
|
||||
import SideBarButton from '$lib/components/shared-components/side-bar/side-bar-button.svelte';
|
||||
import AccountMultipleOutline from 'svelte-material-icons/AccountMultipleOutline.svelte';
|
||||
import Sync from 'svelte-material-icons/Sync.svelte';
|
||||
import Cog from 'svelte-material-icons/Cog.svelte';
|
||||
import Server from 'svelte-material-icons/Server.svelte';
|
||||
import NavigationBar from '$lib/components/shared-components/navigation-bar.svelte';
|
||||
import UserManagement from '$lib/components/admin-page/user-management.svelte';
|
||||
import FullScreenModal from '$lib/components/shared-components/full-screen-modal.svelte';
|
||||
import CreateUserForm from '$lib/components/forms/create-user-form.svelte';
|
||||
import EditUserForm from '$lib/components/forms/edit-user-form.svelte';
|
||||
import DeleteConfirmDialog from '$lib/components/admin-page/delete-confirm-dialoge.svelte';
|
||||
import StatusBox from '$lib/components/shared-components/status-box.svelte';
|
||||
import type { PageData } from './$types';
|
||||
import { api, ServerStatsResponseDto, UserResponseDto } from '@api';
|
||||
import JobsPanel from '$lib/components/admin-page/jobs/jobs-panel.svelte';
|
||||
import SettingsPanel from '$lib/components/admin-page/settings/settings-panel.svelte';
|
||||
import ServerStatsPanel from '$lib/components/admin-page/server-stats/server-stats-panel.svelte';
|
||||
import RestoreDialoge from '$lib/components/admin-page/restore-dialoge.svelte';
|
||||
|
||||
let selectedAction: AdminSideBarSelection = AdminSideBarSelection.USER_MANAGEMENT;
|
||||
|
||||
export let data: PageData;
|
||||
|
||||
let selectedUser: UserResponseDto;
|
||||
|
||||
let shouldShowEditUserForm = false;
|
||||
let shouldShowCreateUserForm = false;
|
||||
let shouldShowInfoPanel = false;
|
||||
let shouldShowDeleteConfirmDialog = false;
|
||||
let shouldShowRestoreDialog = false;
|
||||
let serverStat: ServerStatsResponseDto;
|
||||
|
||||
const onButtonClicked = (buttonType: CustomEvent) => {
|
||||
selectedAction = buttonType.detail['actionType'] as AdminSideBarSelection;
|
||||
};
|
||||
|
||||
onMount(() => {
|
||||
selectedAction = AdminSideBarSelection.USER_MANAGEMENT;
|
||||
getServerStats();
|
||||
});
|
||||
|
||||
const onUserCreated = async () => {
|
||||
const getAllUsersRes = await api.userApi.getAllUsers(false);
|
||||
data.allUsers = getAllUsersRes.data;
|
||||
shouldShowCreateUserForm = false;
|
||||
};
|
||||
|
||||
const editUserHandler = async (event: CustomEvent) => {
|
||||
const { user } = event.detail;
|
||||
selectedUser = user;
|
||||
shouldShowEditUserForm = true;
|
||||
};
|
||||
|
||||
const onEditUserSuccess = async () => {
|
||||
const getAllUsersRes = await api.userApi.getAllUsers(false);
|
||||
data.allUsers = getAllUsersRes.data;
|
||||
shouldShowEditUserForm = false;
|
||||
};
|
||||
|
||||
const onEditPasswordSuccess = async () => {
|
||||
const getAllUsersRes = await api.userApi.getAllUsers(false);
|
||||
data.allUsers = getAllUsersRes.data;
|
||||
shouldShowEditUserForm = false;
|
||||
shouldShowInfoPanel = true;
|
||||
};
|
||||
|
||||
const deleteUserHandler = async (event: CustomEvent) => {
|
||||
const { user } = event.detail;
|
||||
selectedUser = user;
|
||||
shouldShowDeleteConfirmDialog = true;
|
||||
};
|
||||
|
||||
const onUserDeleteSuccess = async () => {
|
||||
const getAllUsersRes = await api.userApi.getAllUsers(false);
|
||||
data.allUsers = getAllUsersRes.data;
|
||||
shouldShowDeleteConfirmDialog = false;
|
||||
};
|
||||
|
||||
const onUserDeleteFail = async () => {
|
||||
const getAllUsersRes = await api.userApi.getAllUsers(false);
|
||||
data.allUsers = getAllUsersRes.data;
|
||||
shouldShowDeleteConfirmDialog = false;
|
||||
};
|
||||
|
||||
const restoreUserHandler = async (event: CustomEvent) => {
|
||||
const { user } = event.detail;
|
||||
selectedUser = user;
|
||||
shouldShowRestoreDialog = true;
|
||||
};
|
||||
|
||||
const onUserRestoreSuccess = async () => {
|
||||
const getAllUsersRes = await api.userApi.getAllUsers(false);
|
||||
data.allUsers = getAllUsersRes.data;
|
||||
shouldShowRestoreDialog = false;
|
||||
};
|
||||
|
||||
const onUserRestoreFail = async () => {
|
||||
// show fail dialog
|
||||
const getAllUsersRes = await api.userApi.getAllUsers(false);
|
||||
data.allUsers = getAllUsersRes.data;
|
||||
shouldShowRestoreDialog = false;
|
||||
};
|
||||
|
||||
const getServerStats = async () => {
|
||||
try {
|
||||
const res = await api.serverInfoApi.getStats();
|
||||
serverStat = res.data;
|
||||
} catch (e) {
|
||||
console.log(e);
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<svelte:head>
|
||||
<title>Administration - Immich</title>
|
||||
</svelte:head>
|
||||
|
||||
<NavigationBar user={data.user} />
|
||||
|
||||
{#if shouldShowCreateUserForm}
|
||||
<FullScreenModal on:clickOutside={() => (shouldShowCreateUserForm = false)}>
|
||||
<CreateUserForm on:user-created={onUserCreated} />
|
||||
</FullScreenModal>
|
||||
{/if}
|
||||
|
||||
{#if shouldShowEditUserForm}
|
||||
<FullScreenModal on:clickOutside={() => (shouldShowEditUserForm = false)}>
|
||||
<EditUserForm
|
||||
user={selectedUser}
|
||||
on:edit-success={onEditUserSuccess}
|
||||
on:reset-password-success={onEditPasswordSuccess}
|
||||
/>
|
||||
</FullScreenModal>
|
||||
{/if}
|
||||
|
||||
{#if shouldShowDeleteConfirmDialog}
|
||||
<FullScreenModal on:clickOutside={() => (shouldShowDeleteConfirmDialog = false)}>
|
||||
<DeleteConfirmDialog
|
||||
user={selectedUser}
|
||||
on:user-delete-success={onUserDeleteSuccess}
|
||||
on:user-delete-fail={onUserDeleteFail}
|
||||
/>
|
||||
</FullScreenModal>
|
||||
{/if}
|
||||
|
||||
{#if shouldShowRestoreDialog}
|
||||
<FullScreenModal on:clickOutside={() => (shouldShowRestoreDialog = false)}>
|
||||
<RestoreDialoge
|
||||
user={selectedUser}
|
||||
on:user-restore-success={onUserRestoreSuccess}
|
||||
on:user-restore-fail={onUserRestoreFail}
|
||||
/>
|
||||
</FullScreenModal>
|
||||
{/if}
|
||||
|
||||
{#if shouldShowInfoPanel}
|
||||
<FullScreenModal on:clickOutside={() => (shouldShowInfoPanel = false)}>
|
||||
<div class="border bg-white shadow-sm w-[500px] rounded-3xl p-8 text-sm">
|
||||
<h1 class="font-medium text-immich-primary text-lg mb-4">Password reset success</h1>
|
||||
|
||||
<p>
|
||||
The user's password has been reset to the default <code
|
||||
class="font-bold bg-gray-200 px-2 py-1 rounded-md text-immich-primary">password</code
|
||||
>
|
||||
<br />
|
||||
Please inform the user, and they will need to change the password at the next log-on.
|
||||
</p>
|
||||
|
||||
<div class="flex w-full">
|
||||
<button
|
||||
on:click={() => (shouldShowInfoPanel = false)}
|
||||
class="mt-6 bg-immich-primary hover:bg-immich-primary/75 px-6 py-3 text-white rounded-full shadow-md w-full font-medium"
|
||||
>Done
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</FullScreenModal>
|
||||
{/if}
|
||||
|
||||
<section class="grid grid-cols-[250px_auto] relative pt-[72px] h-screen">
|
||||
<section id="admin-sidebar" class="pt-8 pr-6 flex flex-col gap-1">
|
||||
<SideBarButton
|
||||
title="Users"
|
||||
logo={AccountMultipleOutline}
|
||||
actionType={AdminSideBarSelection.USER_MANAGEMENT}
|
||||
isSelected={selectedAction === AdminSideBarSelection.USER_MANAGEMENT}
|
||||
on:selected={onButtonClicked}
|
||||
/>
|
||||
<SideBarButton
|
||||
title="Jobs"
|
||||
logo={Sync}
|
||||
actionType={AdminSideBarSelection.JOBS}
|
||||
isSelected={selectedAction === AdminSideBarSelection.JOBS}
|
||||
on:selected={onButtonClicked}
|
||||
/>
|
||||
<SideBarButton
|
||||
title="Settings"
|
||||
logo={Cog}
|
||||
actionType={AdminSideBarSelection.SETTINGS}
|
||||
isSelected={selectedAction === AdminSideBarSelection.SETTINGS}
|
||||
on:selected={onButtonClicked}
|
||||
/>
|
||||
<SideBarButton
|
||||
title="Server Stats"
|
||||
logo={Server}
|
||||
actionType={AdminSideBarSelection.STATS}
|
||||
isSelected={selectedAction === AdminSideBarSelection.STATS}
|
||||
on:selected={onButtonClicked}
|
||||
/>
|
||||
<div class="mb-6 mt-auto">
|
||||
<StatusBox />
|
||||
</div>
|
||||
</section>
|
||||
<section class="overflow-y-auto relative">
|
||||
<div id="setting-title" class="pt-10 fixed w-full z-50">
|
||||
<h1 class="text-lg ml-8 mb-4 text-immich-primary dark:text-immich-dark-primary font-medium">
|
||||
{selectedAction}
|
||||
</h1>
|
||||
<hr class="dark:border-immich-dark-gray" />
|
||||
</div>
|
||||
|
||||
<section id="setting-content" class="relative pt-[85px] flex place-content-center">
|
||||
<section class="w-[800px] pt-5">
|
||||
{#if selectedAction === AdminSideBarSelection.USER_MANAGEMENT}
|
||||
<UserManagement
|
||||
allUsers={data.allUsers}
|
||||
on:create-user={() => (shouldShowCreateUserForm = true)}
|
||||
on:edit-user={editUserHandler}
|
||||
on:delete-user={deleteUserHandler}
|
||||
on:restore-user={restoreUserHandler}
|
||||
/>
|
||||
{/if}
|
||||
{#if selectedAction === AdminSideBarSelection.JOBS}
|
||||
<JobsPanel />
|
||||
{/if}
|
||||
{#if selectedAction === AdminSideBarSelection.SETTINGS}
|
||||
<SettingsPanel />
|
||||
{/if}
|
||||
{#if selectedAction === AdminSideBarSelection.STATS && serverStat}
|
||||
<ServerStatsPanel stats={serverStat} allUsers={data.allUsers} />
|
||||
{/if}
|
||||
</section>
|
||||
</section>
|
||||
</section>
|
||||
</section>
|
||||
@ -0,0 +1,12 @@
|
||||
import { redirect } from '@sveltejs/kit';
|
||||
import type { PageServerLoad } from './$types';
|
||||
|
||||
export const load: PageServerLoad = async ({ parent }) => {
|
||||
const { user } = await parent();
|
||||
|
||||
if (!user) {
|
||||
throw redirect(302, '/auth/login');
|
||||
} else if (!user.isAdmin) {
|
||||
throw redirect(302, '/photos');
|
||||
}
|
||||
};
|
||||
@ -0,0 +1,11 @@
|
||||
<script>
|
||||
import JobsPanel from '$lib/components/admin-page/jobs/jobs-panel.svelte';
|
||||
</script>
|
||||
|
||||
<svelte:head>
|
||||
<title>Jobs Status - Immich</title>
|
||||
</svelte:head>
|
||||
|
||||
<section>
|
||||
<JobsPanel />
|
||||
</section>
|
||||
@ -0,0 +1,17 @@
|
||||
import { redirect } from '@sveltejs/kit';
|
||||
import { serverApi } from '@api';
|
||||
import type { PageServerLoad } from './$types';
|
||||
|
||||
export const load: PageServerLoad = async ({ parent }) => {
|
||||
const { user } = await parent();
|
||||
|
||||
if (!user) {
|
||||
throw redirect(302, '/auth/login');
|
||||
} else if (!user.isAdmin) {
|
||||
throw redirect(302, '/photos');
|
||||
}
|
||||
|
||||
const { data: allUsers } = await serverApi.userApi.getAllUsers(false);
|
||||
|
||||
return { user, allUsers };
|
||||
};
|
||||
@ -0,0 +1,29 @@
|
||||
<script lang="ts">
|
||||
import ServerStatsPanel from '$lib/components/admin-page/server-stats/server-stats-panel.svelte';
|
||||
import { api, ServerStatsResponseDto } from '@api';
|
||||
import { onMount } from 'svelte';
|
||||
import { page } from '$app/stores';
|
||||
|
||||
let serverStat: ServerStatsResponseDto;
|
||||
|
||||
onMount(() => {
|
||||
getServerStats();
|
||||
});
|
||||
|
||||
const getServerStats = async () => {
|
||||
try {
|
||||
const res = await api.serverInfoApi.getStats();
|
||||
serverStat = res.data;
|
||||
} catch (e) {
|
||||
console.log(e);
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<svelte:head>
|
||||
<title>Jobs Status - Immich</title>
|
||||
</svelte:head>
|
||||
|
||||
{#if $page.data.allUsers && serverStat}
|
||||
<ServerStatsPanel stats={serverStat} allUsers={$page.data.allUsers} />
|
||||
{/if}
|
||||
@ -0,0 +1,14 @@
|
||||
import { redirect } from '@sveltejs/kit';
|
||||
import type { PageServerLoad } from './$types';
|
||||
|
||||
export const load: PageServerLoad = async ({ parent }) => {
|
||||
const { user } = await parent();
|
||||
|
||||
if (!user) {
|
||||
throw redirect(302, '/auth/login');
|
||||
} else if (!user.isAdmin) {
|
||||
throw redirect(302, '/photos');
|
||||
}
|
||||
|
||||
return { user };
|
||||
};
|
||||
@ -0,0 +1,33 @@
|
||||
<script lang="ts">
|
||||
import FFmpegSettings from '$lib/components/admin-page/settings/ffmpeg/ffmpeg-settings.svelte';
|
||||
import OAuthSettings from '$lib/components/admin-page/settings/oauth/oauth-settings.svelte';
|
||||
import SettingAccordion from '$lib/components/admin-page/settings/setting-accordion.svelte';
|
||||
import LoadingSpinner from '$lib/components/shared-components/loading-spinner.svelte';
|
||||
import { api, SystemConfigDto } from '@api';
|
||||
|
||||
let systemConfig: SystemConfigDto;
|
||||
|
||||
const getConfig = async () => {
|
||||
const { data } = await api.systemConfigApi.getConfig();
|
||||
systemConfig = data;
|
||||
|
||||
return data;
|
||||
};
|
||||
</script>
|
||||
|
||||
<section class="">
|
||||
{#await getConfig()}
|
||||
<LoadingSpinner />
|
||||
{:then configs}
|
||||
<SettingAccordion
|
||||
title="FFmpeg Settings"
|
||||
subtitle="Manage the resolution and encoding information of the video files"
|
||||
>
|
||||
<FFmpegSettings ffmpegConfig={configs.ffmpeg} />
|
||||
</SettingAccordion>
|
||||
|
||||
<SettingAccordion title="OAuth Settings" subtitle="Manage the OAuth integration to Immich app">
|
||||
<OAuthSettings oauthConfig={configs.oauth} />
|
||||
</SettingAccordion>
|
||||
{/await}
|
||||
</section>
|
||||
@ -0,0 +1,17 @@
|
||||
import { redirect } from '@sveltejs/kit';
|
||||
import { serverApi } from '@api';
|
||||
import type { PageServerLoad } from './$types';
|
||||
|
||||
export const load: PageServerLoad = async ({ parent }) => {
|
||||
const { user } = await parent();
|
||||
|
||||
if (!user) {
|
||||
throw redirect(302, '/auth/login');
|
||||
} else if (!user.isAdmin) {
|
||||
throw redirect(302, '/photos');
|
||||
}
|
||||
|
||||
const { data: allUsers } = await serverApi.userApi.getAllUsers(false);
|
||||
|
||||
return { user, allUsers };
|
||||
};
|
||||
@ -0,0 +1,232 @@
|
||||
<script lang="ts">
|
||||
import { api, UserResponseDto } from '@api';
|
||||
|
||||
import { onMount } from 'svelte';
|
||||
import PencilOutline from 'svelte-material-icons/PencilOutline.svelte';
|
||||
import TrashCanOutline from 'svelte-material-icons/TrashCanOutline.svelte';
|
||||
import DeleteRestore from 'svelte-material-icons/DeleteRestore.svelte';
|
||||
import FullScreenModal from '$lib/components/shared-components/full-screen-modal.svelte';
|
||||
import CreateUserForm from '$lib/components/forms/create-user-form.svelte';
|
||||
import EditUserForm from '$lib/components/forms/edit-user-form.svelte';
|
||||
import DeleteConfirmDialog from '$lib/components/admin-page/delete-confirm-dialoge.svelte';
|
||||
import RestoreDialogue from '$lib/components/admin-page/restore-dialoge.svelte';
|
||||
import { page } from '$app/stores';
|
||||
|
||||
let allUsers: UserResponseDto[] = [];
|
||||
let shouldShowEditUserForm = false;
|
||||
let shouldShowCreateUserForm = false;
|
||||
let shouldShowInfoPanel = false;
|
||||
let shouldShowDeleteConfirmDialog = false;
|
||||
let shouldShowRestoreDialog = false;
|
||||
let selectedUser: UserResponseDto;
|
||||
|
||||
onMount(() => {
|
||||
allUsers = $page.data.allUsers;
|
||||
console.log('getting all users', allUsers);
|
||||
});
|
||||
|
||||
const isDeleted = (user: UserResponseDto): boolean => {
|
||||
return user.deletedAt != null;
|
||||
};
|
||||
|
||||
const locale = navigator.language;
|
||||
const deleteDateFormat: Intl.DateTimeFormatOptions = {
|
||||
month: 'long',
|
||||
day: 'numeric',
|
||||
year: 'numeric'
|
||||
};
|
||||
|
||||
const getDeleteDate = (user: UserResponseDto): string => {
|
||||
let deletedAt = new Date(user.deletedAt ? user.deletedAt : Date.now());
|
||||
deletedAt.setDate(deletedAt.getDate() + 7);
|
||||
return deletedAt.toLocaleString(locale, deleteDateFormat);
|
||||
};
|
||||
|
||||
const onUserCreated = async () => {
|
||||
const getAllUsersRes = await api.userApi.getAllUsers(false);
|
||||
allUsers = getAllUsersRes.data;
|
||||
shouldShowCreateUserForm = false;
|
||||
};
|
||||
|
||||
const editUserHandler = async (user: UserResponseDto) => {
|
||||
selectedUser = user;
|
||||
shouldShowEditUserForm = true;
|
||||
};
|
||||
|
||||
const onEditUserSuccess = async () => {
|
||||
const getAllUsersRes = await api.userApi.getAllUsers(false);
|
||||
allUsers = getAllUsersRes.data;
|
||||
shouldShowEditUserForm = false;
|
||||
};
|
||||
|
||||
const onEditPasswordSuccess = async () => {
|
||||
const getAllUsersRes = await api.userApi.getAllUsers(false);
|
||||
allUsers = getAllUsersRes.data;
|
||||
shouldShowEditUserForm = false;
|
||||
shouldShowInfoPanel = true;
|
||||
};
|
||||
|
||||
const deleteUserHandler = async (user: UserResponseDto) => {
|
||||
selectedUser = user;
|
||||
shouldShowDeleteConfirmDialog = true;
|
||||
};
|
||||
|
||||
const onUserDeleteSuccess = async () => {
|
||||
const getAllUsersRes = await api.userApi.getAllUsers(false);
|
||||
allUsers = getAllUsersRes.data;
|
||||
shouldShowDeleteConfirmDialog = false;
|
||||
};
|
||||
|
||||
const onUserDeleteFail = async () => {
|
||||
const getAllUsersRes = await api.userApi.getAllUsers(false);
|
||||
allUsers = getAllUsersRes.data;
|
||||
shouldShowDeleteConfirmDialog = false;
|
||||
};
|
||||
|
||||
const restoreUserHandler = async (user: UserResponseDto) => {
|
||||
selectedUser = user;
|
||||
shouldShowRestoreDialog = true;
|
||||
};
|
||||
|
||||
const onUserRestoreSuccess = async () => {
|
||||
const getAllUsersRes = await api.userApi.getAllUsers(false);
|
||||
allUsers = getAllUsersRes.data;
|
||||
shouldShowRestoreDialog = false;
|
||||
};
|
||||
|
||||
const onUserRestoreFail = async () => {
|
||||
// show fail dialog
|
||||
const getAllUsersRes = await api.userApi.getAllUsers(false);
|
||||
allUsers = getAllUsersRes.data;
|
||||
shouldShowRestoreDialog = false;
|
||||
};
|
||||
</script>
|
||||
|
||||
<svelte:head>
|
||||
<title>User Management - Immich</title>
|
||||
</svelte:head>
|
||||
|
||||
<section>
|
||||
{#if shouldShowCreateUserForm}
|
||||
<FullScreenModal on:clickOutside={() => (shouldShowCreateUserForm = false)}>
|
||||
<CreateUserForm on:user-created={onUserCreated} />
|
||||
</FullScreenModal>
|
||||
{/if}
|
||||
|
||||
{#if shouldShowEditUserForm}
|
||||
<FullScreenModal on:clickOutside={() => (shouldShowEditUserForm = false)}>
|
||||
<EditUserForm
|
||||
user={selectedUser}
|
||||
on:edit-success={onEditUserSuccess}
|
||||
on:reset-password-success={onEditPasswordSuccess}
|
||||
/>
|
||||
</FullScreenModal>
|
||||
{/if}
|
||||
|
||||
{#if shouldShowDeleteConfirmDialog}
|
||||
<FullScreenModal on:clickOutside={() => (shouldShowDeleteConfirmDialog = false)}>
|
||||
<DeleteConfirmDialog
|
||||
user={selectedUser}
|
||||
on:user-delete-success={onUserDeleteSuccess}
|
||||
on:user-delete-fail={onUserDeleteFail}
|
||||
/>
|
||||
</FullScreenModal>
|
||||
{/if}
|
||||
|
||||
{#if shouldShowRestoreDialog}
|
||||
<FullScreenModal on:clickOutside={() => (shouldShowRestoreDialog = false)}>
|
||||
<RestoreDialogue
|
||||
user={selectedUser}
|
||||
on:user-restore-success={onUserRestoreSuccess}
|
||||
on:user-restore-fail={onUserRestoreFail}
|
||||
/>
|
||||
</FullScreenModal>
|
||||
{/if}
|
||||
|
||||
{#if shouldShowInfoPanel}
|
||||
<FullScreenModal on:clickOutside={() => (shouldShowInfoPanel = false)}>
|
||||
<div class="border bg-white shadow-sm w-[500px] rounded-3xl p-8 text-sm">
|
||||
<h1 class="font-medium text-immich-primary text-lg mb-4">Password reset success</h1>
|
||||
|
||||
<p>
|
||||
The user's password has been reset to the default <code
|
||||
class="font-bold bg-gray-200 px-2 py-1 rounded-md text-immich-primary">password</code
|
||||
>
|
||||
<br />
|
||||
Please inform the user, and they will need to change the password at the next log-on.
|
||||
</p>
|
||||
|
||||
<div class="flex w-full">
|
||||
<button
|
||||
on:click={() => (shouldShowInfoPanel = false)}
|
||||
class="mt-6 bg-immich-primary hover:bg-immich-primary/75 px-6 py-3 text-white rounded-full shadow-md w-full font-medium"
|
||||
>Done
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</FullScreenModal>
|
||||
{/if}
|
||||
|
||||
<table class="text-left w-full my-5">
|
||||
<thead
|
||||
class="border rounded-md mb-4 bg-gray-50 flex text-immich-primary w-full h-12 dark:bg-immich-dark-gray dark:text-immich-dark-primary dark:border-immich-dark-gray"
|
||||
>
|
||||
<tr class="flex w-full place-items-center">
|
||||
<th class="text-center w-1/4 font-medium text-sm">Email</th>
|
||||
<th class="text-center w-1/4 font-medium text-sm">First name</th>
|
||||
<th class="text-center w-1/4 font-medium text-sm">Last name</th>
|
||||
<th class="text-center w-1/4 font-medium text-sm">Action</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody
|
||||
class="overflow-y-auto rounded-md w-full max-h-[320px] block border dark:border-immich-dark-gray"
|
||||
>
|
||||
{#if allUsers}
|
||||
{#each allUsers as user, i}
|
||||
<tr
|
||||
class={`text-center flex place-items-center w-full h-[80px] dark:text-immich-dark-fg ${
|
||||
isDeleted(user)
|
||||
? 'bg-red-300 dark:bg-red-900'
|
||||
: i % 2 == 0
|
||||
? 'bg-immich-gray dark:bg-immich-dark-gray/75'
|
||||
: 'bg-immich-bg dark:bg-immich-dark-gray/50'
|
||||
}`}
|
||||
>
|
||||
<td class="text-sm px-4 w-1/4 text-ellipsis">{user.email}</td>
|
||||
<td class="text-sm px-4 w-1/4 text-ellipsis">{user.firstName}</td>
|
||||
<td class="text-sm px-4 w-1/4 text-ellipsis">{user.lastName}</td>
|
||||
<td class="text-sm px-4 w-1/4 text-ellipsis">
|
||||
{#if !isDeleted(user)}
|
||||
<button
|
||||
on:click={() => editUserHandler(user)}
|
||||
class="bg-immich-primary dark:bg-immich-dark-primary text-gray-100 dark:text-gray-700 rounded-full p-3 transition-all duration-150 hover:bg-immich-primary/75"
|
||||
>
|
||||
<PencilOutline size="16" />
|
||||
</button>
|
||||
<button
|
||||
on:click={() => deleteUserHandler(user)}
|
||||
class="bg-immich-primary dark:bg-immich-dark-primary text-gray-100 dark:text-gray-700 rounded-full p-3 transition-all duration-150 hover:bg-immich-primary/75"
|
||||
>
|
||||
<TrashCanOutline size="16" />
|
||||
</button>
|
||||
{/if}
|
||||
{#if isDeleted(user)}
|
||||
<button
|
||||
on:click={() => restoreUserHandler(user)}
|
||||
class="bg-immich-primary dark:bg-immich-dark-primary text-gray-100 dark:text-gray-700 rounded-full p-3 transition-all duration-150 hover:bg-immich-primary/75"
|
||||
title={`scheduled removal on ${getDeleteDate(user)}`}
|
||||
>
|
||||
<DeleteRestore size="16" />
|
||||
</button>
|
||||
{/if}
|
||||
</td>
|
||||
</tr>
|
||||
{/each}
|
||||
{/if}
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
<button on:click={() => (shouldShowCreateUserForm = true)} class="immich-btn-primary"
|
||||
>Create user</button
|
||||
>
|
||||
</section>
|
||||
Loading…
Reference in New Issue