codecharta-visualization 1.119.0 → 1.120.0

package/app/codeCharta/ui/customConfigs/customConfigList/customConfigItemGroup/customConfigDescription/applyCustomConfigButton.component.ts

@@ -1,26 +0,0 @@
-import { Component, Input, ViewEncapsulation } from "@angular/core"
-import { CustomConfigItem } from "../../../customConfigs.component"
-import { CustomConfigHelper } from "../../../../../util/customConfigHelper"
-import { ThreeCameraService } from "../../../../codeMap/threeViewer/threeCamera.service"
-import { ThreeOrbitControlsService } from "../../../../codeMap/threeViewer/threeOrbitControls.service"
-import { Store } from "@ngrx/store"
-
-@Component({
-	selector: "cc-apply-custom-config-button",
-	templateUrl: "./applyCustomConfigButton.component.html",
-	styleUrls: ["./applyCustomConfigButton.component.scss"],
-	encapsulation: ViewEncapsulation.None
-})
-export class ApplyCustomConfigButtonComponent {
-	@Input() customConfigItem: CustomConfigItem
-
-	constructor(
-		private store: Store,
-		private threeCameraService: ThreeCameraService,
-		private threeOrbitControlsService: ThreeOrbitControlsService
-	) {}
-
-	applyCustomConfig() {
-		CustomConfigHelper.applyCustomConfig(this.customConfigItem.id, this.store, this.threeCameraService, this.threeOrbitControlsService)
-	}
-}

package/app/codeCharta/ui/customConfigs/customConfigList/customConfigItemGroup/customConfigDescription/applyCustomConfigButton.spec.ts

@@ -1,76 +0,0 @@
-import { TestBed } from "@angular/core/testing"
-import { render, screen } from "@testing-library/angular"
-import userEvent from "@testing-library/user-event"
-import { expect } from "@jest/globals"
-import { ApplyCustomConfigButtonComponent } from "./applyCustomConfigButton.component"
-import { CustomConfigsModule } from "../../../customConfigs.module"
-import { ThreeCameraService } from "../../../../codeMap/threeViewer/threeCamera.service"
-import { ThreeOrbitControlsService } from "../../../../codeMap/threeViewer/threeOrbitControls.service"
-import { CUSTOM_CONFIG_ITEM_GROUPS } from "../../../../../util/dataMocks"
-import { CustomConfigHelper } from "../../../../../util/customConfigHelper"
-import { provideMockStore } from "@ngrx/store/testing"
-import { State } from "@ngrx/store"
-import { defaultState } from "../../../../../state/store/state.manager"
-
-describe("applyCustomConfigButtonComponent", () => {
-	beforeEach(() => {
-		TestBed.configureTestingModule({
-			imports: [CustomConfigsModule],
-			providers: [
-				{ provide: ThreeCameraService, useValue: {} },
-				{ provide: ThreeOrbitControlsService, useValue: {} },
-				provideMockStore(),
-				{ provide: State, useValue: { getValue: () => defaultState } }
-			]
-		})
-	})
-
-	it("should apply a custom Config and show all relevant information belonging to the config", async () => {
-		CustomConfigHelper.applyCustomConfig = jest.fn()
-		const customConfigItem = CUSTOM_CONFIG_ITEM_GROUPS.get("File_B_File_C_STANDARD").customConfigItems[0]
-		const { container } = await render(ApplyCustomConfigButtonComponent, {
-			excludeComponentDeclaration: true,
-			componentProperties: { customConfigItem }
-		})
-
-		const colorSwatchElements = container.getElementsByClassName("color-swatch")
-		expect(colorSwatchElements.length).toBe(4)
-		expect(getComputedStyle(colorSwatchElements[0]).backgroundColor).toBe("rgb(105, 174, 64)")
-		expect(getComputedStyle(colorSwatchElements[1]).backgroundColor).toBe("rgb(221, 204, 0)")
-		expect(getComputedStyle(colorSwatchElements[2]).backgroundColor).toBe("rgb(130, 14, 14)")
-		expect(getComputedStyle(colorSwatchElements[3]).backgroundColor).toBe("rgb(235, 131, 25)")
-
-		expect(screen.getByText("rloc")).not.toBeNull()
-		expect(screen.getByText("mcc")).not.toBeNull()
-		expect(screen.getByText("functions")).not.toBeNull()
-		expect(screen.getByText("avgCommits")).not.toBeNull()
-
-		const applyCustomConfigButton = screen.getByRole("button") as HTMLButtonElement
-		await userEvent.click(applyCustomConfigButton)
-
-		expect(applyCustomConfigButton.disabled).toBe(false)
-		expect(CustomConfigHelper.applyCustomConfig).toHaveBeenCalledTimes(1)
-	})
-
-	it("should not apply a custom Config when it's not applicable but show all relevant information belonging to the config", async () => {
-		CustomConfigHelper.applyCustomConfig = jest.fn()
-		const customConfigItem = CUSTOM_CONFIG_ITEM_GROUPS.get("File_B_File_C_STANDARD").customConfigItems[0]
-		customConfigItem.isApplicable = false
-		await render(ApplyCustomConfigButtonComponent, {
-			excludeComponentDeclaration: true,
-			componentProperties: { customConfigItem }
-		})
-		const applyCustomConfigButton = screen.getByRole("button") as HTMLButtonElement
-
-		expect(getComputedStyle(applyCustomConfigButton).color).toBe("rgb(204, 204, 204)")
-		expect(screen.getByText("rloc")).not.toBeNull()
-		expect(screen.getByText("mcc")).not.toBeNull()
-		expect(screen.getByText("functions")).not.toBeNull()
-		expect(screen.getByText("avgCommits")).not.toBeNull()
-
-		await userEvent.click(applyCustomConfigButton)
-
-		expect(applyCustomConfigButton.disabled).toBe(true)
-		expect(CustomConfigHelper.applyCustomConfig).not.toHaveBeenCalled()
-	})
-})

