kamu-web-ui/src/app/dataset-view/dataset-view-menu/dataset-view-menu.component.html at b2c408b6e86df28293b69d4c3f57bf5f4a26e9f8 · kamu-data/kamu-web-ui · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
<div
    class="search-header-container-block"
    [style]="isMinimizeSearchAdditionalButtons ? 'grid-template-columns: 1fr;' : ''"
    id="container-dataset-tabs"
    #datasetViewMenu
>
    <div class="dataset-view-type-toggle-group">
        <mat-button-toggle-group name="datasetViewType" class="mat-button-toggle-group" aria-label="Dataset View Type">
            <mat-button-toggle
                data-test-id="navigateToOverview"
                [class.active-link]="isDatasetViewTypeOverview"
                value="overview"
            >
                <a [routerLink]="[datasetLink]" class="menu-link">
                    <div class="d-flex align-items-center">
                        <mat-icon class="fs-4 d-block me-1">visibility</mat-icon>
                        <span class="d-block">Overview</span>
                    </div>
                </a>
            </mat-button-toggle>
            <mat-button-toggle data-test-id="navigateToData" [class.active-link]="isDatasetViewTypeData" value="data">
                <a [routerLink]="[datasetLink]" [queryParams]="{ tab: DatasetViewTypeEnum.Data }" class="menu-link">
                    <div class="d-flex align-items-center">
                        <mat-icon class="fs-4 d-block me-1">dataset</mat-icon>
                        <span class="d-block">Data</span>
                    </div>
                </a>
            </mat-button-toggle>
            <mat-button-toggle
                data-test-id="navigateToMetadata"
                [class.active-link]="isDatasetViewTypeMetadata"
                value="metadata"
            >
                <a [routerLink]="[datasetLink]" [queryParams]="{ tab: DatasetViewTypeEnum.Metadata }" class="menu-link">
                    <div class="d-flex align-items-center">
                        <mat-icon class="fs-4 d-block me-1">dataset_linked</mat-icon>
                        <span class="d-block">Metadata</span>
                    </div>
                </a>
            </mat-button-toggle>
            <mat-button-toggle
                data-test-id="navigateToHistory"
                [class.active-link]="isDatasetViewTypeHistory"
                value="history"
            >
                <a [routerLink]="[datasetLink]" [queryParams]="{ tab: DatasetViewTypeEnum.History }" class="menu-link">
                    <div class="d-flex align-items-center">
                        <mat-icon class="fs-4 d-block me-1">manage_history</mat-icon>
                        <span class="d-block">History</span>
                    </div>
                </a>
            </mat-button-toggle>
            <mat-button-toggle
                data-test-id="navigateToLineage"
                [class.active-link]="isDatasetViewTypeLineage"
                value="lineage"
            >
                <a [routerLink]="[datasetLink]" [queryParams]="{ tab: DatasetViewTypeEnum.Lineage }" class="menu-link">
                    <div class="d-flex align-items-center">
                        <mat-icon class="fs-4 d-block me-1">account_tree</mat-icon>
                        <span class="d-block">Lineage</span>
                    </div>
                </a>
            </mat-button-toggle>
            <mat-button-toggle data-test-id="navigateToDiscussions" value="discussions" disabled>
                <div class="d-flex align-items-center">
                    <mat-icon class="fs-4 d-block me-1">message</mat-icon>
                    <span class="d-block">Discussions</span>
                </div>
            </mat-button-toggle>
            <ng-container *ngIf="viewModeElement$ | async as viewMode">
                <mat-button-toggle
                    data-test-id="navigateToFlows"
                    value="flows"
                    [class.active-link]="isDatasetViewTypeFlows"
                    *ngIf="viewMode === ViewModeElement.PERMISSIONS_MODE || viewMode === ViewModeElement.ADMIN_MODE"
                >
                    <a
                        [routerLink]="[datasetLink]"
                        [queryParams]="{ tab: DatasetViewTypeEnum.Flows }"
                        class="menu-link"
                    >
                        <div class="d-flex align-items-center">
                            <mat-icon class="fs-4 d-block me-1">add_task</mat-icon>
                            <span class="d-block">Flows</span>
                            <mat-icon *ngIf="viewMode === ViewModeElement.ADMIN_MODE" class="admin-icon d-block me-1">
                                admin_panel_settings</mat-icon
                            >
                        </div>
                    </a>
                </mat-button-toggle>
                <mat-button-toggle
                    data-test-id="navigateToSettings"
                    value="settings"
                    [class.active-link]="isDatasetViewTypeSettings"
                    *ngIf="viewMode === ViewModeElement.PERMISSIONS_MODE || viewMode === ViewModeElement.ADMIN_MODE"
                >
                    <a
                        [routerLink]="[datasetLink]"
                        [queryParams]="{ tab: DatasetViewTypeEnum.Settings }"
                        class="menu-link"
                    >
                        <div class="d-flex align-items-center">
                            <svg-icon name="account" class="me-1" />
                            <span class="d-block">Settings</span>
                            <mat-icon *ngIf="viewMode === ViewModeElement.ADMIN_MODE" class="admin-icon d-block me-1">
                                admin_panel_settings</mat-icon
                            >
                        </div>
                    </a>
                </mat-button-toggle>
            </ng-container>
        </mat-button-toggle-group>
    </div>
    <app-data-access-panel [datasetBasics]="datasetBasics" />
</div>