<div>
	<h2 mat-dialog-title>
		Add account
	</h2>
	<div mat-dialog-content>
		<form [formGroup]="editForm!" (ngSubmit)="onSubmitClick()">

			<div class="row">
				<div class="col-md-12">
					<div class="text-inside">
						<mat-form-field class="example-full-width">
							<mat-label>Type</mat-label>
							<mat-select formControlName="type">
								<mat-option *ngFor="let type of types | keyvalue" [value]="type.key">
									{{type.key}} ({{type.value}})
								</mat-option>
							</mat-select>
						</mat-form-field>
					</div>
				</div>
			</div>

			<div class="row">
				<div class="col-md-6">
					<div class="text-inside">
						<mat-form-field class="example-full-width">
							<mat-label>Name</mat-label>
							<input matInput value={{account.name}} formControlName="name">
						</mat-form-field>
					</div>
				</div>
				<div class="col-md-6">
					<div class="text-inside">
						<mat-form-field class="example-full-width">
							<mat-label>Currency</mat-label>
							<mat-select formControlName="currencyId">
								<mat-option *ngFor="let currency of currencies" [value]="currency.code">
									{{currency.code}} ({{currency.name}})
								</mat-option>
							</mat-select>
						</mat-form-field>
					</div>
				</div>
			</div>
			<div class="row">
				<div class="col-md-6">
					<div class="text-inside">
						<mat-form-field class="example-full-width">
							<mat-label>Category</mat-label>
							<mat-select formControlName="categoryId">
								<mat-option *ngFor="let category of categories" [value]="category.id">
									{{category.name}}
								</mat-option>
							</mat-select>
						</mat-form-field>
					</div>
				</div>
				<div class="col-md-6">
					<div class="text-inside">
						<mat-form-field class="example-full-width">
							<mat-label>User</mat-label>
							<input matInput value={{username}} readonly>
						</mat-form-field>
					</div>
				</div>
			</div>
			<mat-dialog-actions class="mat-dialog-actions">
				<div class="mat-dialog-left">
					<div class="alert alert-danger mat-dialog-error" *ngIf="errorMessage">
						{{errorMessage}}
					</div>
				</div>
				<div class="mat-dialog-right">
					<div class="button-bottom">
						<button type="button" mat-button (click)="closeDialog()">Cancel</button>
						<button class="btn-space" mat-raised-button color="primary">Save</button>
					</div>
				</div>
			</mat-dialog-actions>

		</form>
	</div>
</div>