package/app/codeCharta/ui/customConfigs/customConfigList/customConfigItemGroup/customConfigDescription/customConfigColorSchemaBySelectionMode.pipe.spec.ts

@@ -1,36 +0,0 @@
-import { CustomConfigMapSelectionMode } from "../../../../../model/customConfig/customConfig.api.model"
-import { CustomConfigItem } from "../../../customConfigs.component"
-import { CustomConfigColorSchemaBySelectionMode } from "./customConfigColorSchemaBySelectionMode.pipe"
-
-describe("customConfigColorSchemaBySelectionMode", () => {
-	it("should return 'positive', 'neutral' and 'negative' color values when config was made in MULTIPLE mode", () => {
-		const customConfigItem = {
-			mapSelectionMode: CustomConfigMapSelectionMode.MULTIPLE,
-			mapColors: {
-				positive: "green",
-				neutral: "yellow",
-				negative: "red",
-				selected: "orange",
-				positiveDelta: "darkGreen",
-				negativeDelta: "darkRed"
-			}
-		} as CustomConfigItem
-		expect(new CustomConfigColorSchemaBySelectionMode().transform(customConfigItem)).toEqual(["green", "yellow", "red", "orange"])
-	})
-
-	it("should return 'positiveDelta' and 'negativeDelta' color values when config was made in DELTA mode", () => {
-		const customConfigItem = {
-			mapSelectionMode: CustomConfigMapSelectionMode.DELTA,
-			mapColors: {
-				positive: "green",
-				neutral: "yellow",
-				negative: "red",
-				selected: "orange",
-				positiveDelta: "darkGreen",
-				negativeDelta: "darkRed"
-			}
-		} as CustomConfigItem
-
-		expect(new CustomConfigColorSchemaBySelectionMode().transform(customConfigItem)).toEqual(["darkGreen", "darkRed", "orange"])
-	})
-})

package/app/codeCharta/ui/customConfigs/customConfigList/customConfigItemGroup/customConfigDescription/customConfigColorSchemaBySelectionMode.pipe.ts

@@ -1,13 +0,0 @@
-import { Pipe, PipeTransform } from "@angular/core"
-import { CustomConfigItem } from "../../../customConfigs.component"
-import { CustomConfigMapSelectionMode } from "../../../../../model/customConfig/customConfig.api.model"
-
-@Pipe({ name: "customConfigColorSchemaBySelectionMode" })
-export class CustomConfigColorSchemaBySelectionMode implements PipeTransform {
-	transform(customConfig: CustomConfigItem): string[] {
-		const { mapColors, mapSelectionMode } = customConfig
-		return mapSelectionMode === CustomConfigMapSelectionMode.MULTIPLE
-			? [mapColors.positive, mapColors.neutral, mapColors.negative, mapColors.selected]
-			: [mapColors.positiveDelta, mapColors.negativeDelta, mapColors.selected]
-	}
-}

package/app/codeCharta/ui/customConfigs/customConfigList/customConfigItemGroup/customConfigItemGroup.component.html

@@ -1,42 +0,0 @@
-<mat-expansion-panel
-	[expanded]="isExpanded"
-	(opened)="isExpanded = true"
-	(closed)="isExpanded = false"
-	*ngFor="let customConfigItemGroup of customConfigItemGroups | keyvalue"
->
-	<mat-expansion-panel-header>
-		<mat-panel-title class="custom-config-item-group-title">
-			Custom View(s) in
-			<strong> {{ customConfigItemGroup.value.mapSelectionMode | titlecase }} </strong>
-			mode for
-			{{ customConfigItemGroup.value.mapNames }}
-		</mat-panel-title>
-	</mat-expansion-panel-header>
-	<mat-list *ngFor="let customConfig of customConfigItemGroup.value.customConfigItems">
-		<mat-list-item title="{{ customConfig | customConfig2ApplicableMessage }}">
-			<div class="metrics-box">
-				<p class="config-item-name" title="{{ customConfig.name }}">
-					<strong>
-						<span (click)="applyCustomConfig(customConfig.id)" mat-dialog-close>
-							{{ customConfig.name | truncateText: 75 }}
-						</span>
-					</strong>
-				</p>
-			</div>
-			<div class="custom-config-note">
-				<p class="custom-config-note-content">
-					<span (click)="applyCustomConfig(customConfig.id)" mat-dialog-close>
-						{{ customConfig.note ? (customConfig.note | truncateText: 95) : "Add Note" }}
-					</span>
-				</p>
-				<cc-custom-config-note-dialog-button [customConfigItem]="customConfig"></cc-custom-config-note-dialog-button>
-			</div>
-			<div class="custom-config-action-buttons">
-				<cc-apply-custom-config-button [customConfigItem]="customConfig"></cc-apply-custom-config-button>
-				<button class="remove-button" title="Remove Custom View" (click)="removeCustomConfig(customConfig.id)">
-					<i class="fa fa-trash"></i>
-				</button>
-			</div>
-		</mat-list-item>
-	</mat-list>
-</mat-expansion-panel>

package/app/codeCharta/ui/customConfigs/customConfigList/customConfigItemGroup/customConfigItemGroup.component.scss

@@ -1,38 +0,0 @@
-@use "../../../../../material/theme";
-
-cc-custom-config-item-group {
-	.custom-config-item-group-title {
-		color: theme.$cc-font-color;
-		display: inline-block;
-	}
-
-	div {
-		.metrics-box {
-			margin-top: 10px;
-		}
-
-		.custom-config-note {
-			display: flex;
-			flex-wrap: wrap;
-			align-items: center;
-			margin-top: 5px;
-		}
-
-		.custom-config-action-buttons {
-			display: flex;
-			align-items: center;
-			margin-bottom: 5px;
-		}
-	}
-
-	p {
-		font-size: 15px;
-		margin: 0;
-		white-space: pre-line;
-
-		&.custom-config-note-content {
-			margin-right: 7px;
-			font-size: 13px;
-		}
-	}
-}

package/app/codeCharta/ui/customConfigs/customConfigList/customConfigItemGroup/customConfigItemGroup.component.spec.ts

@@ -1,148 +0,0 @@
-import { TestBed } from "@angular/core/testing"
-import { CustomConfigsModule } from "../../customConfigs.module"
-import { render, screen } from "@testing-library/angular"
-import { CustomConfigItemGroupComponent } from "./customConfigItemGroup.component"
-import { CUSTOM_CONFIG_ITEM_GROUPS } from "../../../../util/dataMocks"
-import { CustomConfigHelper } from "../../../../util/customConfigHelper"
-import { ThreeCameraService } from "../../../codeMap/threeViewer/threeCamera.service"
-import { ThreeOrbitControlsService } from "../../../codeMap/threeViewer/threeOrbitControls.service"
-import userEvent from "@testing-library/user-event"
-import { expect } from "@jest/globals"
-import { CustomConfigMapSelectionMode } from "../../../../model/customConfig/customConfig.api.model"
-import { visibleFilesBySelectionModeSelector } from "../../visibleFilesBySelectionMode.selector"
-import { MatDialog, MatDialogRef } from "@angular/material/dialog"
-import { MockStore, provideMockStore } from "@ngrx/store/testing"
-import { State } from "@ngrx/store"
-import { defaultState } from "../../../../state/store/state.manager"
-
-describe("customConfigItemGroupComponent", () => {
-	let mockedDialog = { open: jest.fn() }
-	let mockedDialogReference = { close: jest.fn() }
-
-	beforeEach(() => {
-		mockedDialog = { open: jest.fn() }
-		mockedDialogReference = { close: jest.fn() }
-
-		TestBed.configureTestingModule({
-			imports: [CustomConfigsModule],
-			providers: [
-				{ provide: MatDialogRef, useValue: mockedDialogReference },
-				{ provide: MatDialog, useValue: mockedDialog },
-				{ provide: ThreeCameraService, useValue: {} },
-				{ provide: ThreeOrbitControlsService, useValue: {} },
-				provideMockStore({
-					selectors: [
-						{
-							selector: visibleFilesBySelectionModeSelector,
-							value: {
-								mapSelectionMode: CustomConfigMapSelectionMode.MULTIPLE,
-								assignedMaps: new Map([
-									["md5_fileB", "fileB"],
-									["md5_fileC", "fileC"]
-								])
-							}
-						}
-					]
-				}),
-				{ provide: State, useValue: { getValue: () => defaultState } }
-			]
-		})
-	})
-
-	it("should apply a custom Config and close custom config dialog", async () => {
-		CustomConfigHelper.applyCustomConfig = jest.fn()
-		const customConfigItemGroups = new Map([["File_B_File_C_STANDARD", CUSTOM_CONFIG_ITEM_GROUPS.get("File_B_File_C_STANDARD")]])
-		await render(CustomConfigItemGroupComponent, {
-			excludeComponentDeclaration: true,
-			componentProperties: { customConfigItemGroups }
-		})
-		const applyCustomConfigButton = screen.getAllByText("mcc")[0].closest("button")
-		await userEvent.click(applyCustomConfigButton)
-
-		expect(applyCustomConfigButton.disabled).toBe(false)
-		expect(CustomConfigHelper.applyCustomConfig).toHaveBeenCalledTimes(1)
-		expect(mockedDialogReference.close).toHaveBeenCalledTimes(1)
-	})
-
-	it("should remove a custom Config and not close custom config dialog", async () => {
-		CustomConfigHelper.deleteCustomConfig = jest.fn()
-		const customConfigItemGroups = new Map([["File_B_File_C_STANDARD", CUSTOM_CONFIG_ITEM_GROUPS.get("File_B_File_C_STANDARD")]])
-		await render(CustomConfigItemGroupComponent, {
-			excludeComponentDeclaration: true,
-			componentProperties: { customConfigItemGroups }
-		})
-
-		await userEvent.click(screen.getAllByTitle("Remove Custom View")[0])
-
-		expect(CustomConfigHelper.deleteCustomConfig).toHaveBeenCalledTimes(1)
-		expect(CustomConfigHelper.deleteCustomConfig).toHaveBeenCalledWith("File_B_File_C_STANDARD_Sample_Map View #1")
-		expect(mockedDialogReference.close).toHaveBeenCalledTimes(0)
-	})
-
-	it("should apply a custom config and close custom config dialog when clicking on config name", async () => {
-		const customConfigItemGroups = new Map([["File_B_File_C_STANDARD", CUSTOM_CONFIG_ITEM_GROUPS.get("File_B_File_C_STANDARD")]])
-		await render(CustomConfigItemGroupComponent, {
-			excludeComponentDeclaration: true,
-			componentProperties: { customConfigItemGroups }
-		})
-
-		CustomConfigHelper.applyCustomConfig = jest.fn()
-		const applyCustomConfigButton = screen.getByText("SampleMap View #1").closest("span") as HTMLElement
-
-		await userEvent.click(applyCustomConfigButton)
-
-		expect(CustomConfigHelper.applyCustomConfig).toHaveBeenCalledTimes(1)
-		expect(mockedDialogReference.close).toHaveBeenCalledTimes(1)
-	})
-
-	it("should show tooltip with missing maps and correct selection mode if selected custom config is not fully applicable", async () => {
-		const customConfigItemGroups = new Map([["File_B_File_C_STANDARD", CUSTOM_CONFIG_ITEM_GROUPS.get("File_B_File_C_STANDARD")]])
-		const { rerender } = await render(CustomConfigItemGroupComponent, {
-			excludeComponentDeclaration: true,
-			componentProperties: { customConfigItemGroups }
-		})
-		const store = TestBed.inject(MockStore)
-		store.overrideSelector(visibleFilesBySelectionModeSelector, {
-			mapSelectionMode: CustomConfigMapSelectionMode.DELTA,
-			assignedMaps: new Map([["md5_fileB", "fileB"]])
-		})
-		store.refreshState()
-		await rerender({ componentProperties: { customConfigItemGroups } })
-
-		const applyCustomConfigButton = screen.getAllByText("mcc")[0].closest("button")
-
-		expect(
-			screen.getAllByTitle(
-				"This view is partially applicable. To complete your view, please switch to the STANDARD mode and select the following map(s): fileC."
-			).length
-		).toBe(2)
-		expect(getComputedStyle(applyCustomConfigButton).color).toBe("rgb(204, 204, 204)")
-	})
-
-	it("should not be clickable for non-applicable custom configs, but can still change notes of custom configs", async () => {
-		CustomConfigHelper.applyCustomConfig = jest.fn()
-		CustomConfigHelper.applyCustomConfig = jest.fn()
-		CUSTOM_CONFIG_ITEM_GROUPS.get("File_B_File_C_STANDARD").hasApplicableItems = false
-		CUSTOM_CONFIG_ITEM_GROUPS.get("File_B_File_C_STANDARD").customConfigItems[0].isApplicable = false
-		CUSTOM_CONFIG_ITEM_GROUPS.get("File_B_File_C_STANDARD").customConfigItems[1].isApplicable = false
-		const customConfigItemGroups = new Map([["File_B_File_C_STANDARD", CUSTOM_CONFIG_ITEM_GROUPS.get("File_B_File_C_STANDARD")]])
-		const { rerender } = await render(CustomConfigItemGroupComponent, {
-			excludeComponentDeclaration: true,
-			componentProperties: { customConfigItemGroups }
-		})
-		const store = TestBed.inject(MockStore)
-		store.overrideSelector(visibleFilesBySelectionModeSelector, {
-			mapSelectionMode: CustomConfigMapSelectionMode.DELTA,
-			assignedMaps: new Map([["md5_fileA", "fileA"]])
-		})
-		store.refreshState()
-		await rerender({ componentProperties: { customConfigItemGroups } })
-
-		const editNoteArea = screen.getAllByTitle("Edit/View Note")[0] as HTMLButtonElement
-		const applyCustomConfigButton = screen.getAllByText("mcc")[0].closest("button") as HTMLButtonElement
-
-		expect(applyCustomConfigButton.disabled).toBe(true)
-		expect(editNoteArea.disabled).toBe(false)
-		expect(getComputedStyle(applyCustomConfigButton).color).toBe("rgb(204, 204, 204)")
-	})
-})

package/app/codeCharta/ui/customConfigs/customConfigList/customConfigItemGroup/customConfigItemGroup.component.ts

@@ -1,31 +0,0 @@
-import { Component, Input, ViewEncapsulation } from "@angular/core"
-import { CustomConfigHelper } from "../../../../util/customConfigHelper"
-import { CustomConfigItemGroup } from "../../customConfigs.component"
-import { ThreeCameraService } from "../../../codeMap/threeViewer/threeCamera.service"
-import { ThreeOrbitControlsService } from "../../../codeMap/threeViewer/threeOrbitControls.service"
-import { Store } from "@ngrx/store"
-
-@Component({
-	selector: "cc-custom-config-item-group",
-	templateUrl: "./customConfigItemGroup.component.html",
-	styleUrls: ["./customConfigItemGroup.component.scss"],
-	encapsulation: ViewEncapsulation.None
-})
-export class CustomConfigItemGroupComponent {
-	@Input() customConfigItemGroups: Map<string, CustomConfigItemGroup>
-	isExpanded = false
-
-	constructor(
-		private store: Store,
-		private threeCameraService: ThreeCameraService,
-		private threeOrbitControlsService: ThreeOrbitControlsService
-	) {}
-
-	removeCustomConfig(configId: string) {
-		CustomConfigHelper.deleteCustomConfig(configId)
-	}
-
-	applyCustomConfig(configId: string) {
-		CustomConfigHelper.applyCustomConfig(configId, this.store, this.threeCameraService, this.threeOrbitControlsService)
-	}
-}

package/app/codeCharta/ui/customConfigs/customConfigList/customConfigItemGroup/getMissingCustomConfigModeAndMaps.spec.ts

@@ -1,50 +0,0 @@
-import { getMissingCustomConfigModeAndMaps } from "./getMissingCustomConfigModeAndMaps"
-import { CustomConfigMapSelectionMode } from "../../../../model/customConfig/customConfig.api.model"
-import { CustomConfigItem } from "../../customConfigs.component"
-import { expect } from "@jest/globals"
-import { visibleFilesBySelectionModeSelector } from "../../visibleFilesBySelectionMode.selector"
-import { defaultState } from "../../../../state/store/state.manager"
-
-jest.mock("../../visibleFilesBySelectionMode.selector", () => ({
-	visibleFilesBySelectionModeSelector: jest.fn()
-}))
-const mockedVisibleFilesBySelectionModeSelector = jest.mocked(visibleFilesBySelectionModeSelector)
-
-describe("getMissingCustomConfigModeAndMaps", () => {
-	const customConfigItem = {
-		assignedMaps: new Map([
-			["checksum1", "file1"],
-			["checksum2", "file2"]
-		]),
-		mapSelectionMode: CustomConfigMapSelectionMode.MULTIPLE
-	} as CustomConfigItem
-
-	it("should return empty values when selected maps and map selection mode are the same as the custom config", () => {
-		mockedVisibleFilesBySelectionModeSelector.mockImplementationOnce(() => {
-			return {
-				mapSelectionMode: CustomConfigMapSelectionMode.MULTIPLE,
-				assignedMaps: new Map([
-					["checksum1", "file1"],
-					["checksum2", "file2"]
-				])
-			}
-		})
-
-		const missingModeAndMaps = getMissingCustomConfigModeAndMaps(customConfigItem, defaultState)
-
-		expect(missingModeAndMaps).toEqual({ mapSelectionMode: "", mapNames: [] })
-	})
-
-	it("should return missing maps and mode when the values currently selected differ from the custom config", () => {
-		mockedVisibleFilesBySelectionModeSelector.mockImplementationOnce(() => {
-			return {
-				mapSelectionMode: CustomConfigMapSelectionMode.DELTA,
-				assignedMaps: new Map([["checksum2", "file2"]])
-			}
-		})
-
-		const missingModeAndMaps = getMissingCustomConfigModeAndMaps(customConfigItem, defaultState)
-
-		expect(missingModeAndMaps).toEqual({ mapSelectionMode: "STANDARD", mapNames: ["file1"] })
-	})
-})

package/app/codeCharta/ui/customConfigs/customConfigList/customConfigItemGroup/getMissingCustomConfigModeAndMaps.ts

@@ -1,24 +0,0 @@
-import { CcState } from "../../../../codeCharta.model"
-import { CustomConfigItem } from "../../customConfigs.component"
-import { visibleFilesBySelectionModeSelector } from "../../visibleFilesBySelectionMode.selector"
-
-type MissingCustomConfigsProperties = {
-	mapSelectionMode: string
-	mapNames: string[]
-}
-
-export function getMissingCustomConfigModeAndMaps(configItem: CustomConfigItem, state: CcState): MissingCustomConfigsProperties {
-	const { mapSelectionMode, assignedMaps } = visibleFilesBySelectionModeSelector(state)
-	const mapNames = []
-
-	for (const checksum of configItem.assignedMaps.keys()) {
-		if (!assignedMaps.has(checksum)) {
-			mapNames.push(configItem.assignedMaps.get(checksum))
-		}
-	}
-
-	return {
-		mapSelectionMode: configItem.mapSelectionMode !== mapSelectionMode ? configItem.mapSelectionMode : "",
-		mapNames
-	}
-}

package/app/codeCharta/ui/customConfigs/customConfigList/customConfigList.component.html

@@ -1,41 +0,0 @@
-<mat-toolbar color="primary"
-	>Custom Views
-	<div class="row">
-		<div class="action-buttons">
-			<cc-upload-custom-config-button></cc-upload-custom-config-button>
-			<cc-download-custom-configs-button></cc-download-custom-configs-button>
-			<cc-add-custom-config-button class="custom-configs-button-in-custom-views"></cc-add-custom-config-button>
-		</div></div
-></mat-toolbar>
-
-<mat-dialog-content class="content" *ngIf="customConfigService.customConfigItemGroups$ | async; let dropDownCustomConfigItemGroups">
-	<p class="custom-config-documentation-hint">
-		Custom Views allow you to save and upload your individual configurations for certain maps. Find out more about Custom Views in the
-		<a href="https://maibornwolff.github.io/codecharta/docs/custom-view/" target="_blank" rel="noopener noreferrer">documentation</a>.
-	</p>
-	<mat-divider></mat-divider>
-	<div
-		class="no-custom-configs-box"
-		*ngIf="dropDownCustomConfigItemGroups.applicableItems.size === 0 && dropDownCustomConfigItemGroups.nonApplicableItems.size === 0"
-	>
-		It is time to add your first Custom View!
-	</div>
-	<mat-accordion class="custom-config-container" [multi]="true">
-		<cc-custom-config-item-group
-			[customConfigItemGroups]="dropDownCustomConfigItemGroups.applicableItems"
-		></cc-custom-config-item-group>
-		<cc-custom-config-item-group
-			*ngIf="!isCollapsed"
-			class="non-applicable-configs-group"
-			[customConfigItemGroups]="dropDownCustomConfigItemGroups.nonApplicableItems"
-		></cc-custom-config-item-group>
-		<button
-			class="toggle-non-applicable-configs-button"
-			*ngIf="dropDownCustomConfigItemGroups.nonApplicableItems.size > 0"
-			(click)="toggleNonApplicableCustomConfigsList()"
-		>
-			{{ isCollapsed ? "Show non-applicable Custom Views" : "Hide non-applicable Custom Views" }}
-			<i [ngClass]="isCollapsed ? 'fa fa-angle-down' : 'fa fa-angle-up'"></i>
-		</button>
-	</mat-accordion>
-</mat-dialog-content>

package/app/codeCharta/ui/customConfigs/customConfigList/customConfigList.component.scss

@@ -1,122 +0,0 @@
-@use "../../../../material/theme";
-
-.cc-custom-config-list {
-	width: 850px;
-
-	.mat-mdc-dialog-content {
-		padding: 16px;
-		max-height: 90vh;
-	}
-
-	.row {
-		display: flex;
-		justify-content: space-between;
-		align-items: center;
-		margin-left: auto;
-	}
-
-	.custom-config-documentation-hint {
-		margin: 10px 0 20px 0;
-		font-size: 1.4em;
-		line-height: 1.4em;
-		color: theme.$cc-font-color;
-	}
-
-	.action-buttons button {
-		margin: 0 3px;
-		min-width: 12%;
-		height: 48px;
-		width: 48px;
-		border-radius: 100%;
-		line-height: 48px;
-		background-color: #ffffff;
-		color: theme.$cc-primary-color;
-
-		&:disabled,
-		&[disabled] {
-			background-color: #e6e6e6;
-			color: theme.$cc-disabled-color;
-		}
-
-		i.fa {
-			font-size: 12px;
-			margin-left: 0;
-		}
-	}
-
-	.no-custom-configs-box {
-		text-align: center;
-		padding: 50px 0;
-	}
-
-	cc-custom-config-item-group {
-		.mat-expansion-panel-spacing {
-			margin: 0;
-		}
-
-		.mat-expansion-panel-body {
-			padding: 0 16px;
-		}
-		.mat-expansion-panel-header:not([aria-disabled="true"]) {
-			border-bottom: 1px solid black;
-			padding: 15px 2px;
-		}
-
-		.mat-expansion-panel:not([class*="mat-elevation-z"]) {
-			box-shadow: none;
-		}
-
-		&.non-applicable-group {
-			.mat-expansion-panel-header-title {
-				color: rgba(0, 0, 0, 0.3);
-			}
-		}
-
-		.mdc-list-item__content {
-			width: 100%;
-			border-bottom: 1px solid #000000;
-			padding: 0 5px;
-
-			.mdc-list-item__primary-text {
-				display: flex;
-				flex-direction: column;
-				width: 100%;
-			}
-
-			&:hover {
-				background-color: rgba(0, 0, 0, 0.04);
-			}
-
-			button {
-				background-color: transparent;
-
-				&.remove-button,
-				&.custom-config-note-dialog-button {
-					font-size: 16px;
-					padding: 8px 10px;
-					margin: 0px;
-
-					&:hover {
-						background-color: rgba(0, 0, 0, 0.05);
-						color: theme.$cc-primary-color;
-						border-radius: 50%;
-					}
-				}
-			}
-		}
-	}
-
-	.toggle-non-applicable-configs-button {
-		width: 100%;
-		height: 30px;
-		margin: 5px 0;
-	}
-
-	.mat-mdc-list-base {
-		padding: 0;
-	}
-
-	.mat-mdc-list-item {
-		height: max-content;
-	}
-}