@memberjunction/ng-file-storage 3.4.0 → 4.0.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +1 -1
- package/dist/lib/category-tree/category-tree.d.ts.map +1 -1
- package/dist/lib/category-tree/category-tree.js +25 -25
- package/dist/lib/category-tree/category-tree.js.map +1 -1
- package/dist/lib/file-browser/file-browser-demo.component.d.ts.map +1 -1
- package/dist/lib/file-browser/file-browser-demo.component.js +3 -3
- package/dist/lib/file-browser/file-browser-demo.component.js.map +1 -1
- package/dist/lib/file-browser/file-browser-resource.component.d.ts +0 -1
- package/dist/lib/file-browser/file-browser-resource.component.d.ts.map +1 -1
- package/dist/lib/file-browser/file-browser-resource.component.js +3 -6
- package/dist/lib/file-browser/file-browser-resource.component.js.map +1 -1
- package/dist/lib/file-browser/file-browser.component.d.ts.map +1 -1
- package/dist/lib/file-browser/file-browser.component.js +3 -3
- package/dist/lib/file-browser/file-browser.component.js.map +1 -1
- package/dist/lib/file-browser/file-grid.component.d.ts.map +1 -1
- package/dist/lib/file-browser/file-grid.component.js +400 -382
- package/dist/lib/file-browser/file-grid.component.js.map +1 -1
- package/dist/lib/file-browser/folder-tree.component.d.ts.map +1 -1
- package/dist/lib/file-browser/folder-tree.component.js +65 -65
- package/dist/lib/file-browser/folder-tree.component.js.map +1 -1
- package/dist/lib/file-browser/storage-providers-list.component.d.ts.map +1 -1
- package/dist/lib/file-browser/storage-providers-list.component.js +50 -46
- package/dist/lib/file-browser/storage-providers-list.component.js.map +1 -1
- package/dist/lib/file-upload/file-upload.d.ts +19 -19
- package/dist/lib/file-upload/file-upload.d.ts.map +1 -1
- package/dist/lib/file-upload/file-upload.js +13 -14
- package/dist/lib/file-upload/file-upload.js.map +1 -1
- package/dist/lib/files-grid/files-grid.d.ts.map +1 -1
- package/dist/lib/files-grid/files-grid.js +19 -20
- package/dist/lib/files-grid/files-grid.js.map +1 -1
- package/dist/lib/module.d.ts +13 -14
- package/dist/lib/module.d.ts.map +1 -1
- package/dist/lib/module.js +0 -4
- package/dist/lib/module.js.map +1 -1
- package/dist/public-api.js +0 -3
- package/dist/public-api.js.map +1 -1
- package/package.json +28 -29
|
@@ -2,52 +2,51 @@ import { Component, Input, Output, EventEmitter } from '@angular/core';
|
|
|
2
2
|
import { GraphQLDataProvider, GraphQLFileStorageClient } from '@memberjunction/graphql-dataprovider';
|
|
3
3
|
import { FileStorageEngine } from '@memberjunction/core-entities';
|
|
4
4
|
import * as i0 from "@angular/core";
|
|
5
|
-
import * as i1 from "@angular/
|
|
6
|
-
import * as i2 from "@
|
|
7
|
-
import * as i3 from "@
|
|
8
|
-
|
|
9
|
-
function FileGridComponent_div_1_button_12_Template(rf, ctx) { if (rf & 1) {
|
|
5
|
+
import * as i1 from "@angular/forms";
|
|
6
|
+
import * as i2 from "@memberjunction/ng-shared-generic";
|
|
7
|
+
import * as i3 from "@progress/kendo-angular-label";
|
|
8
|
+
function FileGridComponent_Conditional_1_Conditional_12_Template(rf, ctx) { if (rf & 1) {
|
|
10
9
|
const _r3 = i0.ɵɵgetCurrentView();
|
|
11
|
-
i0.ɵɵelementStart(0, "button",
|
|
12
|
-
i0.ɵɵlistener("click", function
|
|
13
|
-
i0.ɵɵelement(1, "i",
|
|
10
|
+
i0.ɵɵelementStart(0, "button", 29);
|
|
11
|
+
i0.ɵɵlistener("click", function FileGridComponent_Conditional_1_Conditional_12_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r3); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.clearSearch()); });
|
|
12
|
+
i0.ɵɵelement(1, "i", 30);
|
|
14
13
|
i0.ɵɵelementEnd();
|
|
15
14
|
} }
|
|
16
|
-
function
|
|
15
|
+
function FileGridComponent_Conditional_1_Template(rf, ctx) { if (rf & 1) {
|
|
17
16
|
const _r1 = i0.ɵɵgetCurrentView();
|
|
18
|
-
i0.ɵɵelementStart(0, "div",
|
|
19
|
-
i0.ɵɵlistener("click", function
|
|
20
|
-
i0.ɵɵelement(3, "i",
|
|
17
|
+
i0.ɵɵelementStart(0, "div", 1)(1, "div", 12)(2, "button", 13);
|
|
18
|
+
i0.ɵɵlistener("click", function FileGridComponent_Conditional_1_Template_button_click_2_listener() { i0.ɵɵrestoreView(_r1); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.navigateUp()); });
|
|
19
|
+
i0.ɵɵelement(3, "i", 14);
|
|
21
20
|
i0.ɵɵelementEnd();
|
|
22
|
-
i0.ɵɵelementStart(4, "button",
|
|
23
|
-
i0.ɵɵlistener("click", function
|
|
24
|
-
i0.ɵɵelement(5, "i",
|
|
21
|
+
i0.ɵɵelementStart(4, "button", 15);
|
|
22
|
+
i0.ɵɵlistener("click", function FileGridComponent_Conditional_1_Template_button_click_4_listener() { i0.ɵɵrestoreView(_r1); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.refresh()); });
|
|
23
|
+
i0.ɵɵelement(5, "i", 16);
|
|
25
24
|
i0.ɵɵelementEnd()();
|
|
26
|
-
i0.ɵɵelementStart(6, "div",
|
|
27
|
-
i0.ɵɵelement(7, "i",
|
|
28
|
-
i0.ɵɵelementStart(8, "span",
|
|
25
|
+
i0.ɵɵelementStart(6, "div", 17);
|
|
26
|
+
i0.ɵɵelement(7, "i", 18);
|
|
27
|
+
i0.ɵɵelementStart(8, "span", 19);
|
|
29
28
|
i0.ɵɵtext(9);
|
|
30
29
|
i0.ɵɵelementEnd()();
|
|
31
|
-
i0.ɵɵelementStart(10, "div",
|
|
32
|
-
i0.ɵɵtwoWayListener("ngModelChange", function
|
|
33
|
-
i0.ɵɵlistener("ngModelChange", function
|
|
34
|
-
i0.ɵɵelementEnd();
|
|
35
|
-
i0.ɵɵ
|
|
36
|
-
i0.ɵɵelementStart(13, "select",
|
|
37
|
-
i0.ɵɵtwoWayListener("ngModelChange", function
|
|
38
|
-
i0.ɵɵlistener("ngModelChange", function
|
|
39
|
-
i0.ɵɵelementStart(14, "option",
|
|
30
|
+
i0.ɵɵelementStart(10, "div", 20)(11, "input", 21);
|
|
31
|
+
i0.ɵɵtwoWayListener("ngModelChange", function FileGridComponent_Conditional_1_Template_input_ngModelChange_11_listener($event) { i0.ɵɵrestoreView(_r1); const ctx_r1 = i0.ɵɵnextContext(); i0.ɵɵtwoWayBindingSet(ctx_r1.searchQuery, $event) || (ctx_r1.searchQuery = $event); return i0.ɵɵresetView($event); });
|
|
32
|
+
i0.ɵɵlistener("ngModelChange", function FileGridComponent_Conditional_1_Template_input_ngModelChange_11_listener($event) { i0.ɵɵrestoreView(_r1); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onSearchChange($event)); });
|
|
33
|
+
i0.ɵɵelementEnd();
|
|
34
|
+
i0.ɵɵconditionalCreate(12, FileGridComponent_Conditional_1_Conditional_12_Template, 2, 0, "button", 22);
|
|
35
|
+
i0.ɵɵelementStart(13, "select", 23);
|
|
36
|
+
i0.ɵɵtwoWayListener("ngModelChange", function FileGridComponent_Conditional_1_Template_select_ngModelChange_13_listener($event) { i0.ɵɵrestoreView(_r1); const ctx_r1 = i0.ɵɵnextContext(); i0.ɵɵtwoWayBindingSet(ctx_r1.fileTypeFilter, $event) || (ctx_r1.fileTypeFilter = $event); return i0.ɵɵresetView($event); });
|
|
37
|
+
i0.ɵɵlistener("ngModelChange", function FileGridComponent_Conditional_1_Template_select_ngModelChange_13_listener($event) { i0.ɵɵrestoreView(_r1); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onFileTypeFilterChange($event)); });
|
|
38
|
+
i0.ɵɵelementStart(14, "option", 24);
|
|
40
39
|
i0.ɵɵtext(15, "All");
|
|
41
40
|
i0.ɵɵelementEnd();
|
|
42
|
-
i0.ɵɵelementStart(16, "option",
|
|
41
|
+
i0.ɵɵelementStart(16, "option", 25);
|
|
43
42
|
i0.ɵɵtext(17, "Files");
|
|
44
43
|
i0.ɵɵelementEnd();
|
|
45
|
-
i0.ɵɵelementStart(18, "option",
|
|
44
|
+
i0.ɵɵelementStart(18, "option", 26);
|
|
46
45
|
i0.ɵɵtext(19, "Folders");
|
|
47
46
|
i0.ɵɵelementEnd()();
|
|
48
|
-
i0.ɵɵelementStart(20, "button",
|
|
49
|
-
i0.ɵɵlistener("click", function
|
|
50
|
-
i0.ɵɵelement(21, "i",
|
|
47
|
+
i0.ɵɵelementStart(20, "button", 27);
|
|
48
|
+
i0.ɵɵlistener("click", function FileGridComponent_Conditional_1_Template_button_click_20_listener() { i0.ɵɵrestoreView(_r1); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.toggleMultiAccountSearchMode()); });
|
|
49
|
+
i0.ɵɵelement(21, "i", 28);
|
|
51
50
|
i0.ɵɵelementEnd()()();
|
|
52
51
|
} if (rf & 2) {
|
|
53
52
|
const ctx_r1 = i0.ɵɵnextContext();
|
|
@@ -59,36 +58,36 @@ function FileGridComponent_div_1_Template(rf, ctx) { if (rf & 1) {
|
|
|
59
58
|
i0.ɵɵtwoWayProperty("ngModel", ctx_r1.searchQuery);
|
|
60
59
|
i0.ɵɵproperty("disabled", ctx_r1.isLoading || ctx_r1.isMultiProviderSearchMode);
|
|
61
60
|
i0.ɵɵadvance();
|
|
62
|
-
i0.ɵɵ
|
|
61
|
+
i0.ɵɵconditional(ctx_r1.searchQuery && !ctx_r1.isMultiProviderSearchMode ? 12 : -1);
|
|
63
62
|
i0.ɵɵadvance();
|
|
64
63
|
i0.ɵɵtwoWayProperty("ngModel", ctx_r1.fileTypeFilter);
|
|
65
64
|
i0.ɵɵproperty("disabled", ctx_r1.isLoading || ctx_r1.isMultiProviderSearchMode);
|
|
66
65
|
i0.ɵɵadvance(7);
|
|
67
66
|
i0.ɵɵclassProp("active", ctx_r1.isMultiProviderSearchMode);
|
|
68
67
|
} }
|
|
69
|
-
function
|
|
70
|
-
i0.ɵɵelement(0, "i",
|
|
68
|
+
function FileGridComponent_Conditional_2_Conditional_11_Template(rf, ctx) { if (rf & 1) {
|
|
69
|
+
i0.ɵɵelement(0, "i", 38);
|
|
71
70
|
} }
|
|
72
|
-
function
|
|
73
|
-
i0.ɵɵelement(0, "i",
|
|
71
|
+
function FileGridComponent_Conditional_2_Conditional_12_Template(rf, ctx) { if (rf & 1) {
|
|
72
|
+
i0.ɵɵelement(0, "i", 39);
|
|
74
73
|
} }
|
|
75
|
-
function
|
|
76
|
-
i0.ɵɵelementStart(0, "span",
|
|
74
|
+
function FileGridComponent_Conditional_2_For_19_Conditional_6_Template(rf, ctx) { if (rf & 1) {
|
|
75
|
+
i0.ɵɵelementStart(0, "span", 50);
|
|
77
76
|
i0.ɵɵtext(1, "(no search)");
|
|
78
77
|
i0.ɵɵelementEnd();
|
|
79
78
|
} }
|
|
80
|
-
function
|
|
79
|
+
function FileGridComponent_Conditional_2_For_19_Template(rf, ctx) { if (rf & 1) {
|
|
81
80
|
const _r5 = i0.ɵɵgetCurrentView();
|
|
82
|
-
i0.ɵɵelementStart(0, "label",
|
|
83
|
-
i0.ɵɵlistener("change", function
|
|
81
|
+
i0.ɵɵelementStart(0, "label", 46)(1, "input", 47);
|
|
82
|
+
i0.ɵɵlistener("change", function FileGridComponent_Conditional_2_For_19_Template_input_change_1_listener() { const a_r6 = i0.ɵɵrestoreView(_r5).$implicit; const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.toggleSearchAccount(a_r6.account.ID)); });
|
|
84
83
|
i0.ɵɵelementEnd();
|
|
85
|
-
i0.ɵɵelementStart(2, "span",
|
|
84
|
+
i0.ɵɵelementStart(2, "span", 48);
|
|
86
85
|
i0.ɵɵtext(3);
|
|
87
86
|
i0.ɵɵelementEnd();
|
|
88
|
-
i0.ɵɵelementStart(4, "span",
|
|
87
|
+
i0.ɵɵelementStart(4, "span", 49);
|
|
89
88
|
i0.ɵɵtext(5);
|
|
90
89
|
i0.ɵɵelementEnd();
|
|
91
|
-
i0.ɵɵ
|
|
90
|
+
i0.ɵɵconditionalCreate(6, FileGridComponent_Conditional_2_For_19_Conditional_6_Template, 2, 0, "span", 50);
|
|
92
91
|
i0.ɵɵelementEnd();
|
|
93
92
|
} if (rf & 2) {
|
|
94
93
|
const a_r6 = ctx.$implicit;
|
|
@@ -102,10 +101,10 @@ function FileGridComponent_div_2_label_18_Template(rf, ctx) { if (rf & 1) {
|
|
|
102
101
|
i0.ɵɵadvance(2);
|
|
103
102
|
i0.ɵɵtextInterpolate1("(", a_r6.provider.Name, ")");
|
|
104
103
|
i0.ɵɵadvance();
|
|
105
|
-
i0.ɵɵ
|
|
104
|
+
i0.ɵɵconditional(!ctx_r1.accountSupportsSearch(a_r6) ? 6 : -1);
|
|
106
105
|
} }
|
|
107
|
-
function
|
|
108
|
-
i0.ɵɵelementStart(0, "span",
|
|
106
|
+
function FileGridComponent_Conditional_2_Conditional_20_Conditional_6_Template(rf, ctx) { if (rf & 1) {
|
|
107
|
+
i0.ɵɵelementStart(0, "span", 54);
|
|
109
108
|
i0.ɵɵtext(1);
|
|
110
109
|
i0.ɵɵelementEnd();
|
|
111
110
|
} if (rf & 2) {
|
|
@@ -113,8 +112,8 @@ function FileGridComponent_div_2_div_19_span_6_Template(rf, ctx) { if (rf & 1) {
|
|
|
113
112
|
i0.ɵɵadvance();
|
|
114
113
|
i0.ɵɵtextInterpolate1(" , ", ctx_r1.multiProviderSearchResults.failedAccounts, " failed ");
|
|
115
114
|
} }
|
|
116
|
-
function
|
|
117
|
-
i0.ɵɵelementStart(0, "span",
|
|
115
|
+
function FileGridComponent_Conditional_2_Conditional_20_For_13_Conditional_5_Template(rf, ctx) { if (rf & 1) {
|
|
116
|
+
i0.ɵɵelementStart(0, "span", 52);
|
|
118
117
|
i0.ɵɵtext(1);
|
|
119
118
|
i0.ɵɵelementEnd();
|
|
120
119
|
} if (rf & 2) {
|
|
@@ -122,9 +121,9 @@ function FileGridComponent_div_2_div_19_div_12_span_5_Template(rf, ctx) { if (rf
|
|
|
122
121
|
i0.ɵɵadvance();
|
|
123
122
|
i0.ɵɵtextInterpolate1(" (", accountResult_r8.results.length, " result(s)) ");
|
|
124
123
|
} }
|
|
125
|
-
function
|
|
126
|
-
i0.ɵɵelementStart(0, "span",
|
|
127
|
-
i0.ɵɵelement(1, "i",
|
|
124
|
+
function FileGridComponent_Conditional_2_Conditional_20_For_13_Conditional_6_Template(rf, ctx) { if (rf & 1) {
|
|
125
|
+
i0.ɵɵelementStart(0, "span", 61);
|
|
126
|
+
i0.ɵɵelement(1, "i", 64);
|
|
128
127
|
i0.ɵɵtext(2);
|
|
129
128
|
i0.ɵɵelementEnd();
|
|
130
129
|
} if (rf & 2) {
|
|
@@ -132,19 +131,19 @@ function FileGridComponent_div_2_div_19_div_12_span_6_Template(rf, ctx) { if (rf
|
|
|
132
131
|
i0.ɵɵadvance(2);
|
|
133
132
|
i0.ɵɵtextInterpolate1(" ", accountResult_r8.errorMessage, " ");
|
|
134
133
|
} }
|
|
135
|
-
function
|
|
136
|
-
i0.ɵɵelementStart(0, "div",
|
|
137
|
-
i0.ɵɵelement(1, "i",
|
|
138
|
-
i0.ɵɵelementStart(2, "div",
|
|
134
|
+
function FileGridComponent_Conditional_2_Conditional_20_For_13_Conditional_7_For_2_Template(rf, ctx) { if (rf & 1) {
|
|
135
|
+
i0.ɵɵelementStart(0, "div", 65);
|
|
136
|
+
i0.ɵɵelement(1, "i", 66);
|
|
137
|
+
i0.ɵɵelementStart(2, "div", 67)(3, "span", 68);
|
|
139
138
|
i0.ɵɵtext(4);
|
|
140
139
|
i0.ɵɵelementEnd();
|
|
141
|
-
i0.ɵɵelementStart(5, "span",
|
|
140
|
+
i0.ɵɵelementStart(5, "span", 69);
|
|
142
141
|
i0.ɵɵtext(6);
|
|
143
142
|
i0.ɵɵelementEnd()();
|
|
144
|
-
i0.ɵɵelementStart(7, "span",
|
|
143
|
+
i0.ɵɵelementStart(7, "span", 70);
|
|
145
144
|
i0.ɵɵtext(8);
|
|
146
145
|
i0.ɵɵelementEnd();
|
|
147
|
-
i0.ɵɵelementStart(9, "span",
|
|
146
|
+
i0.ɵɵelementStart(9, "span", 71);
|
|
148
147
|
i0.ɵɵtext(10);
|
|
149
148
|
i0.ɵɵelementEnd()();
|
|
150
149
|
} if (rf & 2) {
|
|
@@ -161,29 +160,31 @@ function FileGridComponent_div_2_div_19_div_12_div_7_div_1_Template(rf, ctx) { i
|
|
|
161
160
|
i0.ɵɵadvance(2);
|
|
162
161
|
i0.ɵɵtextInterpolate(ctx_r1.formatSearchResultDate(file_r9.lastModified));
|
|
163
162
|
} }
|
|
164
|
-
function
|
|
165
|
-
i0.ɵɵelementStart(0, "div",
|
|
166
|
-
i0.ɵɵ
|
|
163
|
+
function FileGridComponent_Conditional_2_Conditional_20_For_13_Conditional_7_Template(rf, ctx) { if (rf & 1) {
|
|
164
|
+
i0.ɵɵelementStart(0, "div", 62);
|
|
165
|
+
i0.ɵɵrepeaterCreate(1, FileGridComponent_Conditional_2_Conditional_20_For_13_Conditional_7_For_2_Template, 11, 6, "div", 65, i0.ɵɵrepeaterTrackByIdentity);
|
|
167
166
|
i0.ɵɵelementEnd();
|
|
168
167
|
} if (rf & 2) {
|
|
169
168
|
const accountResult_r8 = i0.ɵɵnextContext().$implicit;
|
|
170
169
|
i0.ɵɵadvance();
|
|
171
|
-
i0.ɵɵ
|
|
170
|
+
i0.ɵɵrepeater(accountResult_r8.results);
|
|
172
171
|
} }
|
|
173
|
-
function
|
|
174
|
-
i0.ɵɵelementStart(0, "div",
|
|
172
|
+
function FileGridComponent_Conditional_2_Conditional_20_For_13_Conditional_8_Template(rf, ctx) { if (rf & 1) {
|
|
173
|
+
i0.ɵɵelementStart(0, "div", 63);
|
|
175
174
|
i0.ɵɵtext(1, " No matching files found ");
|
|
176
175
|
i0.ɵɵelementEnd();
|
|
177
176
|
} }
|
|
178
|
-
function
|
|
179
|
-
i0.ɵɵelementStart(0, "div",
|
|
180
|
-
i0.ɵɵelement(2, "i",
|
|
181
|
-
i0.ɵɵelementStart(3, "span",
|
|
177
|
+
function FileGridComponent_Conditional_2_Conditional_20_For_13_Template(rf, ctx) { if (rf & 1) {
|
|
178
|
+
i0.ɵɵelementStart(0, "div", 58)(1, "div", 59);
|
|
179
|
+
i0.ɵɵelement(2, "i", 60);
|
|
180
|
+
i0.ɵɵelementStart(3, "span", 48);
|
|
182
181
|
i0.ɵɵtext(4);
|
|
183
182
|
i0.ɵɵelementEnd();
|
|
184
|
-
i0.ɵɵ
|
|
183
|
+
i0.ɵɵconditionalCreate(5, FileGridComponent_Conditional_2_Conditional_20_For_13_Conditional_5_Template, 2, 1, "span", 52);
|
|
184
|
+
i0.ɵɵconditionalCreate(6, FileGridComponent_Conditional_2_Conditional_20_For_13_Conditional_6_Template, 3, 1, "span", 61);
|
|
185
185
|
i0.ɵɵelementEnd();
|
|
186
|
-
i0.ɵɵ
|
|
186
|
+
i0.ɵɵconditionalCreate(7, FileGridComponent_Conditional_2_Conditional_20_For_13_Conditional_7_Template, 3, 0, "div", 62);
|
|
187
|
+
i0.ɵɵconditionalCreate(8, FileGridComponent_Conditional_2_Conditional_20_For_13_Conditional_8_Template, 2, 0, "div", 63);
|
|
187
188
|
i0.ɵɵelementEnd();
|
|
188
189
|
} if (rf & 2) {
|
|
189
190
|
const accountResult_r8 = ctx.$implicit;
|
|
@@ -191,31 +192,31 @@ function FileGridComponent_div_2_div_19_div_12_Template(rf, ctx) { if (rf & 1) {
|
|
|
191
192
|
i0.ɵɵadvance(4);
|
|
192
193
|
i0.ɵɵtextInterpolate(accountResult_r8.accountName);
|
|
193
194
|
i0.ɵɵadvance();
|
|
194
|
-
i0.ɵɵ
|
|
195
|
+
i0.ɵɵconditional(accountResult_r8.success ? 5 : -1);
|
|
195
196
|
i0.ɵɵadvance();
|
|
196
|
-
i0.ɵɵ
|
|
197
|
+
i0.ɵɵconditional(!accountResult_r8.success ? 6 : -1);
|
|
197
198
|
i0.ɵɵadvance();
|
|
198
|
-
i0.ɵɵ
|
|
199
|
+
i0.ɵɵconditional(accountResult_r8.success && accountResult_r8.results.length > 0 ? 7 : -1);
|
|
199
200
|
i0.ɵɵadvance();
|
|
200
|
-
i0.ɵɵ
|
|
201
|
+
i0.ɵɵconditional(accountResult_r8.success && accountResult_r8.results.length === 0 ? 8 : -1);
|
|
201
202
|
} }
|
|
202
|
-
function
|
|
203
|
+
function FileGridComponent_Conditional_2_Conditional_20_Template(rf, ctx) { if (rf & 1) {
|
|
203
204
|
const _r7 = i0.ɵɵgetCurrentView();
|
|
204
|
-
i0.ɵɵelementStart(0, "div",
|
|
205
|
+
i0.ɵɵelementStart(0, "div", 44)(1, "div", 51)(2, "span", 52);
|
|
205
206
|
i0.ɵɵtext(3);
|
|
206
207
|
i0.ɵɵelementEnd();
|
|
207
|
-
i0.ɵɵelementStart(4, "span",
|
|
208
|
+
i0.ɵɵelementStart(4, "span", 53);
|
|
208
209
|
i0.ɵɵtext(5);
|
|
209
|
-
i0.ɵɵ
|
|
210
|
+
i0.ɵɵconditionalCreate(6, FileGridComponent_Conditional_2_Conditional_20_Conditional_6_Template, 2, 1, "span", 54);
|
|
210
211
|
i0.ɵɵtext(7, ") ");
|
|
211
212
|
i0.ɵɵelementEnd();
|
|
212
|
-
i0.ɵɵelementStart(8, "button",
|
|
213
|
-
i0.ɵɵlistener("click", function
|
|
214
|
-
i0.ɵɵelement(9, "i",
|
|
213
|
+
i0.ɵɵelementStart(8, "button", 55);
|
|
214
|
+
i0.ɵɵlistener("click", function FileGridComponent_Conditional_2_Conditional_20_Template_button_click_8_listener() { i0.ɵɵrestoreView(_r7); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.clearMultiProviderSearch()); });
|
|
215
|
+
i0.ɵɵelement(9, "i", 30);
|
|
215
216
|
i0.ɵɵtext(10, " Clear ");
|
|
216
217
|
i0.ɵɵelementEnd()();
|
|
217
|
-
i0.ɵɵelementStart(11, "div",
|
|
218
|
-
i0.ɵɵ
|
|
218
|
+
i0.ɵɵelementStart(11, "div", 56);
|
|
219
|
+
i0.ɵɵrepeaterCreate(12, FileGridComponent_Conditional_2_Conditional_20_For_13_Template, 9, 7, "div", 57, i0.ɵɵrepeaterTrackByIdentity);
|
|
219
220
|
i0.ɵɵelementEnd()();
|
|
220
221
|
} if (rf & 2) {
|
|
221
222
|
const ctx_r1 = i0.ɵɵnextContext(2);
|
|
@@ -224,41 +225,43 @@ function FileGridComponent_div_2_div_19_Template(rf, ctx) { if (rf & 1) {
|
|
|
224
225
|
i0.ɵɵadvance(2);
|
|
225
226
|
i0.ɵɵtextInterpolate1(" (", ctx_r1.multiProviderSearchResults.successfulAccounts, " account(s) searched ");
|
|
226
227
|
i0.ɵɵadvance();
|
|
227
|
-
i0.ɵɵ
|
|
228
|
+
i0.ɵɵconditional(ctx_r1.multiProviderSearchResults.failedAccounts > 0 ? 6 : -1);
|
|
228
229
|
i0.ɵɵadvance(6);
|
|
229
|
-
i0.ɵɵ
|
|
230
|
+
i0.ɵɵrepeater(ctx_r1.multiProviderSearchResults.accountResults);
|
|
230
231
|
} }
|
|
231
|
-
function
|
|
232
|
-
i0.ɵɵelementStart(0, "div",
|
|
233
|
-
i0.ɵɵelement(1, "mj-loading",
|
|
232
|
+
function FileGridComponent_Conditional_2_Conditional_21_Template(rf, ctx) { if (rf & 1) {
|
|
233
|
+
i0.ɵɵelementStart(0, "div", 45);
|
|
234
|
+
i0.ɵɵelement(1, "mj-loading", 72);
|
|
234
235
|
i0.ɵɵelementEnd();
|
|
235
236
|
} }
|
|
236
|
-
function
|
|
237
|
+
function FileGridComponent_Conditional_2_Template(rf, ctx) { if (rf & 1) {
|
|
237
238
|
const _r4 = i0.ɵɵgetCurrentView();
|
|
238
|
-
i0.ɵɵelementStart(0, "div",
|
|
239
|
-
i0.ɵɵelement(3, "i",
|
|
239
|
+
i0.ɵɵelementStart(0, "div", 2)(1, "div", 31)(2, "h3");
|
|
240
|
+
i0.ɵɵelement(3, "i", 32);
|
|
240
241
|
i0.ɵɵtext(4, " Search Across Providers");
|
|
241
242
|
i0.ɵɵelementEnd();
|
|
242
|
-
i0.ɵɵelementStart(5, "button",
|
|
243
|
-
i0.ɵɵlistener("click", function
|
|
244
|
-
i0.ɵɵelement(6, "i",
|
|
243
|
+
i0.ɵɵelementStart(5, "button", 33);
|
|
244
|
+
i0.ɵɵlistener("click", function FileGridComponent_Conditional_2_Template_button_click_5_listener() { i0.ɵɵrestoreView(_r4); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.toggleMultiAccountSearchMode()); });
|
|
245
|
+
i0.ɵɵelement(6, "i", 30);
|
|
245
246
|
i0.ɵɵelementEnd()();
|
|
246
|
-
i0.ɵɵelementStart(7, "div",
|
|
247
|
-
i0.ɵɵtwoWayListener("ngModelChange", function
|
|
248
|
-
i0.ɵɵlistener("keydown.enter", function
|
|
249
|
-
i0.ɵɵelementEnd();
|
|
250
|
-
i0.ɵɵelementStart(10, "button",
|
|
251
|
-
i0.ɵɵlistener("click", function
|
|
252
|
-
i0.ɵɵ
|
|
247
|
+
i0.ɵɵelementStart(7, "div", 34)(8, "div", 35)(9, "input", 36);
|
|
248
|
+
i0.ɵɵtwoWayListener("ngModelChange", function FileGridComponent_Conditional_2_Template_input_ngModelChange_9_listener($event) { i0.ɵɵrestoreView(_r4); const ctx_r1 = i0.ɵɵnextContext(); i0.ɵɵtwoWayBindingSet(ctx_r1.multiProviderSearchQuery, $event) || (ctx_r1.multiProviderSearchQuery = $event); return i0.ɵɵresetView($event); });
|
|
249
|
+
i0.ɵɵlistener("keydown.enter", function FileGridComponent_Conditional_2_Template_input_keydown_enter_9_listener() { i0.ɵɵrestoreView(_r4); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.executeMultiAccountSearch()); });
|
|
250
|
+
i0.ɵɵelementEnd();
|
|
251
|
+
i0.ɵɵelementStart(10, "button", 37);
|
|
252
|
+
i0.ɵɵlistener("click", function FileGridComponent_Conditional_2_Template_button_click_10_listener() { i0.ɵɵrestoreView(_r4); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.executeMultiAccountSearch()); });
|
|
253
|
+
i0.ɵɵconditionalCreate(11, FileGridComponent_Conditional_2_Conditional_11_Template, 1, 0, "i", 38);
|
|
254
|
+
i0.ɵɵconditionalCreate(12, FileGridComponent_Conditional_2_Conditional_12_Template, 1, 0, "i", 39);
|
|
253
255
|
i0.ɵɵtext(13);
|
|
254
256
|
i0.ɵɵelementEnd()();
|
|
255
|
-
i0.ɵɵelementStart(14, "div",
|
|
257
|
+
i0.ɵɵelementStart(14, "div", 40)(15, "label", 41);
|
|
256
258
|
i0.ɵɵtext(16, "Select accounts to search:");
|
|
257
259
|
i0.ɵɵelementEnd();
|
|
258
|
-
i0.ɵɵelementStart(17, "div",
|
|
259
|
-
i0.ɵɵ
|
|
260
|
+
i0.ɵɵelementStart(17, "div", 42);
|
|
261
|
+
i0.ɵɵrepeaterCreate(18, FileGridComponent_Conditional_2_For_19_Template, 7, 8, "label", 43, i0.ɵɵrepeaterTrackByIdentity);
|
|
260
262
|
i0.ɵɵelementEnd()()();
|
|
261
|
-
i0.ɵɵ
|
|
263
|
+
i0.ɵɵconditionalCreate(20, FileGridComponent_Conditional_2_Conditional_20_Template, 14, 3, "div", 44);
|
|
264
|
+
i0.ɵɵconditionalCreate(21, FileGridComponent_Conditional_2_Conditional_21_Template, 2, 0, "div", 45);
|
|
262
265
|
i0.ɵɵelementEnd();
|
|
263
266
|
} if (rf & 2) {
|
|
264
267
|
const ctx_r1 = i0.ɵɵnextContext();
|
|
@@ -268,34 +271,34 @@ function FileGridComponent_div_2_Template(rf, ctx) { if (rf & 1) {
|
|
|
268
271
|
i0.ɵɵadvance();
|
|
269
272
|
i0.ɵɵproperty("disabled", ctx_r1.isSearching || !ctx_r1.multiProviderSearchQuery.trim() || ctx_r1.selectedSearchProviders.size === 0);
|
|
270
273
|
i0.ɵɵadvance();
|
|
271
|
-
i0.ɵɵ
|
|
274
|
+
i0.ɵɵconditional(ctx_r1.isSearching ? 11 : -1);
|
|
272
275
|
i0.ɵɵadvance();
|
|
273
|
-
i0.ɵɵ
|
|
276
|
+
i0.ɵɵconditional(!ctx_r1.isSearching ? 12 : -1);
|
|
274
277
|
i0.ɵɵadvance();
|
|
275
278
|
i0.ɵɵtextInterpolate1(" ", ctx_r1.isSearching ? "Searching..." : "Search", " ");
|
|
276
279
|
i0.ɵɵadvance(5);
|
|
277
|
-
i0.ɵɵ
|
|
278
|
-
i0.ɵɵadvance();
|
|
279
|
-
i0.ɵɵ
|
|
280
|
+
i0.ɵɵrepeater(ctx_r1.availableAccounts);
|
|
281
|
+
i0.ɵɵadvance(2);
|
|
282
|
+
i0.ɵɵconditional(ctx_r1.multiProviderSearchResults ? 20 : -1);
|
|
280
283
|
i0.ɵɵadvance();
|
|
281
|
-
i0.ɵɵ
|
|
284
|
+
i0.ɵɵconditional(ctx_r1.isSearching ? 21 : -1);
|
|
282
285
|
} }
|
|
283
|
-
function
|
|
284
|
-
i0.ɵɵelementStart(0, "div",
|
|
285
|
-
i0.ɵɵelement(1, "mj-loading",
|
|
286
|
+
function FileGridComponent_Conditional_3_Template(rf, ctx) { if (rf & 1) {
|
|
287
|
+
i0.ɵɵelementStart(0, "div", 3);
|
|
288
|
+
i0.ɵɵelement(1, "mj-loading", 73);
|
|
286
289
|
i0.ɵɵelementEnd();
|
|
287
290
|
} }
|
|
288
|
-
function
|
|
291
|
+
function FileGridComponent_Conditional_4_Template(rf, ctx) { if (rf & 1) {
|
|
289
292
|
const _r10 = i0.ɵɵgetCurrentView();
|
|
290
|
-
i0.ɵɵelementStart(0, "div",
|
|
291
|
-
i0.ɵɵelement(2, "i",
|
|
293
|
+
i0.ɵɵelementStart(0, "div", 4)(1, "div", 74);
|
|
294
|
+
i0.ɵɵelement(2, "i", 75);
|
|
292
295
|
i0.ɵɵelementEnd();
|
|
293
|
-
i0.ɵɵelementStart(3, "p",
|
|
296
|
+
i0.ɵɵelementStart(3, "p", 76);
|
|
294
297
|
i0.ɵɵtext(4);
|
|
295
298
|
i0.ɵɵelementEnd();
|
|
296
|
-
i0.ɵɵelementStart(5, "button",
|
|
297
|
-
i0.ɵɵlistener("click", function
|
|
298
|
-
i0.ɵɵelement(6, "i",
|
|
299
|
+
i0.ɵɵelementStart(5, "button", 77);
|
|
300
|
+
i0.ɵɵlistener("click", function FileGridComponent_Conditional_4_Template_button_click_5_listener() { i0.ɵɵrestoreView(_r10); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.refresh()); });
|
|
301
|
+
i0.ɵɵelement(6, "i", 16);
|
|
299
302
|
i0.ɵɵtext(7, " Retry ");
|
|
300
303
|
i0.ɵɵelementEnd()();
|
|
301
304
|
} if (rf & 2) {
|
|
@@ -303,22 +306,22 @@ function FileGridComponent_div_4_Template(rf, ctx) { if (rf & 1) {
|
|
|
303
306
|
i0.ɵɵadvance(4);
|
|
304
307
|
i0.ɵɵtextInterpolate(ctx_r1.errorMessage);
|
|
305
308
|
} }
|
|
306
|
-
function
|
|
309
|
+
function FileGridComponent_Conditional_5_For_20_Template(rf, ctx) { if (rf & 1) {
|
|
307
310
|
const _r12 = i0.ɵɵgetCurrentView();
|
|
308
|
-
i0.ɵɵelementStart(0, "tr",
|
|
309
|
-
i0.ɵɵlistener("click", function
|
|
310
|
-
i0.ɵɵelementStart(1, "td",
|
|
311
|
-
i0.ɵɵelement(2, "i",
|
|
312
|
-
i0.ɵɵelementStart(3, "span",
|
|
311
|
+
i0.ɵɵelementStart(0, "tr", 85);
|
|
312
|
+
i0.ɵɵlistener("click", function FileGridComponent_Conditional_5_For_20_Template_tr_click_0_listener($event) { const item_r13 = i0.ɵɵrestoreView(_r12).$implicit; const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.onTileClick(item_r13, $event)); })("dblclick", function FileGridComponent_Conditional_5_For_20_Template_tr_dblclick_0_listener() { const item_r13 = i0.ɵɵrestoreView(_r12).$implicit; const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.onItemDoubleClick(item_r13)); });
|
|
313
|
+
i0.ɵɵelementStart(1, "td", 86);
|
|
314
|
+
i0.ɵɵelement(2, "i", 87);
|
|
315
|
+
i0.ɵɵelementStart(3, "span", 88);
|
|
313
316
|
i0.ɵɵtext(4);
|
|
314
317
|
i0.ɵɵelementEnd()();
|
|
315
|
-
i0.ɵɵelementStart(5, "td",
|
|
318
|
+
i0.ɵɵelementStart(5, "td", 81)(6, "span", 89);
|
|
316
319
|
i0.ɵɵtext(7);
|
|
317
320
|
i0.ɵɵelementEnd()();
|
|
318
|
-
i0.ɵɵelementStart(8, "td",
|
|
321
|
+
i0.ɵɵelementStart(8, "td", 90)(9, "span", 91);
|
|
319
322
|
i0.ɵɵtext(10);
|
|
320
323
|
i0.ɵɵelementEnd()();
|
|
321
|
-
i0.ɵɵelementStart(11, "td",
|
|
324
|
+
i0.ɵɵelementStart(11, "td", 92)(12, "span", 93);
|
|
322
325
|
i0.ɵɵtext(13);
|
|
323
326
|
i0.ɵɵelementEnd()()();
|
|
324
327
|
} if (rf & 2) {
|
|
@@ -336,34 +339,34 @@ function FileGridComponent_div_5_tr_19_Template(rf, ctx) { if (rf & 1) {
|
|
|
336
339
|
i0.ɵɵadvance(3);
|
|
337
340
|
i0.ɵɵtextInterpolate(ctx_r1.formatDate(item_r13.lastModified));
|
|
338
341
|
} }
|
|
339
|
-
function
|
|
342
|
+
function FileGridComponent_Conditional_5_Template(rf, ctx) { if (rf & 1) {
|
|
340
343
|
const _r11 = i0.ɵɵgetCurrentView();
|
|
341
|
-
i0.ɵɵelementStart(0, "div",
|
|
342
|
-
i0.ɵɵlistener("click", function
|
|
344
|
+
i0.ɵɵelementStart(0, "div", 5)(1, "table", 78)(2, "thead")(3, "tr")(4, "th", 79);
|
|
345
|
+
i0.ɵɵlistener("click", function FileGridComponent_Conditional_5_Template_th_click_4_listener() { i0.ɵɵrestoreView(_r11); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onSortChange([{ field: "name", dir: ctx_r1.sort[0].field === "name" && ctx_r1.sort[0].dir === "asc" ? "desc" : "asc" }])); });
|
|
343
346
|
i0.ɵɵelementStart(5, "span");
|
|
344
347
|
i0.ɵɵtext(6, "Name");
|
|
345
348
|
i0.ɵɵelementEnd();
|
|
346
|
-
i0.ɵɵelement(7, "i",
|
|
349
|
+
i0.ɵɵelement(7, "i", 80);
|
|
347
350
|
i0.ɵɵelementEnd();
|
|
348
|
-
i0.ɵɵelementStart(8, "th",
|
|
351
|
+
i0.ɵɵelementStart(8, "th", 81);
|
|
349
352
|
i0.ɵɵtext(9, "Type");
|
|
350
353
|
i0.ɵɵelementEnd();
|
|
351
|
-
i0.ɵɵelementStart(10, "th",
|
|
352
|
-
i0.ɵɵlistener("click", function
|
|
354
|
+
i0.ɵɵelementStart(10, "th", 82);
|
|
355
|
+
i0.ɵɵlistener("click", function FileGridComponent_Conditional_5_Template_th_click_10_listener() { i0.ɵɵrestoreView(_r11); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onSortChange([{ field: "size", dir: ctx_r1.sort[0].field === "size" && ctx_r1.sort[0].dir === "asc" ? "desc" : "asc" }])); });
|
|
353
356
|
i0.ɵɵelementStart(11, "span");
|
|
354
357
|
i0.ɵɵtext(12, "Size");
|
|
355
358
|
i0.ɵɵelementEnd();
|
|
356
|
-
i0.ɵɵelement(13, "i",
|
|
359
|
+
i0.ɵɵelement(13, "i", 80);
|
|
357
360
|
i0.ɵɵelementEnd();
|
|
358
|
-
i0.ɵɵelementStart(14, "th",
|
|
359
|
-
i0.ɵɵlistener("click", function
|
|
361
|
+
i0.ɵɵelementStart(14, "th", 83);
|
|
362
|
+
i0.ɵɵlistener("click", function FileGridComponent_Conditional_5_Template_th_click_14_listener() { i0.ɵɵrestoreView(_r11); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onSortChange([{ field: "lastModified", dir: ctx_r1.sort[0].field === "lastModified" && ctx_r1.sort[0].dir === "asc" ? "desc" : "asc" }])); });
|
|
360
363
|
i0.ɵɵelementStart(15, "span");
|
|
361
364
|
i0.ɵɵtext(16, "Modified");
|
|
362
365
|
i0.ɵɵelementEnd();
|
|
363
|
-
i0.ɵɵelement(17, "i",
|
|
366
|
+
i0.ɵɵelement(17, "i", 80);
|
|
364
367
|
i0.ɵɵelementEnd()()();
|
|
365
368
|
i0.ɵɵelementStart(18, "tbody");
|
|
366
|
-
i0.ɵɵ
|
|
369
|
+
i0.ɵɵrepeaterCreate(19, FileGridComponent_Conditional_5_For_20_Template, 14, 8, "tr", 84, i0.ɵɵrepeaterTrackByIdentity);
|
|
367
370
|
i0.ɵɵelementEnd()()();
|
|
368
371
|
} if (rf & 2) {
|
|
369
372
|
const ctx_r1 = i0.ɵɵnextContext();
|
|
@@ -374,10 +377,10 @@ function FileGridComponent_div_5_Template(rf, ctx) { if (rf & 1) {
|
|
|
374
377
|
i0.ɵɵadvance(4);
|
|
375
378
|
i0.ɵɵclassProp("fa-caret-up", ctx_r1.sort[0].field === "lastModified" && ctx_r1.sort[0].dir === "asc")("fa-caret-down", ctx_r1.sort[0].field === "lastModified" && ctx_r1.sort[0].dir === "desc")("fa-sort", ctx_r1.sort[0].field !== "lastModified");
|
|
376
379
|
i0.ɵɵadvance(2);
|
|
377
|
-
i0.ɵɵ
|
|
380
|
+
i0.ɵɵrepeater(ctx_r1.filteredItems);
|
|
378
381
|
} }
|
|
379
|
-
function
|
|
380
|
-
i0.ɵɵelementStart(0, "div",
|
|
382
|
+
function FileGridComponent_Conditional_6_For_3_Conditional_5_Template(rf, ctx) { if (rf & 1) {
|
|
383
|
+
i0.ɵɵelementStart(0, "div", 99);
|
|
381
384
|
i0.ɵɵtext(1);
|
|
382
385
|
i0.ɵɵelementEnd();
|
|
383
386
|
} if (rf & 2) {
|
|
@@ -386,22 +389,23 @@ function FileGridComponent_div_6_div_2_div_5_Template(rf, ctx) { if (rf & 1) {
|
|
|
386
389
|
i0.ɵɵadvance();
|
|
387
390
|
i0.ɵɵtextInterpolate(ctx_r1.formatFileSize(item_r15.size));
|
|
388
391
|
} }
|
|
389
|
-
function
|
|
390
|
-
i0.ɵɵelementStart(0, "div",
|
|
392
|
+
function FileGridComponent_Conditional_6_For_3_Conditional_6_Template(rf, ctx) { if (rf & 1) {
|
|
393
|
+
i0.ɵɵelementStart(0, "div", 99);
|
|
391
394
|
i0.ɵɵtext(1, "Folder");
|
|
392
395
|
i0.ɵɵelementEnd();
|
|
393
396
|
} }
|
|
394
|
-
function
|
|
397
|
+
function FileGridComponent_Conditional_6_For_3_Template(rf, ctx) { if (rf & 1) {
|
|
395
398
|
const _r14 = i0.ɵɵgetCurrentView();
|
|
396
|
-
i0.ɵɵelementStart(0, "div",
|
|
397
|
-
i0.ɵɵlistener("click", function
|
|
398
|
-
i0.ɵɵelementStart(1, "div",
|
|
399
|
+
i0.ɵɵelementStart(0, "div", 96);
|
|
400
|
+
i0.ɵɵlistener("click", function FileGridComponent_Conditional_6_For_3_Template_div_click_0_listener($event) { const item_r15 = i0.ɵɵrestoreView(_r14).$implicit; const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.onTileClick(item_r15, $event)); })("dblclick", function FileGridComponent_Conditional_6_For_3_Template_div_dblclick_0_listener() { const item_r15 = i0.ɵɵrestoreView(_r14).$implicit; const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.onItemDoubleClick(item_r15)); });
|
|
401
|
+
i0.ɵɵelementStart(1, "div", 97);
|
|
399
402
|
i0.ɵɵelement(2, "i");
|
|
400
403
|
i0.ɵɵelementEnd();
|
|
401
|
-
i0.ɵɵelementStart(3, "div",
|
|
404
|
+
i0.ɵɵelementStart(3, "div", 98);
|
|
402
405
|
i0.ɵɵtext(4);
|
|
403
406
|
i0.ɵɵelementEnd();
|
|
404
|
-
i0.ɵɵ
|
|
407
|
+
i0.ɵɵconditionalCreate(5, FileGridComponent_Conditional_6_For_3_Conditional_5_Template, 2, 1, "div", 99);
|
|
408
|
+
i0.ɵɵconditionalCreate(6, FileGridComponent_Conditional_6_For_3_Conditional_6_Template, 2, 0, "div", 99);
|
|
405
409
|
i0.ɵɵelementEnd();
|
|
406
410
|
} if (rf & 2) {
|
|
407
411
|
const item_r15 = ctx.$implicit;
|
|
@@ -412,84 +416,84 @@ function FileGridComponent_div_6_div_2_Template(rf, ctx) { if (rf & 1) {
|
|
|
412
416
|
i0.ɵɵadvance(2);
|
|
413
417
|
i0.ɵɵtextInterpolate(item_r15.name);
|
|
414
418
|
i0.ɵɵadvance();
|
|
415
|
-
i0.ɵɵ
|
|
419
|
+
i0.ɵɵconditional(item_r15.type === "file" ? 5 : -1);
|
|
416
420
|
i0.ɵɵadvance();
|
|
417
|
-
i0.ɵɵ
|
|
421
|
+
i0.ɵɵconditional(item_r15.type === "folder" ? 6 : -1);
|
|
418
422
|
} }
|
|
419
|
-
function
|
|
420
|
-
i0.ɵɵelementStart(0, "div",
|
|
421
|
-
i0.ɵɵ
|
|
423
|
+
function FileGridComponent_Conditional_6_Template(rf, ctx) { if (rf & 1) {
|
|
424
|
+
i0.ɵɵelementStart(0, "div", 6)(1, "div", 94);
|
|
425
|
+
i0.ɵɵrepeaterCreate(2, FileGridComponent_Conditional_6_For_3_Template, 7, 7, "div", 95, i0.ɵɵrepeaterTrackByIdentity);
|
|
422
426
|
i0.ɵɵelementEnd()();
|
|
423
427
|
} if (rf & 2) {
|
|
424
428
|
const ctx_r1 = i0.ɵɵnextContext();
|
|
425
429
|
i0.ɵɵadvance(2);
|
|
426
|
-
i0.ɵɵ
|
|
430
|
+
i0.ɵɵrepeater(ctx_r1.filteredItems);
|
|
427
431
|
} }
|
|
428
|
-
function
|
|
432
|
+
function FileGridComponent_Conditional_7_Template(rf, ctx) { if (rf & 1) {
|
|
429
433
|
const _r16 = i0.ɵɵgetCurrentView();
|
|
430
|
-
i0.ɵɵelementStart(0, "div",
|
|
431
|
-
i0.ɵɵelement(2, "i",
|
|
434
|
+
i0.ɵɵelementStart(0, "div", 7)(1, "div", 100);
|
|
435
|
+
i0.ɵɵelement(2, "i", 101);
|
|
432
436
|
i0.ɵɵelementEnd();
|
|
433
|
-
i0.ɵɵelementStart(3, "p",
|
|
437
|
+
i0.ɵɵelementStart(3, "p", 102);
|
|
434
438
|
i0.ɵɵtext(4, "This folder is empty");
|
|
435
439
|
i0.ɵɵelementEnd();
|
|
436
|
-
i0.ɵɵelementStart(5, "button",
|
|
437
|
-
i0.ɵɵlistener("click", function
|
|
438
|
-
i0.ɵɵelement(6, "i",
|
|
440
|
+
i0.ɵɵelementStart(5, "button", 103);
|
|
441
|
+
i0.ɵɵlistener("click", function FileGridComponent_Conditional_7_Template_button_click_5_listener() { i0.ɵɵrestoreView(_r16); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onUploadClick()); });
|
|
442
|
+
i0.ɵɵelement(6, "i", 104);
|
|
439
443
|
i0.ɵɵtext(7, " Upload Files ");
|
|
440
444
|
i0.ɵɵelementEnd()();
|
|
441
445
|
} }
|
|
442
|
-
function
|
|
446
|
+
function FileGridComponent_Conditional_8_Template(rf, ctx) { if (rf & 1) {
|
|
443
447
|
const _r17 = i0.ɵɵgetCurrentView();
|
|
444
|
-
i0.ɵɵelementStart(0, "div",
|
|
445
|
-
i0.ɵɵlistener("click", function
|
|
446
|
-
i0.ɵɵelement(3, "i",
|
|
448
|
+
i0.ɵɵelementStart(0, "div", 8)(1, "div", 105)(2, "button", 106);
|
|
449
|
+
i0.ɵɵlistener("click", function FileGridComponent_Conditional_8_Template_button_click_2_listener() { i0.ɵɵrestoreView(_r17); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onUploadClick()); });
|
|
450
|
+
i0.ɵɵelement(3, "i", 104);
|
|
447
451
|
i0.ɵɵtext(4, " Upload ");
|
|
448
452
|
i0.ɵɵelementEnd();
|
|
449
|
-
i0.ɵɵelementStart(5, "button",
|
|
450
|
-
i0.ɵɵlistener("click", function
|
|
451
|
-
i0.ɵɵelement(6, "i",
|
|
453
|
+
i0.ɵɵelementStart(5, "button", 106);
|
|
454
|
+
i0.ɵɵlistener("click", function FileGridComponent_Conditional_8_Template_button_click_5_listener() { i0.ɵɵrestoreView(_r17); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onNewFolderClick()); });
|
|
455
|
+
i0.ɵɵelement(6, "i", 107);
|
|
452
456
|
i0.ɵɵtext(7, " New Folder ");
|
|
453
457
|
i0.ɵɵelementEnd();
|
|
454
|
-
i0.ɵɵelementStart(8, "button",
|
|
455
|
-
i0.ɵɵlistener("click", function
|
|
456
|
-
i0.ɵɵelement(9, "i",
|
|
458
|
+
i0.ɵɵelementStart(8, "button", 108);
|
|
459
|
+
i0.ɵɵlistener("click", function FileGridComponent_Conditional_8_Template_button_click_8_listener() { i0.ɵɵrestoreView(_r17); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onDownloadClick()); });
|
|
460
|
+
i0.ɵɵelement(9, "i", 109);
|
|
457
461
|
i0.ɵɵtext(10, " Download ");
|
|
458
462
|
i0.ɵɵelementEnd();
|
|
459
|
-
i0.ɵɵelementStart(11, "button",
|
|
460
|
-
i0.ɵɵlistener("click", function
|
|
461
|
-
i0.ɵɵelement(12, "i",
|
|
463
|
+
i0.ɵɵelementStart(11, "button", 108);
|
|
464
|
+
i0.ɵɵlistener("click", function FileGridComponent_Conditional_8_Template_button_click_11_listener() { i0.ɵɵrestoreView(_r17); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onRenameClick()); });
|
|
465
|
+
i0.ɵɵelement(12, "i", 110);
|
|
462
466
|
i0.ɵɵtext(13, " Rename ");
|
|
463
467
|
i0.ɵɵelementEnd();
|
|
464
|
-
i0.ɵɵelementStart(14, "button",
|
|
465
|
-
i0.ɵɵlistener("click", function
|
|
466
|
-
i0.ɵɵelement(15, "i",
|
|
468
|
+
i0.ɵɵelementStart(14, "button", 108);
|
|
469
|
+
i0.ɵɵlistener("click", function FileGridComponent_Conditional_8_Template_button_click_14_listener() { i0.ɵɵrestoreView(_r17); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onCopyClick()); });
|
|
470
|
+
i0.ɵɵelement(15, "i", 111);
|
|
467
471
|
i0.ɵɵtext(16, " Copy ");
|
|
468
472
|
i0.ɵɵelementEnd();
|
|
469
|
-
i0.ɵɵelementStart(17, "button",
|
|
470
|
-
i0.ɵɵlistener("click", function
|
|
471
|
-
i0.ɵɵelement(18, "i",
|
|
473
|
+
i0.ɵɵelementStart(17, "button", 112);
|
|
474
|
+
i0.ɵɵlistener("click", function FileGridComponent_Conditional_8_Template_button_click_17_listener() { i0.ɵɵrestoreView(_r17); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onCopyToAccountClick()); });
|
|
475
|
+
i0.ɵɵelement(18, "i", 113);
|
|
472
476
|
i0.ɵɵtext(19, " Copy to... ");
|
|
473
477
|
i0.ɵɵelementEnd();
|
|
474
|
-
i0.ɵɵelementStart(20, "button",
|
|
475
|
-
i0.ɵɵlistener("click", function
|
|
476
|
-
i0.ɵɵelement(21, "i",
|
|
478
|
+
i0.ɵɵelementStart(20, "button", 108);
|
|
479
|
+
i0.ɵɵlistener("click", function FileGridComponent_Conditional_8_Template_button_click_20_listener() { i0.ɵɵrestoreView(_r17); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onMoveClick()); });
|
|
480
|
+
i0.ɵɵelement(21, "i", 114);
|
|
477
481
|
i0.ɵɵtext(22, " Move ");
|
|
478
482
|
i0.ɵɵelementEnd();
|
|
479
|
-
i0.ɵɵelementStart(23, "button",
|
|
480
|
-
i0.ɵɵlistener("click", function
|
|
481
|
-
i0.ɵɵelement(24, "i",
|
|
483
|
+
i0.ɵɵelementStart(23, "button", 108);
|
|
484
|
+
i0.ɵɵlistener("click", function FileGridComponent_Conditional_8_Template_button_click_23_listener() { i0.ɵɵrestoreView(_r17); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onDeleteClick()); });
|
|
485
|
+
i0.ɵɵelement(24, "i", 115);
|
|
482
486
|
i0.ɵɵtext(25, " Delete ");
|
|
483
487
|
i0.ɵɵelementEnd()();
|
|
484
|
-
i0.ɵɵelementStart(26, "div",
|
|
485
|
-
i0.ɵɵlistener("click", function
|
|
486
|
-
i0.ɵɵelement(29, "i",
|
|
488
|
+
i0.ɵɵelementStart(26, "div", 116)(27, "div", 117)(28, "button", 118);
|
|
489
|
+
i0.ɵɵlistener("click", function FileGridComponent_Conditional_8_Template_button_click_28_listener() { i0.ɵɵrestoreView(_r17); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.viewMode = "list"); });
|
|
490
|
+
i0.ɵɵelement(29, "i", 119);
|
|
487
491
|
i0.ɵɵelementEnd();
|
|
488
|
-
i0.ɵɵelementStart(30, "button",
|
|
489
|
-
i0.ɵɵlistener("click", function
|
|
490
|
-
i0.ɵɵelement(31, "i",
|
|
492
|
+
i0.ɵɵelementStart(30, "button", 120);
|
|
493
|
+
i0.ɵɵlistener("click", function FileGridComponent_Conditional_8_Template_button_click_30_listener() { i0.ɵɵrestoreView(_r17); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.viewMode = "grid"); });
|
|
494
|
+
i0.ɵɵelement(31, "i", 121);
|
|
491
495
|
i0.ɵɵelementEnd()();
|
|
492
|
-
i0.ɵɵelementStart(32, "span",
|
|
496
|
+
i0.ɵɵelementStart(32, "span", 122);
|
|
493
497
|
i0.ɵɵtext(33);
|
|
494
498
|
i0.ɵɵelementEnd()()();
|
|
495
499
|
} if (rf & 2) {
|
|
@@ -514,24 +518,24 @@ function FileGridComponent_div_8_Template(rf, ctx) { if (rf & 1) {
|
|
|
514
518
|
i0.ɵɵadvance(3);
|
|
515
519
|
i0.ɵɵtextInterpolate2(" ", ctx_r1.filteredItems.length, " ", ctx_r1.filteredItems.length === 1 ? "item" : "filteredItems", " ");
|
|
516
520
|
} }
|
|
517
|
-
function
|
|
518
|
-
i0.ɵɵelementStart(0, "div",
|
|
519
|
-
i0.ɵɵelement(3, "i",
|
|
521
|
+
function FileGridComponent_Conditional_9_Template(rf, ctx) { if (rf & 1) {
|
|
522
|
+
i0.ɵɵelementStart(0, "div", 9)(1, "div", 123)(2, "div", 124);
|
|
523
|
+
i0.ɵɵelement(3, "i", 113);
|
|
520
524
|
i0.ɵɵelementEnd();
|
|
521
|
-
i0.ɵɵelementStart(4, "h2",
|
|
525
|
+
i0.ɵɵelementStart(4, "h2", 125);
|
|
522
526
|
i0.ɵɵtext(5, "Drop files to upload");
|
|
523
527
|
i0.ɵɵelementEnd()()();
|
|
524
528
|
} }
|
|
525
|
-
function
|
|
526
|
-
i0.ɵɵelementStart(0, "div",
|
|
527
|
-
i0.ɵɵelement(3, "i",
|
|
529
|
+
function FileGridComponent_Conditional_10_Template(rf, ctx) { if (rf & 1) {
|
|
530
|
+
i0.ɵɵelementStart(0, "div", 10)(1, "div", 126)(2, "div", 127);
|
|
531
|
+
i0.ɵɵelement(3, "i", 38);
|
|
528
532
|
i0.ɵɵelementStart(4, "span");
|
|
529
533
|
i0.ɵɵtext(5);
|
|
530
534
|
i0.ɵɵelementEnd()();
|
|
531
|
-
i0.ɵɵelementStart(6, "div",
|
|
532
|
-
i0.ɵɵelement(7, "div",
|
|
535
|
+
i0.ɵɵelementStart(6, "div", 128);
|
|
536
|
+
i0.ɵɵelement(7, "div", 129);
|
|
533
537
|
i0.ɵɵelementEnd();
|
|
534
|
-
i0.ɵɵelementStart(8, "span",
|
|
538
|
+
i0.ɵɵelementStart(8, "span", 130);
|
|
535
539
|
i0.ɵɵtext(9);
|
|
536
540
|
i0.ɵɵelementEnd()()();
|
|
537
541
|
} if (rf & 2) {
|
|
@@ -543,36 +547,36 @@ function FileGridComponent_div_10_Template(rf, ctx) { if (rf & 1) {
|
|
|
543
547
|
i0.ɵɵadvance(2);
|
|
544
548
|
i0.ɵɵtextInterpolate1("", ctx_r1.uploadProgress, "%");
|
|
545
549
|
} }
|
|
546
|
-
function
|
|
547
|
-
i0.ɵɵelement(0, "i",
|
|
550
|
+
function FileGridComponent_Conditional_11_Conditional_15_Template(rf, ctx) { if (rf & 1) {
|
|
551
|
+
i0.ɵɵelement(0, "i", 38);
|
|
548
552
|
} }
|
|
549
|
-
function
|
|
553
|
+
function FileGridComponent_Conditional_11_Template(rf, ctx) { if (rf & 1) {
|
|
550
554
|
const _r18 = i0.ɵɵgetCurrentView();
|
|
551
|
-
i0.ɵɵelementStart(0, "div",
|
|
552
|
-
i0.ɵɵlistener("click", function
|
|
553
|
-
i0.ɵɵelementStart(1, "div",
|
|
554
|
-
i0.ɵɵlistener("click", function
|
|
555
|
-
i0.ɵɵelementStart(2, "div",
|
|
555
|
+
i0.ɵɵelementStart(0, "div", 131);
|
|
556
|
+
i0.ɵɵlistener("click", function FileGridComponent_Conditional_11_Template_div_click_0_listener() { i0.ɵɵrestoreView(_r18); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onCancelNewFolder()); });
|
|
557
|
+
i0.ɵɵelementStart(1, "div", 132);
|
|
558
|
+
i0.ɵɵlistener("click", function FileGridComponent_Conditional_11_Template_div_click_1_listener($event) { i0.ɵɵrestoreView(_r18); return i0.ɵɵresetView($event.stopPropagation()); });
|
|
559
|
+
i0.ɵɵelementStart(2, "div", 133)(3, "h3");
|
|
556
560
|
i0.ɵɵtext(4, "Create New Folder");
|
|
557
561
|
i0.ɵɵelementEnd();
|
|
558
|
-
i0.ɵɵelementStart(5, "button",
|
|
559
|
-
i0.ɵɵlistener("click", function
|
|
560
|
-
i0.ɵɵelement(6, "i",
|
|
562
|
+
i0.ɵɵelementStart(5, "button", 134);
|
|
563
|
+
i0.ɵɵlistener("click", function FileGridComponent_Conditional_11_Template_button_click_5_listener() { i0.ɵɵrestoreView(_r18); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onCancelNewFolder()); });
|
|
564
|
+
i0.ɵɵelement(6, "i", 30);
|
|
561
565
|
i0.ɵɵelementEnd()();
|
|
562
|
-
i0.ɵɵelementStart(7, "div",
|
|
566
|
+
i0.ɵɵelementStart(7, "div", 135)(8, "label");
|
|
563
567
|
i0.ɵɵtext(9, "Folder name:");
|
|
564
568
|
i0.ɵɵelementEnd();
|
|
565
|
-
i0.ɵɵelementStart(10, "input",
|
|
566
|
-
i0.ɵɵtwoWayListener("ngModelChange", function
|
|
567
|
-
i0.ɵɵlistener("keydown.enter", function
|
|
569
|
+
i0.ɵɵelementStart(10, "input", 136);
|
|
570
|
+
i0.ɵɵtwoWayListener("ngModelChange", function FileGridComponent_Conditional_11_Template_input_ngModelChange_10_listener($event) { i0.ɵɵrestoreView(_r18); const ctx_r1 = i0.ɵɵnextContext(); i0.ɵɵtwoWayBindingSet(ctx_r1.newFolderName, $event) || (ctx_r1.newFolderName = $event); return i0.ɵɵresetView($event); });
|
|
571
|
+
i0.ɵɵlistener("keydown.enter", function FileGridComponent_Conditional_11_Template_input_keydown_enter_10_listener() { i0.ɵɵrestoreView(_r18); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onCreateFolder()); });
|
|
568
572
|
i0.ɵɵelementEnd()();
|
|
569
|
-
i0.ɵɵelementStart(11, "div",
|
|
570
|
-
i0.ɵɵlistener("click", function
|
|
573
|
+
i0.ɵɵelementStart(11, "div", 137)(12, "button", 138);
|
|
574
|
+
i0.ɵɵlistener("click", function FileGridComponent_Conditional_11_Template_button_click_12_listener() { i0.ɵɵrestoreView(_r18); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onCancelNewFolder()); });
|
|
571
575
|
i0.ɵɵtext(13, "Cancel");
|
|
572
576
|
i0.ɵɵelementEnd();
|
|
573
|
-
i0.ɵɵelementStart(14, "button",
|
|
574
|
-
i0.ɵɵlistener("click", function
|
|
575
|
-
i0.ɵɵ
|
|
577
|
+
i0.ɵɵelementStart(14, "button", 138);
|
|
578
|
+
i0.ɵɵlistener("click", function FileGridComponent_Conditional_11_Template_button_click_14_listener() { i0.ɵɵrestoreView(_r18); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onCreateFolder()); });
|
|
579
|
+
i0.ɵɵconditionalCreate(15, FileGridComponent_Conditional_11_Conditional_15_Template, 1, 0, "i", 38);
|
|
576
580
|
i0.ɵɵtext(16);
|
|
577
581
|
i0.ɵɵelementEnd()()()();
|
|
578
582
|
} if (rf & 2) {
|
|
@@ -585,47 +589,47 @@ function FileGridComponent_div_11_Template(rf, ctx) { if (rf & 1) {
|
|
|
585
589
|
i0.ɵɵadvance(2);
|
|
586
590
|
i0.ɵɵproperty("disabled", !ctx_r1.newFolderName.trim() || ctx_r1.isCreatingFolder);
|
|
587
591
|
i0.ɵɵadvance();
|
|
588
|
-
i0.ɵɵ
|
|
592
|
+
i0.ɵɵconditional(ctx_r1.isCreatingFolder ? 15 : -1);
|
|
589
593
|
i0.ɵɵadvance();
|
|
590
594
|
i0.ɵɵtextInterpolate1(" ", ctx_r1.isCreatingFolder ? "Creating..." : "Create", " ");
|
|
591
595
|
} }
|
|
592
|
-
function
|
|
593
|
-
i0.ɵɵelementStart(0, "p",
|
|
596
|
+
function FileGridComponent_Conditional_12_Conditional_13_Template(rf, ctx) { if (rf & 1) {
|
|
597
|
+
i0.ɵɵelementStart(0, "p", 139);
|
|
594
598
|
i0.ɵɵtext(1, "This will delete the folder and all its contents.");
|
|
595
599
|
i0.ɵɵelementEnd();
|
|
596
600
|
} }
|
|
597
|
-
function
|
|
598
|
-
i0.ɵɵelement(0, "i",
|
|
601
|
+
function FileGridComponent_Conditional_12_Conditional_18_Template(rf, ctx) { if (rf & 1) {
|
|
602
|
+
i0.ɵɵelement(0, "i", 38);
|
|
599
603
|
} }
|
|
600
|
-
function
|
|
604
|
+
function FileGridComponent_Conditional_12_Template(rf, ctx) { if (rf & 1) {
|
|
601
605
|
const _r19 = i0.ɵɵgetCurrentView();
|
|
602
|
-
i0.ɵɵelementStart(0, "div",
|
|
603
|
-
i0.ɵɵlistener("click", function
|
|
604
|
-
i0.ɵɵelementStart(1, "div",
|
|
605
|
-
i0.ɵɵlistener("click", function
|
|
606
|
-
i0.ɵɵelementStart(2, "div",
|
|
606
|
+
i0.ɵɵelementStart(0, "div", 131);
|
|
607
|
+
i0.ɵɵlistener("click", function FileGridComponent_Conditional_12_Template_div_click_0_listener() { i0.ɵɵrestoreView(_r19); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onCancelDelete()); });
|
|
608
|
+
i0.ɵɵelementStart(1, "div", 132);
|
|
609
|
+
i0.ɵɵlistener("click", function FileGridComponent_Conditional_12_Template_div_click_1_listener($event) { i0.ɵɵrestoreView(_r19); return i0.ɵɵresetView($event.stopPropagation()); });
|
|
610
|
+
i0.ɵɵelementStart(2, "div", 133)(3, "h3");
|
|
607
611
|
i0.ɵɵtext(4);
|
|
608
612
|
i0.ɵɵelementEnd();
|
|
609
|
-
i0.ɵɵelementStart(5, "button",
|
|
610
|
-
i0.ɵɵlistener("click", function
|
|
611
|
-
i0.ɵɵelement(6, "i",
|
|
613
|
+
i0.ɵɵelementStart(5, "button", 134);
|
|
614
|
+
i0.ɵɵlistener("click", function FileGridComponent_Conditional_12_Template_button_click_5_listener() { i0.ɵɵrestoreView(_r19); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onCancelDelete()); });
|
|
615
|
+
i0.ɵɵelement(6, "i", 30);
|
|
612
616
|
i0.ɵɵelementEnd()();
|
|
613
|
-
i0.ɵɵelementStart(7, "div",
|
|
617
|
+
i0.ɵɵelementStart(7, "div", 135)(8, "p");
|
|
614
618
|
i0.ɵɵtext(9, "Are you sure you want to delete ");
|
|
615
619
|
i0.ɵɵelementStart(10, "strong");
|
|
616
620
|
i0.ɵɵtext(11);
|
|
617
621
|
i0.ɵɵelementEnd();
|
|
618
622
|
i0.ɵɵtext(12, "?");
|
|
619
623
|
i0.ɵɵelementEnd();
|
|
620
|
-
i0.ɵɵ
|
|
624
|
+
i0.ɵɵconditionalCreate(13, FileGridComponent_Conditional_12_Conditional_13_Template, 2, 0, "p", 139);
|
|
621
625
|
i0.ɵɵelementEnd();
|
|
622
|
-
i0.ɵɵelementStart(14, "div",
|
|
623
|
-
i0.ɵɵlistener("click", function
|
|
626
|
+
i0.ɵɵelementStart(14, "div", 137)(15, "button", 138);
|
|
627
|
+
i0.ɵɵlistener("click", function FileGridComponent_Conditional_12_Template_button_click_15_listener() { i0.ɵɵrestoreView(_r19); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onCancelDelete()); });
|
|
624
628
|
i0.ɵɵtext(16, "Cancel");
|
|
625
629
|
i0.ɵɵelementEnd();
|
|
626
|
-
i0.ɵɵelementStart(17, "button",
|
|
627
|
-
i0.ɵɵlistener("click", function
|
|
628
|
-
i0.ɵɵ
|
|
630
|
+
i0.ɵɵelementStart(17, "button", 140);
|
|
631
|
+
i0.ɵɵlistener("click", function FileGridComponent_Conditional_12_Template_button_click_17_listener() { i0.ɵɵrestoreView(_r19); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onConfirmDelete()); });
|
|
632
|
+
i0.ɵɵconditionalCreate(18, FileGridComponent_Conditional_12_Conditional_18_Template, 1, 0, "i", 38);
|
|
629
633
|
i0.ɵɵtext(19);
|
|
630
634
|
i0.ɵɵelementEnd()()()();
|
|
631
635
|
} if (rf & 2) {
|
|
@@ -635,52 +639,52 @@ function FileGridComponent_div_12_Template(rf, ctx) { if (rf & 1) {
|
|
|
635
639
|
i0.ɵɵadvance(7);
|
|
636
640
|
i0.ɵɵtextInterpolate(ctx_r1.itemToDelete.name);
|
|
637
641
|
i0.ɵɵadvance(2);
|
|
638
|
-
i0.ɵɵ
|
|
642
|
+
i0.ɵɵconditional(ctx_r1.itemToDelete.type === "folder" ? 13 : -1);
|
|
639
643
|
i0.ɵɵadvance(2);
|
|
640
644
|
i0.ɵɵproperty("disabled", ctx_r1.isDeleting);
|
|
641
645
|
i0.ɵɵadvance(2);
|
|
642
646
|
i0.ɵɵproperty("disabled", ctx_r1.isDeleting);
|
|
643
647
|
i0.ɵɵadvance();
|
|
644
|
-
i0.ɵɵ
|
|
648
|
+
i0.ɵɵconditional(ctx_r1.isDeleting ? 18 : -1);
|
|
645
649
|
i0.ɵɵadvance();
|
|
646
650
|
i0.ɵɵtextInterpolate1(" ", ctx_r1.isDeleting ? "Deleting..." : "Delete", " ");
|
|
647
651
|
} }
|
|
648
|
-
function
|
|
649
|
-
i0.ɵɵelement(0, "i",
|
|
652
|
+
function FileGridComponent_Conditional_13_Conditional_15_Template(rf, ctx) { if (rf & 1) {
|
|
653
|
+
i0.ɵɵelement(0, "i", 38);
|
|
650
654
|
} }
|
|
651
|
-
function
|
|
655
|
+
function FileGridComponent_Conditional_13_Template(rf, ctx) { if (rf & 1) {
|
|
652
656
|
const _r20 = i0.ɵɵgetCurrentView();
|
|
653
|
-
i0.ɵɵelementStart(0, "div",
|
|
654
|
-
i0.ɵɵlistener("click", function
|
|
655
|
-
i0.ɵɵelementStart(1, "div",
|
|
656
|
-
i0.ɵɵlistener("click", function
|
|
657
|
-
i0.ɵɵelementStart(2, "div",
|
|
657
|
+
i0.ɵɵelementStart(0, "div", 131);
|
|
658
|
+
i0.ɵɵlistener("click", function FileGridComponent_Conditional_13_Template_div_click_0_listener() { i0.ɵɵrestoreView(_r20); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onCancelRename()); });
|
|
659
|
+
i0.ɵɵelementStart(1, "div", 132);
|
|
660
|
+
i0.ɵɵlistener("click", function FileGridComponent_Conditional_13_Template_div_click_1_listener($event) { i0.ɵɵrestoreView(_r20); return i0.ɵɵresetView($event.stopPropagation()); });
|
|
661
|
+
i0.ɵɵelementStart(2, "div", 133)(3, "h3");
|
|
658
662
|
i0.ɵɵtext(4);
|
|
659
663
|
i0.ɵɵelementEnd();
|
|
660
|
-
i0.ɵɵelementStart(5, "button",
|
|
661
|
-
i0.ɵɵlistener("click", function
|
|
662
|
-
i0.ɵɵelement(6, "i",
|
|
664
|
+
i0.ɵɵelementStart(5, "button", 134);
|
|
665
|
+
i0.ɵɵlistener("click", function FileGridComponent_Conditional_13_Template_button_click_5_listener() { i0.ɵɵrestoreView(_r20); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onCancelRename()); });
|
|
666
|
+
i0.ɵɵelement(6, "i", 30);
|
|
663
667
|
i0.ɵɵelementEnd()();
|
|
664
|
-
i0.ɵɵelementStart(7, "div",
|
|
668
|
+
i0.ɵɵelementStart(7, "div", 135)(8, "label");
|
|
665
669
|
i0.ɵɵtext(9, "New name:");
|
|
666
670
|
i0.ɵɵelementEnd();
|
|
667
|
-
i0.ɵɵelementStart(10, "input",
|
|
668
|
-
i0.ɵɵtwoWayListener("ngModelChange", function
|
|
669
|
-
i0.ɵɵlistener("keydown.enter", function
|
|
671
|
+
i0.ɵɵelementStart(10, "input", 141);
|
|
672
|
+
i0.ɵɵtwoWayListener("ngModelChange", function FileGridComponent_Conditional_13_Template_input_ngModelChange_10_listener($event) { i0.ɵɵrestoreView(_r20); const ctx_r1 = i0.ɵɵnextContext(); i0.ɵɵtwoWayBindingSet(ctx_r1.newItemName, $event) || (ctx_r1.newItemName = $event); return i0.ɵɵresetView($event); });
|
|
673
|
+
i0.ɵɵlistener("keydown.enter", function FileGridComponent_Conditional_13_Template_input_keydown_enter_10_listener() { i0.ɵɵrestoreView(_r20); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onConfirmRename()); });
|
|
670
674
|
i0.ɵɵelementEnd()();
|
|
671
|
-
i0.ɵɵelementStart(11, "div",
|
|
672
|
-
i0.ɵɵlistener("click", function
|
|
675
|
+
i0.ɵɵelementStart(11, "div", 137)(12, "button", 138);
|
|
676
|
+
i0.ɵɵlistener("click", function FileGridComponent_Conditional_13_Template_button_click_12_listener() { i0.ɵɵrestoreView(_r20); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onCancelRename()); });
|
|
673
677
|
i0.ɵɵtext(13, "Cancel");
|
|
674
678
|
i0.ɵɵelementEnd();
|
|
675
|
-
i0.ɵɵelementStart(14, "button",
|
|
676
|
-
i0.ɵɵlistener("click", function
|
|
677
|
-
i0.ɵɵ
|
|
679
|
+
i0.ɵɵelementStart(14, "button", 138);
|
|
680
|
+
i0.ɵɵlistener("click", function FileGridComponent_Conditional_13_Template_button_click_14_listener() { i0.ɵɵrestoreView(_r20); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onConfirmRename()); });
|
|
681
|
+
i0.ɵɵconditionalCreate(15, FileGridComponent_Conditional_13_Conditional_15_Template, 1, 0, "i", 38);
|
|
678
682
|
i0.ɵɵtext(16);
|
|
679
683
|
i0.ɵɵelementEnd()()()();
|
|
680
684
|
} if (rf & 2) {
|
|
681
685
|
const ctx_r1 = i0.ɵɵnextContext();
|
|
682
686
|
i0.ɵɵadvance(4);
|
|
683
|
-
i0.ɵɵtextInterpolate1("Rename ", ctx_r1.itemToRename.type === "folder" ? "Folder" : "File"
|
|
687
|
+
i0.ɵɵtextInterpolate1("Rename ", ctx_r1.itemToRename.type === "folder" ? "Folder" : "File");
|
|
684
688
|
i0.ɵɵadvance(6);
|
|
685
689
|
i0.ɵɵtwoWayProperty("ngModel", ctx_r1.newItemName);
|
|
686
690
|
i0.ɵɵproperty("disabled", ctx_r1.isRenaming);
|
|
@@ -689,27 +693,27 @@ function FileGridComponent_div_13_Template(rf, ctx) { if (rf & 1) {
|
|
|
689
693
|
i0.ɵɵadvance(2);
|
|
690
694
|
i0.ɵɵproperty("disabled", ctx_r1.isRenaming || !ctx_r1.newItemName.trim());
|
|
691
695
|
i0.ɵɵadvance();
|
|
692
|
-
i0.ɵɵ
|
|
696
|
+
i0.ɵɵconditional(ctx_r1.isRenaming ? 15 : -1);
|
|
693
697
|
i0.ɵɵadvance();
|
|
694
698
|
i0.ɵɵtextInterpolate1(" ", ctx_r1.isRenaming ? "Renaming..." : "Rename", " ");
|
|
695
699
|
} }
|
|
696
|
-
function
|
|
697
|
-
i0.ɵɵelement(0, "i",
|
|
700
|
+
function FileGridComponent_Conditional_14_Conditional_19_Template(rf, ctx) { if (rf & 1) {
|
|
701
|
+
i0.ɵɵelement(0, "i", 38);
|
|
698
702
|
} }
|
|
699
|
-
function
|
|
703
|
+
function FileGridComponent_Conditional_14_Template(rf, ctx) { if (rf & 1) {
|
|
700
704
|
const _r21 = i0.ɵɵgetCurrentView();
|
|
701
|
-
i0.ɵɵelementStart(0, "div",
|
|
702
|
-
i0.ɵɵlistener("click", function
|
|
703
|
-
i0.ɵɵelementStart(1, "div",
|
|
704
|
-
i0.ɵɵlistener("click", function
|
|
705
|
-
i0.ɵɵelementStart(2, "div",
|
|
705
|
+
i0.ɵɵelementStart(0, "div", 131);
|
|
706
|
+
i0.ɵɵlistener("click", function FileGridComponent_Conditional_14_Template_div_click_0_listener() { i0.ɵɵrestoreView(_r21); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onCancelCopy()); });
|
|
707
|
+
i0.ɵɵelementStart(1, "div", 132);
|
|
708
|
+
i0.ɵɵlistener("click", function FileGridComponent_Conditional_14_Template_div_click_1_listener($event) { i0.ɵɵrestoreView(_r21); return i0.ɵɵresetView($event.stopPropagation()); });
|
|
709
|
+
i0.ɵɵelementStart(2, "div", 133)(3, "h3");
|
|
706
710
|
i0.ɵɵtext(4);
|
|
707
711
|
i0.ɵɵelementEnd();
|
|
708
|
-
i0.ɵɵelementStart(5, "button",
|
|
709
|
-
i0.ɵɵlistener("click", function
|
|
710
|
-
i0.ɵɵelement(6, "i",
|
|
712
|
+
i0.ɵɵelementStart(5, "button", 134);
|
|
713
|
+
i0.ɵɵlistener("click", function FileGridComponent_Conditional_14_Template_button_click_5_listener() { i0.ɵɵrestoreView(_r21); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onCancelCopy()); });
|
|
714
|
+
i0.ɵɵelement(6, "i", 30);
|
|
711
715
|
i0.ɵɵelementEnd()();
|
|
712
|
-
i0.ɵɵelementStart(7, "div",
|
|
716
|
+
i0.ɵɵelementStart(7, "div", 135)(8, "p");
|
|
713
717
|
i0.ɵɵtext(9, "Copying: ");
|
|
714
718
|
i0.ɵɵelementStart(10, "strong");
|
|
715
719
|
i0.ɵɵtext(11);
|
|
@@ -717,23 +721,23 @@ function FileGridComponent_div_14_Template(rf, ctx) { if (rf & 1) {
|
|
|
717
721
|
i0.ɵɵelementStart(12, "label");
|
|
718
722
|
i0.ɵɵtext(13, "Destination path:");
|
|
719
723
|
i0.ɵɵelementEnd();
|
|
720
|
-
i0.ɵɵelementStart(14, "input",
|
|
721
|
-
i0.ɵɵtwoWayListener("ngModelChange", function
|
|
722
|
-
i0.ɵɵlistener("keydown.enter", function
|
|
724
|
+
i0.ɵɵelementStart(14, "input", 142);
|
|
725
|
+
i0.ɵɵtwoWayListener("ngModelChange", function FileGridComponent_Conditional_14_Template_input_ngModelChange_14_listener($event) { i0.ɵɵrestoreView(_r21); const ctx_r1 = i0.ɵɵnextContext(); i0.ɵɵtwoWayBindingSet(ctx_r1.copyDestinationPath, $event) || (ctx_r1.copyDestinationPath = $event); return i0.ɵɵresetView($event); });
|
|
726
|
+
i0.ɵɵlistener("keydown.enter", function FileGridComponent_Conditional_14_Template_input_keydown_enter_14_listener() { i0.ɵɵrestoreView(_r21); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onConfirmCopy()); });
|
|
723
727
|
i0.ɵɵelementEnd()();
|
|
724
|
-
i0.ɵɵelementStart(15, "div",
|
|
725
|
-
i0.ɵɵlistener("click", function
|
|
728
|
+
i0.ɵɵelementStart(15, "div", 137)(16, "button", 138);
|
|
729
|
+
i0.ɵɵlistener("click", function FileGridComponent_Conditional_14_Template_button_click_16_listener() { i0.ɵɵrestoreView(_r21); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onCancelCopy()); });
|
|
726
730
|
i0.ɵɵtext(17, "Cancel");
|
|
727
731
|
i0.ɵɵelementEnd();
|
|
728
|
-
i0.ɵɵelementStart(18, "button",
|
|
729
|
-
i0.ɵɵlistener("click", function
|
|
730
|
-
i0.ɵɵ
|
|
732
|
+
i0.ɵɵelementStart(18, "button", 138);
|
|
733
|
+
i0.ɵɵlistener("click", function FileGridComponent_Conditional_14_Template_button_click_18_listener() { i0.ɵɵrestoreView(_r21); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onConfirmCopy()); });
|
|
734
|
+
i0.ɵɵconditionalCreate(19, FileGridComponent_Conditional_14_Conditional_19_Template, 1, 0, "i", 38);
|
|
731
735
|
i0.ɵɵtext(20);
|
|
732
736
|
i0.ɵɵelementEnd()()()();
|
|
733
737
|
} if (rf & 2) {
|
|
734
738
|
const ctx_r1 = i0.ɵɵnextContext();
|
|
735
739
|
i0.ɵɵadvance(4);
|
|
736
|
-
i0.ɵɵtextInterpolate1("Copy ", ctx_r1.itemToCopy.type === "folder" ? "Folder" : "File"
|
|
740
|
+
i0.ɵɵtextInterpolate1("Copy ", ctx_r1.itemToCopy.type === "folder" ? "Folder" : "File");
|
|
737
741
|
i0.ɵɵadvance(7);
|
|
738
742
|
i0.ɵɵtextInterpolate(ctx_r1.itemToCopy.name);
|
|
739
743
|
i0.ɵɵadvance(3);
|
|
@@ -744,27 +748,27 @@ function FileGridComponent_div_14_Template(rf, ctx) { if (rf & 1) {
|
|
|
744
748
|
i0.ɵɵadvance(2);
|
|
745
749
|
i0.ɵɵproperty("disabled", ctx_r1.isCopying || !ctx_r1.copyDestinationPath.trim());
|
|
746
750
|
i0.ɵɵadvance();
|
|
747
|
-
i0.ɵɵ
|
|
751
|
+
i0.ɵɵconditional(ctx_r1.isCopying ? 19 : -1);
|
|
748
752
|
i0.ɵɵadvance();
|
|
749
753
|
i0.ɵɵtextInterpolate1(" ", ctx_r1.isCopying ? "Copying..." : "Copy", " ");
|
|
750
754
|
} }
|
|
751
|
-
function
|
|
752
|
-
i0.ɵɵelement(0, "i",
|
|
755
|
+
function FileGridComponent_Conditional_15_Conditional_21_Template(rf, ctx) { if (rf & 1) {
|
|
756
|
+
i0.ɵɵelement(0, "i", 38);
|
|
753
757
|
} }
|
|
754
|
-
function
|
|
758
|
+
function FileGridComponent_Conditional_15_Template(rf, ctx) { if (rf & 1) {
|
|
755
759
|
const _r22 = i0.ɵɵgetCurrentView();
|
|
756
|
-
i0.ɵɵelementStart(0, "div",
|
|
757
|
-
i0.ɵɵlistener("click", function
|
|
758
|
-
i0.ɵɵelementStart(1, "div",
|
|
759
|
-
i0.ɵɵlistener("click", function
|
|
760
|
-
i0.ɵɵelementStart(2, "div",
|
|
760
|
+
i0.ɵɵelementStart(0, "div", 131);
|
|
761
|
+
i0.ɵɵlistener("click", function FileGridComponent_Conditional_15_Template_div_click_0_listener() { i0.ɵɵrestoreView(_r22); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onCancelMove()); });
|
|
762
|
+
i0.ɵɵelementStart(1, "div", 132);
|
|
763
|
+
i0.ɵɵlistener("click", function FileGridComponent_Conditional_15_Template_div_click_1_listener($event) { i0.ɵɵrestoreView(_r22); return i0.ɵɵresetView($event.stopPropagation()); });
|
|
764
|
+
i0.ɵɵelementStart(2, "div", 133)(3, "h3");
|
|
761
765
|
i0.ɵɵtext(4);
|
|
762
766
|
i0.ɵɵelementEnd();
|
|
763
|
-
i0.ɵɵelementStart(5, "button",
|
|
764
|
-
i0.ɵɵlistener("click", function
|
|
765
|
-
i0.ɵɵelement(6, "i",
|
|
767
|
+
i0.ɵɵelementStart(5, "button", 134);
|
|
768
|
+
i0.ɵɵlistener("click", function FileGridComponent_Conditional_15_Template_button_click_5_listener() { i0.ɵɵrestoreView(_r22); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onCancelMove()); });
|
|
769
|
+
i0.ɵɵelement(6, "i", 30);
|
|
766
770
|
i0.ɵɵelementEnd()();
|
|
767
|
-
i0.ɵɵelementStart(7, "div",
|
|
771
|
+
i0.ɵɵelementStart(7, "div", 135)(8, "p");
|
|
768
772
|
i0.ɵɵtext(9, "Moving: ");
|
|
769
773
|
i0.ɵɵelementStart(10, "strong");
|
|
770
774
|
i0.ɵɵtext(11);
|
|
@@ -772,26 +776,26 @@ function FileGridComponent_div_15_Template(rf, ctx) { if (rf & 1) {
|
|
|
772
776
|
i0.ɵɵelementStart(12, "label");
|
|
773
777
|
i0.ɵɵtext(13, "Destination folder path:");
|
|
774
778
|
i0.ɵɵelementEnd();
|
|
775
|
-
i0.ɵɵelementStart(14, "input",
|
|
776
|
-
i0.ɵɵtwoWayListener("ngModelChange", function
|
|
777
|
-
i0.ɵɵlistener("keydown.enter", function
|
|
779
|
+
i0.ɵɵelementStart(14, "input", 143);
|
|
780
|
+
i0.ɵɵtwoWayListener("ngModelChange", function FileGridComponent_Conditional_15_Template_input_ngModelChange_14_listener($event) { i0.ɵɵrestoreView(_r22); const ctx_r1 = i0.ɵɵnextContext(); i0.ɵɵtwoWayBindingSet(ctx_r1.moveDestinationPath, $event) || (ctx_r1.moveDestinationPath = $event); return i0.ɵɵresetView($event); });
|
|
781
|
+
i0.ɵɵlistener("keydown.enter", function FileGridComponent_Conditional_15_Template_input_keydown_enter_14_listener() { i0.ɵɵrestoreView(_r22); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onConfirmMove()); });
|
|
778
782
|
i0.ɵɵelementEnd();
|
|
779
|
-
i0.ɵɵelementStart(15, "p",
|
|
783
|
+
i0.ɵɵelementStart(15, "p", 144);
|
|
780
784
|
i0.ɵɵtext(16);
|
|
781
785
|
i0.ɵɵelementEnd()();
|
|
782
|
-
i0.ɵɵelementStart(17, "div",
|
|
783
|
-
i0.ɵɵlistener("click", function
|
|
786
|
+
i0.ɵɵelementStart(17, "div", 137)(18, "button", 138);
|
|
787
|
+
i0.ɵɵlistener("click", function FileGridComponent_Conditional_15_Template_button_click_18_listener() { i0.ɵɵrestoreView(_r22); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onCancelMove()); });
|
|
784
788
|
i0.ɵɵtext(19, "Cancel");
|
|
785
789
|
i0.ɵɵelementEnd();
|
|
786
|
-
i0.ɵɵelementStart(20, "button",
|
|
787
|
-
i0.ɵɵlistener("click", function
|
|
788
|
-
i0.ɵɵ
|
|
790
|
+
i0.ɵɵelementStart(20, "button", 138);
|
|
791
|
+
i0.ɵɵlistener("click", function FileGridComponent_Conditional_15_Template_button_click_20_listener() { i0.ɵɵrestoreView(_r22); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onConfirmMove()); });
|
|
792
|
+
i0.ɵɵconditionalCreate(21, FileGridComponent_Conditional_15_Conditional_21_Template, 1, 0, "i", 38);
|
|
789
793
|
i0.ɵɵtext(22);
|
|
790
794
|
i0.ɵɵelementEnd()()()();
|
|
791
795
|
} if (rf & 2) {
|
|
792
796
|
const ctx_r1 = i0.ɵɵnextContext();
|
|
793
797
|
i0.ɵɵadvance(4);
|
|
794
|
-
i0.ɵɵtextInterpolate1("Move ", ctx_r1.itemToMove.type === "folder" ? "Folder" : "File"
|
|
798
|
+
i0.ɵɵtextInterpolate1("Move ", ctx_r1.itemToMove.type === "folder" ? "Folder" : "File");
|
|
795
799
|
i0.ɵɵadvance(7);
|
|
796
800
|
i0.ɵɵtextInterpolate(ctx_r1.itemToMove.name);
|
|
797
801
|
i0.ɵɵadvance(3);
|
|
@@ -804,18 +808,18 @@ function FileGridComponent_div_15_Template(rf, ctx) { if (rf & 1) {
|
|
|
804
808
|
i0.ɵɵadvance(2);
|
|
805
809
|
i0.ɵɵproperty("disabled", ctx_r1.isMoving || !ctx_r1.moveDestinationPath.trim());
|
|
806
810
|
i0.ɵɵadvance();
|
|
807
|
-
i0.ɵɵ
|
|
811
|
+
i0.ɵɵconditional(ctx_r1.isMoving ? 21 : -1);
|
|
808
812
|
i0.ɵɵadvance();
|
|
809
813
|
i0.ɵɵtextInterpolate1(" ", ctx_r1.isMoving ? "Moving..." : "Move", " ");
|
|
810
814
|
} }
|
|
811
|
-
function
|
|
815
|
+
function FileGridComponent_Conditional_16_For_20_Template(rf, ctx) { if (rf & 1) {
|
|
812
816
|
const _r24 = i0.ɵɵgetCurrentView();
|
|
813
|
-
i0.ɵɵelementStart(0, "div",
|
|
814
|
-
i0.ɵɵlistener("change", function
|
|
817
|
+
i0.ɵɵelementStart(0, "div", 147)(1, "input", 151);
|
|
818
|
+
i0.ɵɵlistener("change", function FileGridComponent_Conditional_16_For_20_Template_input_change_1_listener() { const a_r25 = i0.ɵɵrestoreView(_r24).$implicit; const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.toggleDestinationAccount(a_r25.account.ID)); });
|
|
815
819
|
i0.ɵɵelementEnd();
|
|
816
|
-
i0.ɵɵelementStart(2, "label",
|
|
820
|
+
i0.ɵɵelementStart(2, "label", 152);
|
|
817
821
|
i0.ɵɵtext(3);
|
|
818
|
-
i0.ɵɵelementStart(4, "span",
|
|
822
|
+
i0.ɵɵelementStart(4, "span", 153);
|
|
819
823
|
i0.ɵɵtext(5);
|
|
820
824
|
i0.ɵɵelementEnd()()();
|
|
821
825
|
} if (rf & 2) {
|
|
@@ -830,9 +834,9 @@ function FileGridComponent_div_16_div_19_Template(rf, ctx) { if (rf & 1) {
|
|
|
830
834
|
i0.ɵɵadvance(2);
|
|
831
835
|
i0.ɵɵtextInterpolate(a_r25.provider.Name);
|
|
832
836
|
} }
|
|
833
|
-
function
|
|
834
|
-
i0.ɵɵelementStart(0, "div",
|
|
835
|
-
i0.ɵɵelement(1, "i",
|
|
837
|
+
function FileGridComponent_Conditional_16_Conditional_24_Template(rf, ctx) { if (rf & 1) {
|
|
838
|
+
i0.ɵɵelementStart(0, "div", 150);
|
|
839
|
+
i0.ɵɵelement(1, "i", 38);
|
|
836
840
|
i0.ɵɵtext(2);
|
|
837
841
|
i0.ɵɵelementEnd();
|
|
838
842
|
} if (rf & 2) {
|
|
@@ -840,28 +844,28 @@ function FileGridComponent_div_16_div_23_Template(rf, ctx) { if (rf & 1) {
|
|
|
840
844
|
i0.ɵɵadvance(2);
|
|
841
845
|
i0.ɵɵtextInterpolate3(" Copying to ", ctx_r1.copyToAccountProgress.currentAccount, " (", ctx_r1.copyToAccountProgress.current, "/", ctx_r1.copyToAccountProgress.total, ")... ");
|
|
842
846
|
} }
|
|
843
|
-
function
|
|
844
|
-
i0.ɵɵelement(0, "i",
|
|
847
|
+
function FileGridComponent_Conditional_16_Conditional_29_Template(rf, ctx) { if (rf & 1) {
|
|
848
|
+
i0.ɵɵelement(0, "i", 38);
|
|
845
849
|
} }
|
|
846
|
-
function
|
|
850
|
+
function FileGridComponent_Conditional_16_Template(rf, ctx) { if (rf & 1) {
|
|
847
851
|
const _r23 = i0.ɵɵgetCurrentView();
|
|
848
|
-
i0.ɵɵelementStart(0, "div",
|
|
849
|
-
i0.ɵɵlistener("click", function
|
|
850
|
-
i0.ɵɵelementStart(1, "div",
|
|
851
|
-
i0.ɵɵlistener("click", function
|
|
852
|
-
i0.ɵɵelementStart(2, "div",
|
|
852
|
+
i0.ɵɵelementStart(0, "div", 131);
|
|
853
|
+
i0.ɵɵlistener("click", function FileGridComponent_Conditional_16_Template_div_click_0_listener() { i0.ɵɵrestoreView(_r23); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onCancelCopyToAccount()); });
|
|
854
|
+
i0.ɵɵelementStart(1, "div", 132);
|
|
855
|
+
i0.ɵɵlistener("click", function FileGridComponent_Conditional_16_Template_div_click_1_listener($event) { i0.ɵɵrestoreView(_r23); return i0.ɵɵresetView($event.stopPropagation()); });
|
|
856
|
+
i0.ɵɵelementStart(2, "div", 133)(3, "h3");
|
|
853
857
|
i0.ɵɵtext(4, "Copy to Another Account");
|
|
854
858
|
i0.ɵɵelementEnd();
|
|
855
|
-
i0.ɵɵelementStart(5, "button",
|
|
856
|
-
i0.ɵɵlistener("click", function
|
|
857
|
-
i0.ɵɵelement(6, "i",
|
|
859
|
+
i0.ɵɵelementStart(5, "button", 134);
|
|
860
|
+
i0.ɵɵlistener("click", function FileGridComponent_Conditional_16_Template_button_click_5_listener() { i0.ɵɵrestoreView(_r23); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onCancelCopyToAccount()); });
|
|
861
|
+
i0.ɵɵelement(6, "i", 30);
|
|
858
862
|
i0.ɵɵelementEnd()();
|
|
859
|
-
i0.ɵɵelementStart(7, "div",
|
|
863
|
+
i0.ɵɵelementStart(7, "div", 135)(8, "p");
|
|
860
864
|
i0.ɵɵtext(9, "Copying: ");
|
|
861
865
|
i0.ɵɵelementStart(10, "strong");
|
|
862
866
|
i0.ɵɵtext(11);
|
|
863
867
|
i0.ɵɵelementEnd()();
|
|
864
|
-
i0.ɵɵelementStart(12, "p",
|
|
868
|
+
i0.ɵɵelementStart(12, "p", 145);
|
|
865
869
|
i0.ɵɵtext(13, " From: ");
|
|
866
870
|
i0.ɵɵelementStart(14, "strong");
|
|
867
871
|
i0.ɵɵtext(15);
|
|
@@ -869,26 +873,26 @@ function FileGridComponent_div_16_Template(rf, ctx) { if (rf & 1) {
|
|
|
869
873
|
i0.ɵɵelementStart(16, "label");
|
|
870
874
|
i0.ɵɵtext(17, "Select destination account(s):");
|
|
871
875
|
i0.ɵɵelementEnd();
|
|
872
|
-
i0.ɵɵelementStart(18, "div",
|
|
873
|
-
i0.ɵɵ
|
|
876
|
+
i0.ɵɵelementStart(18, "div", 146);
|
|
877
|
+
i0.ɵɵrepeaterCreate(19, FileGridComponent_Conditional_16_For_20_Template, 6, 6, "div", 147, i0.ɵɵrepeaterTrackByIdentity);
|
|
874
878
|
i0.ɵɵelementEnd();
|
|
875
|
-
i0.ɵɵelementStart(
|
|
876
|
-
i0.ɵɵtext(
|
|
879
|
+
i0.ɵɵelementStart(21, "label", 148);
|
|
880
|
+
i0.ɵɵtext(22, "Destination filename:");
|
|
877
881
|
i0.ɵɵelementEnd();
|
|
878
|
-
i0.ɵɵelementStart(
|
|
879
|
-
i0.ɵɵtwoWayListener("ngModelChange", function
|
|
880
|
-
i0.ɵɵlistener("keydown.enter", function
|
|
882
|
+
i0.ɵɵelementStart(23, "input", 149);
|
|
883
|
+
i0.ɵɵtwoWayListener("ngModelChange", function FileGridComponent_Conditional_16_Template_input_ngModelChange_23_listener($event) { i0.ɵɵrestoreView(_r23); const ctx_r1 = i0.ɵɵnextContext(); i0.ɵɵtwoWayBindingSet(ctx_r1.copyToAccountDestinationPath, $event) || (ctx_r1.copyToAccountDestinationPath = $event); return i0.ɵɵresetView($event); });
|
|
884
|
+
i0.ɵɵlistener("keydown.enter", function FileGridComponent_Conditional_16_Template_input_keydown_enter_23_listener() { i0.ɵɵrestoreView(_r23); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onConfirmCopyToAccount()); });
|
|
881
885
|
i0.ɵɵelementEnd();
|
|
882
|
-
i0.ɵɵ
|
|
886
|
+
i0.ɵɵconditionalCreate(24, FileGridComponent_Conditional_16_Conditional_24_Template, 3, 3, "div", 150);
|
|
883
887
|
i0.ɵɵelementEnd();
|
|
884
|
-
i0.ɵɵelementStart(
|
|
885
|
-
i0.ɵɵlistener("click", function
|
|
886
|
-
i0.ɵɵtext(
|
|
888
|
+
i0.ɵɵelementStart(25, "div", 137)(26, "button", 138);
|
|
889
|
+
i0.ɵɵlistener("click", function FileGridComponent_Conditional_16_Template_button_click_26_listener() { i0.ɵɵrestoreView(_r23); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onCancelCopyToAccount()); });
|
|
890
|
+
i0.ɵɵtext(27, "Cancel");
|
|
887
891
|
i0.ɵɵelementEnd();
|
|
888
|
-
i0.ɵɵelementStart(
|
|
889
|
-
i0.ɵɵlistener("click", function
|
|
890
|
-
i0.ɵɵ
|
|
891
|
-
i0.ɵɵtext(
|
|
892
|
+
i0.ɵɵelementStart(28, "button", 138);
|
|
893
|
+
i0.ɵɵlistener("click", function FileGridComponent_Conditional_16_Template_button_click_28_listener() { i0.ɵɵrestoreView(_r23); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onConfirmCopyToAccount()); });
|
|
894
|
+
i0.ɵɵconditionalCreate(29, FileGridComponent_Conditional_16_Conditional_29_Template, 1, 0, "i", 38);
|
|
895
|
+
i0.ɵɵtext(30);
|
|
892
896
|
i0.ɵɵelementEnd()()()();
|
|
893
897
|
} if (rf & 2) {
|
|
894
898
|
const ctx_r1 = i0.ɵɵnextContext();
|
|
@@ -897,18 +901,18 @@ function FileGridComponent_div_16_Template(rf, ctx) { if (rf & 1) {
|
|
|
897
901
|
i0.ɵɵadvance(4);
|
|
898
902
|
i0.ɵɵtextInterpolate(ctx_r1.account == null ? null : ctx_r1.account.account == null ? null : ctx_r1.account.account.Name);
|
|
899
903
|
i0.ɵɵadvance(4);
|
|
900
|
-
i0.ɵɵ
|
|
901
|
-
i0.ɵɵadvance(
|
|
904
|
+
i0.ɵɵrepeater(ctx_r1.availableAccounts);
|
|
905
|
+
i0.ɵɵadvance(4);
|
|
902
906
|
i0.ɵɵtwoWayProperty("ngModel", ctx_r1.copyToAccountDestinationPath);
|
|
903
907
|
i0.ɵɵproperty("disabled", ctx_r1.isCopyingToAccount);
|
|
904
908
|
i0.ɵɵadvance();
|
|
905
|
-
i0.ɵɵ
|
|
909
|
+
i0.ɵɵconditional(ctx_r1.copyToAccountProgress ? 24 : -1);
|
|
906
910
|
i0.ɵɵadvance(2);
|
|
907
911
|
i0.ɵɵproperty("disabled", ctx_r1.isCopyingToAccount);
|
|
908
912
|
i0.ɵɵadvance(2);
|
|
909
913
|
i0.ɵɵproperty("disabled", ctx_r1.isCopyingToAccount || ctx_r1.selectedDestinationAccounts.size === 0 || !ctx_r1.copyToAccountDestinationPath.trim());
|
|
910
914
|
i0.ɵɵadvance();
|
|
911
|
-
i0.ɵɵ
|
|
915
|
+
i0.ɵɵconditional(ctx_r1.isCopyingToAccount ? 29 : -1);
|
|
912
916
|
i0.ɵɵadvance();
|
|
913
917
|
i0.ɵɵtextInterpolate1(" ", ctx_r1.isCopyingToAccount ? "Copying..." : "Copy to " + ctx_r1.selectedDestinationAccounts.size + " account" + (ctx_r1.selectedDestinationAccounts.size !== 1 ? "s" : ""), " ");
|
|
914
918
|
} }
|
|
@@ -2337,50 +2341,64 @@ export class FileGridComponent {
|
|
|
2337
2341
|
return new Date(dateStr).toLocaleString();
|
|
2338
2342
|
}
|
|
2339
2343
|
static ɵfac = function FileGridComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || FileGridComponent)(); };
|
|
2340
|
-
static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: FileGridComponent, selectors: [["mj-file-grid"]], inputs: { account: "account", folderPath: "folderPath" }, outputs: { folderNavigate: "folderNavigate", folderStructureChanged: "folderStructureChanged" }, features: [i0.ɵɵNgOnChangesFeature], decls: 17, vars: 16, consts: [[1, "file-grid-container", 3, "dragenter", "dragover", "dragleave", "drop"], [
|
|
2344
|
+
static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: FileGridComponent, selectors: [["mj-file-grid"]], inputs: { account: "account", folderPath: "folderPath" }, outputs: { folderNavigate: "folderNavigate", folderStructureChanged: "folderStructureChanged" }, standalone: false, features: [i0.ɵɵNgOnChangesFeature], decls: 17, vars: 16, consts: [[1, "file-grid-container", 3, "dragenter", "dragover", "dragleave", "drop"], [1, "breadcrumb-bar"], [1, "multi-provider-search-panel"], [1, "loading-state"], [1, "error-state"], [1, "file-table-wrapper"], [1, "file-grid-wrapper"], [1, "empty-state"], [1, "bottom-toolbar"], [1, "drag-overlay"], [1, "upload-progress"], [1, "modal-overlay"], [1, "nav-buttons"], ["title", "Go up to parent folder", 1, "nav-btn", 3, "click", "disabled"], [1, "fa-solid", "fa-arrow-up"], ["title", "Refresh", 1, "nav-btn", 3, "click"], [1, "fa-solid", "fa-arrows-rotate"], [1, "breadcrumb-path"], [1, "fa-solid", "fa-folder"], [1, "path-text"], [1, "search-bar"], ["type", "text", "placeholder", "Search files and folders...", 1, "search-input", 3, "ngModelChange", "ngModel", "disabled"], ["title", "Clear search", 1, "search-clear-btn"], [1, "file-type-filter", 3, "ngModelChange", "ngModel", "disabled"], ["value", "all"], ["value", "files"], ["value", "folders"], ["title", "Search across all storage providers", 1, "multi-search-btn", 3, "click"], [1, "fa-solid", "fa-magnifying-glass-plus"], ["title", "Clear search", 1, "search-clear-btn", 3, "click"], [1, "fa-solid", "fa-xmark"], [1, "search-panel-header"], [1, "fa-solid", "fa-magnifying-glass"], [1, "close-panel-btn", 3, "click"], [1, "search-panel-body"], [1, "search-input-row"], ["type", "text", "placeholder", "Enter search term...", 1, "multi-search-input", 3, "ngModelChange", "keydown.enter", "ngModel", "disabled"], [1, "search-execute-btn", 3, "click", "disabled"], [1, "fa-solid", "fa-spinner", "fa-spin"], [1, "fa-solid", "fa-search"], [1, "provider-selection"], [1, "provider-selection-label"], [1, "provider-checkboxes"], [1, "provider-checkbox", 3, "disabled", "title"], [1, "search-results-container"], [1, "searching-state"], [1, "provider-checkbox", 3, "title"], ["type", "checkbox", 3, "change", "checked", "disabled"], [1, "provider-name"], [1, "provider-type"], [1, "no-search-badge"], [1, "search-results-summary"], [1, "result-count"], [1, "provider-stats"], [1, "failed-count"], [1, "clear-results-btn", 3, "click"], [1, "provider-results-list"], [1, "provider-result-group", 3, "failed"], [1, "provider-result-group"], [1, "provider-result-header"], [1, "fa-solid", "fa-cloud"], [1, "error-badge"], [1, "provider-result-files"], [1, "no-results-message"], [1, "fa-solid", "fa-exclamation-triangle"], [1, "search-result-item"], [1, "file-icon"], [1, "file-info"], [1, "file-name"], [1, "file-path"], [1, "file-size"], [1, "file-date"], ["text", "Searching across providers..."], ["text", "Loading files..."], [1, "error-icon"], [1, "fa-solid", "fa-circle-exclamation"], [1, "error-message"], [1, "retry-btn", 3, "click"], [1, "file-table"], [1, "col-name", 3, "click"], [1, "fa-solid", "sort-icon"], [1, "col-type"], [1, "col-size", 3, "click"], [1, "col-modified", 3, "click"], [1, "file-row", 3, "selected"], [1, "file-row", 3, "click", "dblclick"], [1, "col-name"], [1, "item-icon"], [1, "item-name"], [1, "item-type"], [1, "col-size"], [1, "item-size"], [1, "col-modified"], [1, "item-date"], [1, "file-grid"], [1, "grid-item", 3, "selected"], [1, "grid-item", 3, "click", "dblclick"], [1, "grid-icon"], [1, "grid-name"], [1, "grid-meta"], [1, "empty-icon"], [1, "fa-solid", "fa-folder-open"], [1, "empty-message"], [1, "upload-btn", 3, "click"], [1, "fa-solid", "fa-upload"], [1, "toolbar-left"], [1, "toolbar-btn", 3, "click"], [1, "fa-solid", "fa-folder-plus"], [1, "toolbar-btn", 3, "click", "disabled"], [1, "fa-solid", "fa-download"], [1, "fa-solid", "fa-pen"], [1, "fa-solid", "fa-copy"], ["title", "Copy file to another storage account", 1, "toolbar-btn", 3, "click", "disabled"], [1, "fa-solid", "fa-cloud-arrow-up"], [1, "fa-solid", "fa-arrows-up-down-left-right"], [1, "fa-solid", "fa-trash"], [1, "toolbar-right"], [1, "view-toggle"], ["title", "List View", 1, "view-btn", 3, "click"], [1, "fa-solid", "fa-list"], ["title", "Grid View", 1, "view-btn", 3, "click"], [1, "fa-solid", "fa-th"], [1, "item-count"], [1, "drag-content"], [1, "drag-icon"], [1, "drag-title"], [1, "progress-content"], [1, "progress-info"], [1, "progress-bar-wrap"], [1, "progress-bar"], [1, "progress-percent"], [1, "modal-overlay", 3, "click"], [1, "modal-dialog", 3, "click"], [1, "modal-header"], [1, "modal-close", 3, "click"], [1, "modal-body"], ["type", "text", "placeholder", "Enter folder name", 3, "ngModelChange", "keydown.enter", "ngModel", "disabled"], [1, "modal-footer"], [3, "click", "disabled"], [1, "warning"], [1, "danger", 3, "click", "disabled"], ["type", "text", "placeholder", "Enter new name", 3, "ngModelChange", "keydown.enter", "ngModel", "disabled"], ["type", "text", "placeholder", "Enter destination path", 3, "ngModelChange", "keydown.enter", "ngModel", "disabled"], ["type", "text", "placeholder", "Enter destination folder (e.g., folder1/folder2/)", 3, "ngModelChange", "keydown.enter", "ngModel", "disabled"], [2, "font-size", "11px", "color", "#666", "margin-top", "8px"], [2, "font-size", "12px", "color", "#666", "margin-bottom", "16px"], [1, "account-checkbox-list"], [1, "account-checkbox-item"], [2, "margin-top", "16px"], ["type", "text", "placeholder", "Enter destination filename", 3, "ngModelChange", "keydown.enter", "ngModel", "disabled"], [1, "copy-progress"], ["type", "checkbox", 3, "change", "id", "checked", "disabled"], [3, "for"], [1, "provider-badge"]], template: function FileGridComponent_Template(rf, ctx) { if (rf & 1) {
|
|
2341
2345
|
i0.ɵɵelementStart(0, "div", 0);
|
|
2342
2346
|
i0.ɵɵlistener("dragenter", function FileGridComponent_Template_div_dragenter_0_listener($event) { return ctx.onDragEnter($event); })("dragover", function FileGridComponent_Template_div_dragover_0_listener($event) { return ctx.onDragOver($event); })("dragleave", function FileGridComponent_Template_div_dragleave_0_listener($event) { return ctx.onDragLeave($event); })("drop", function FileGridComponent_Template_div_drop_0_listener($event) { return ctx.onDrop($event); });
|
|
2343
|
-
i0.ɵɵ
|
|
2347
|
+
i0.ɵɵconditionalCreate(1, FileGridComponent_Conditional_1_Template, 22, 9, "div", 1);
|
|
2348
|
+
i0.ɵɵconditionalCreate(2, FileGridComponent_Conditional_2_Template, 22, 8, "div", 2);
|
|
2349
|
+
i0.ɵɵconditionalCreate(3, FileGridComponent_Conditional_3_Template, 2, 0, "div", 3);
|
|
2350
|
+
i0.ɵɵconditionalCreate(4, FileGridComponent_Conditional_4_Template, 8, 1, "div", 4);
|
|
2351
|
+
i0.ɵɵconditionalCreate(5, FileGridComponent_Conditional_5_Template, 21, 18, "div", 5);
|
|
2352
|
+
i0.ɵɵconditionalCreate(6, FileGridComponent_Conditional_6_Template, 4, 0, "div", 6);
|
|
2353
|
+
i0.ɵɵconditionalCreate(7, FileGridComponent_Conditional_7_Template, 8, 0, "div", 7);
|
|
2354
|
+
i0.ɵɵconditionalCreate(8, FileGridComponent_Conditional_8_Template, 34, 12, "div", 8);
|
|
2355
|
+
i0.ɵɵconditionalCreate(9, FileGridComponent_Conditional_9_Template, 6, 0, "div", 9);
|
|
2356
|
+
i0.ɵɵconditionalCreate(10, FileGridComponent_Conditional_10_Template, 10, 4, "div", 10);
|
|
2344
2357
|
i0.ɵɵelementEnd();
|
|
2345
|
-
i0.ɵɵ
|
|
2358
|
+
i0.ɵɵconditionalCreate(11, FileGridComponent_Conditional_11_Template, 17, 6, "div", 11);
|
|
2359
|
+
i0.ɵɵconditionalCreate(12, FileGridComponent_Conditional_12_Template, 20, 7, "div", 11);
|
|
2360
|
+
i0.ɵɵconditionalCreate(13, FileGridComponent_Conditional_13_Template, 17, 7, "div", 11);
|
|
2361
|
+
i0.ɵɵconditionalCreate(14, FileGridComponent_Conditional_14_Template, 21, 8, "div", 11);
|
|
2362
|
+
i0.ɵɵconditionalCreate(15, FileGridComponent_Conditional_15_Template, 23, 10, "div", 11);
|
|
2363
|
+
i0.ɵɵconditionalCreate(16, FileGridComponent_Conditional_16_Template, 31, 9, "div", 11);
|
|
2346
2364
|
} if (rf & 2) {
|
|
2347
2365
|
i0.ɵɵadvance();
|
|
2348
|
-
i0.ɵɵ
|
|
2366
|
+
i0.ɵɵconditional(!ctx.isLoading && !ctx.errorMessage ? 1 : -1);
|
|
2349
2367
|
i0.ɵɵadvance();
|
|
2350
|
-
i0.ɵɵ
|
|
2368
|
+
i0.ɵɵconditional(ctx.isMultiProviderSearchMode ? 2 : -1);
|
|
2351
2369
|
i0.ɵɵadvance();
|
|
2352
|
-
i0.ɵɵ
|
|
2370
|
+
i0.ɵɵconditional(ctx.isLoading && !ctx.isMultiProviderSearchMode ? 3 : -1);
|
|
2353
2371
|
i0.ɵɵadvance();
|
|
2354
|
-
i0.ɵɵ
|
|
2372
|
+
i0.ɵɵconditional(ctx.errorMessage && !ctx.isLoading ? 4 : -1);
|
|
2355
2373
|
i0.ɵɵadvance();
|
|
2356
|
-
i0.ɵɵ
|
|
2374
|
+
i0.ɵɵconditional(!ctx.isLoading && !ctx.errorMessage && ctx.filteredItems.length > 0 && ctx.viewMode === "list" ? 5 : -1);
|
|
2357
2375
|
i0.ɵɵadvance();
|
|
2358
|
-
i0.ɵɵ
|
|
2376
|
+
i0.ɵɵconditional(!ctx.isLoading && !ctx.errorMessage && ctx.filteredItems.length > 0 && ctx.viewMode === "grid" ? 6 : -1);
|
|
2359
2377
|
i0.ɵɵadvance();
|
|
2360
|
-
i0.ɵɵ
|
|
2378
|
+
i0.ɵɵconditional(!ctx.isLoading && !ctx.errorMessage && ctx.filteredItems.length === 0 ? 7 : -1);
|
|
2361
2379
|
i0.ɵɵadvance();
|
|
2362
|
-
i0.ɵɵ
|
|
2380
|
+
i0.ɵɵconditional(!ctx.isLoading && !ctx.errorMessage ? 8 : -1);
|
|
2363
2381
|
i0.ɵɵadvance();
|
|
2364
|
-
i0.ɵɵ
|
|
2382
|
+
i0.ɵɵconditional(ctx.isDragging ? 9 : -1);
|
|
2365
2383
|
i0.ɵɵadvance();
|
|
2366
|
-
i0.ɵɵ
|
|
2384
|
+
i0.ɵɵconditional(ctx.isUploading ? 10 : -1);
|
|
2367
2385
|
i0.ɵɵadvance();
|
|
2368
|
-
i0.ɵɵ
|
|
2386
|
+
i0.ɵɵconditional(ctx.showNewFolderDialog ? 11 : -1);
|
|
2369
2387
|
i0.ɵɵadvance();
|
|
2370
|
-
i0.ɵɵ
|
|
2388
|
+
i0.ɵɵconditional(ctx.showDeleteDialog && ctx.itemToDelete ? 12 : -1);
|
|
2371
2389
|
i0.ɵɵadvance();
|
|
2372
|
-
i0.ɵɵ
|
|
2390
|
+
i0.ɵɵconditional(ctx.showRenameDialog && ctx.itemToRename ? 13 : -1);
|
|
2373
2391
|
i0.ɵɵadvance();
|
|
2374
|
-
i0.ɵɵ
|
|
2392
|
+
i0.ɵɵconditional(ctx.showCopyDialog && ctx.itemToCopy ? 14 : -1);
|
|
2375
2393
|
i0.ɵɵadvance();
|
|
2376
|
-
i0.ɵɵ
|
|
2394
|
+
i0.ɵɵconditional(ctx.showMoveDialog && ctx.itemToMove ? 15 : -1);
|
|
2377
2395
|
i0.ɵɵadvance();
|
|
2378
|
-
i0.ɵɵ
|
|
2379
|
-
} }, dependencies: [i1.NgForOf, i1.NgIf, i2.NgSelectOption, i2.ɵNgSelectMultipleOption, i2.DefaultValueAccessor, i2.SelectControlValueAccessor, i2.NgControlStatus, i2.NgModel, i3.LoadingComponent, i4.LabelDirective], styles: ["\n\n\n\n\n[_nghost-%COMP%] {\n display: flex;\n flex-direction: column;\n height: 100%;\n width: 100%;\n background-color: #fff;\n font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;\n}\n\n.file-grid-container[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n height: 100%;\n width: 100%;\n position: relative;\n}\n\n\n\n\n\n\n.breadcrumb-bar[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n padding: 6px 10px;\n background-color: #f8f8f8;\n border-bottom: 1px solid #ccc;\n gap: 10px;\n flex-wrap: wrap;\n}\n\n.nav-buttons[_ngcontent-%COMP%] {\n display: flex;\n gap: 4px;\n}\n\n.nav-btn[_ngcontent-%COMP%] {\n background: #fff;\n border: 1px solid #ccc;\n padding: 4px 8px;\n cursor: pointer;\n border-radius: 3px;\n font-size: 12px;\n color: #333;\n transition: background-color 0.15s;\n}\n\n.nav-btn[_ngcontent-%COMP%]:hover:not(:disabled) {\n background-color: #e8e8e8;\n}\n\n.nav-btn[_ngcontent-%COMP%]:disabled {\n opacity: 0.5;\n cursor: not-allowed;\n}\n\n.breadcrumb-path[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 6px;\n font-size: 12px;\n color: #333;\n}\n\n.breadcrumb-path[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n color: #666;\n}\n\n.path-text[_ngcontent-%COMP%] {\n font-weight: 500;\n}\n\n.search-bar[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 6px;\n margin-left: auto;\n position: relative;\n}\n\n.search-input[_ngcontent-%COMP%] {\n padding: 4px 30px 4px 8px;\n border: 1px solid #ccc;\n border-radius: 3px;\n font-size: 12px;\n font-family: inherit;\n min-width: 200px;\n}\n\n.search-input[_ngcontent-%COMP%]:focus {\n outline: none;\n border-color: #007AFF;\n}\n\n.search-clear-btn[_ngcontent-%COMP%] {\n position: absolute;\n right: 142px;\n background: none;\n border: none;\n cursor: pointer;\n color: #999;\n padding: 4px;\n font-size: 12px;\n}\n\n.search-clear-btn[_ngcontent-%COMP%]:hover {\n color: #333;\n}\n\n.file-type-filter[_ngcontent-%COMP%] {\n padding: 4px 8px;\n border: 1px solid #ccc;\n border-radius: 3px;\n font-size: 12px;\n font-family: inherit;\n background: #fff;\n cursor: pointer;\n}\n\n.file-type-filter[_ngcontent-%COMP%]:focus {\n outline: none;\n border-color: #007AFF;\n}\n\n\n\n\n\n\n.file-table-wrapper[_ngcontent-%COMP%] {\n flex: 1;\n overflow: auto;\n border-bottom: 1px solid #ccc;\n}\n\n.file-table[_ngcontent-%COMP%] {\n width: 100%;\n border-collapse: collapse;\n font-size: 12px;\n}\n\n.file-table[_ngcontent-%COMP%] thead[_ngcontent-%COMP%] {\n position: sticky;\n top: 0;\n background-color: #f0f0f0;\n z-index: 10;\n}\n\n.file-table[_ngcontent-%COMP%] th[_ngcontent-%COMP%] {\n text-align: left;\n padding: 6px 10px;\n border-bottom: 1px solid #ccc;\n font-weight: 600;\n color: #333;\n cursor: pointer;\n user-select: none;\n}\n\n.file-table[_ngcontent-%COMP%] th[_ngcontent-%COMP%]:hover {\n background-color: #e8e8e8;\n}\n\n.file-table[_ngcontent-%COMP%] th[_ngcontent-%COMP%] span[_ngcontent-%COMP%] {\n margin-right: 4px;\n}\n\n.sort-icon[_ngcontent-%COMP%] {\n font-size: 10px;\n color: #666;\n}\n\n.file-table[_ngcontent-%COMP%] tbody[_ngcontent-%COMP%] tr[_ngcontent-%COMP%] {\n border-bottom: 1px solid #e8e8e8;\n cursor: pointer;\n transition: background-color 0.1s;\n}\n\n.file-table[_ngcontent-%COMP%] tbody[_ngcontent-%COMP%] tr[_ngcontent-%COMP%]:hover {\n background-color: #f8f8f8;\n}\n\n.file-table[_ngcontent-%COMP%] tbody[_ngcontent-%COMP%] tr.selected[_ngcontent-%COMP%] {\n background-color: #cce8ff;\n}\n\n.file-table[_ngcontent-%COMP%] tbody[_ngcontent-%COMP%] tr.selected[_ngcontent-%COMP%]:hover {\n background-color: #b3d9ff;\n}\n\n.file-table[_ngcontent-%COMP%] td[_ngcontent-%COMP%] {\n padding: 6px 10px;\n color: #333;\n}\n\n\n\n.col-name[_ngcontent-%COMP%] {\n width: 50%;\n}\n\n.col-type[_ngcontent-%COMP%] {\n width: 15%;\n}\n\n.col-size[_ngcontent-%COMP%] {\n width: 15%;\n}\n\n.col-modified[_ngcontent-%COMP%] {\n width: 20%;\n}\n\n\n\n.col-name[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n.item-icon[_ngcontent-%COMP%] {\n font-size: 14px;\n color: #666;\n flex-shrink: 0;\n}\n\n.item-name[_ngcontent-%COMP%] {\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\n\n\n.fa-folder[_ngcontent-%COMP%] {\n color: #FFB84D;\n}\n\n\n\n.fa-file-pdf[_ngcontent-%COMP%] {\n color: #D32F2F;\n}\n\n.fa-file-word[_ngcontent-%COMP%] {\n color: #2B579A;\n}\n\n.fa-file-excel[_ngcontent-%COMP%] {\n color: #217346;\n}\n\n.fa-file-image[_ngcontent-%COMP%] {\n color: #673AB7;\n}\n\n.fa-file-video[_ngcontent-%COMP%] {\n color: #F57C00;\n}\n\n.fa-file-audio[_ngcontent-%COMP%] {\n color: #D32F2F;\n}\n\n.fa-file-archive[_ngcontent-%COMP%] {\n color: #795548;\n}\n\n.fa-file-code[_ngcontent-%COMP%] {\n color: #388E3C;\n}\n\n\n\n\n\n\n.file-grid-wrapper[_ngcontent-%COMP%] {\n flex: 1;\n overflow: auto;\n padding: 10px;\n border-bottom: 1px solid #ccc;\n}\n\n.file-grid[_ngcontent-%COMP%] {\n display: grid;\n grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));\n gap: 12px;\n}\n\n.grid-item[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n align-items: center;\n padding: 12px 8px;\n border: 1px solid #e8e8e8;\n border-radius: 4px;\n cursor: pointer;\n transition: all 0.15s;\n background: #fff;\n}\n\n.grid-item[_ngcontent-%COMP%]:hover {\n background-color: #f8f8f8;\n border-color: #ccc;\n}\n\n.grid-item.selected[_ngcontent-%COMP%] {\n background-color: #cce8ff;\n border-color: #007AFF;\n}\n\n.grid-icon[_ngcontent-%COMP%] {\n font-size: 48px;\n margin-bottom: 8px;\n color: #666;\n}\n\n.grid-icon[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n display: block;\n}\n\n.grid-name[_ngcontent-%COMP%] {\n font-size: 12px;\n color: #333;\n text-align: center;\n word-break: break-word;\n overflow: hidden;\n text-overflow: ellipsis;\n display: -webkit-box;\n -webkit-line-clamp: 2;\n -webkit-box-orient: vertical;\n max-width: 100%;\n}\n\n.grid-meta[_ngcontent-%COMP%] {\n font-size: 11px;\n color: #666;\n margin-top: 4px;\n}\n\n\n\n\n\n\n.bottom-toolbar[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n justify-content: space-between;\n padding: 6px 10px;\n background-color: #f8f8f8;\n border-top: 1px solid #ccc;\n min-height: 36px;\n}\n\n.toolbar-left[_ngcontent-%COMP%] {\n display: flex;\n gap: 6px;\n}\n\n.toolbar-btn[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 6px;\n background: #fff;\n border: 1px solid #ccc;\n padding: 5px 12px;\n cursor: pointer;\n border-radius: 3px;\n font-size: 12px;\n color: #333;\n transition: background-color 0.15s;\n}\n\n.toolbar-btn[_ngcontent-%COMP%]:hover:not(:disabled) {\n background-color: #e8e8e8;\n}\n\n.toolbar-btn[_ngcontent-%COMP%]:disabled {\n opacity: 0.5;\n cursor: not-allowed;\n}\n\n.toolbar-btn[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n font-size: 12px;\n}\n\n.toolbar-right[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 12px;\n}\n\n.view-toggle[_ngcontent-%COMP%] {\n display: flex;\n border: 1px solid #ccc;\n border-radius: 3px;\n overflow: hidden;\n}\n\n.view-btn[_ngcontent-%COMP%] {\n background: #fff;\n border: none;\n border-right: 1px solid #ccc;\n padding: 4px 10px;\n cursor: pointer;\n font-size: 12px;\n color: #666;\n transition: all 0.15s;\n}\n\n.view-btn[_ngcontent-%COMP%]:last-child {\n border-right: none;\n}\n\n.view-btn[_ngcontent-%COMP%]:hover {\n background-color: #f0f0f0;\n color: #333;\n}\n\n.view-btn.active[_ngcontent-%COMP%] {\n background-color: #007AFF;\n color: #fff;\n}\n\n.item-count[_ngcontent-%COMP%] {\n font-size: 11px;\n color: #666;\n}\n\n\n\n\n\n\n.loading-state[_ngcontent-%COMP%], \n.error-state[_ngcontent-%COMP%], \n.empty-state[_ngcontent-%COMP%] {\n flex: 1;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n padding: 40px 20px;\n}\n\n.error-icon[_ngcontent-%COMP%], \n.empty-icon[_ngcontent-%COMP%] {\n font-size: 48px;\n color: #999;\n margin-bottom: 16px;\n}\n\n.error-message[_ngcontent-%COMP%], \n.empty-message[_ngcontent-%COMP%] {\n font-size: 14px;\n color: #666;\n margin-bottom: 16px;\n}\n\n.retry-btn[_ngcontent-%COMP%], \n.upload-btn[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 8px;\n background: #fff;\n border: 1px solid #ccc;\n padding: 8px 16px;\n cursor: pointer;\n border-radius: 3px;\n font-size: 13px;\n color: #333;\n transition: background-color 0.15s;\n}\n\n.retry-btn[_ngcontent-%COMP%]:hover, \n.upload-btn[_ngcontent-%COMP%]:hover {\n background-color: #f0f0f0;\n}\n\n\n\n\n\n\n.drag-overlay[_ngcontent-%COMP%] {\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n background-color: rgba(255, 255, 255, 0.95);\n z-index: 1000;\n display: flex;\n align-items: center;\n justify-content: center;\n border: 3px dashed #007AFF;\n}\n\n.drag-content[_ngcontent-%COMP%] {\n text-align: center;\n}\n\n.drag-icon[_ngcontent-%COMP%] {\n font-size: 64px;\n color: #007AFF;\n margin-bottom: 16px;\n}\n\n.drag-title[_ngcontent-%COMP%] {\n font-size: 20px;\n font-weight: 600;\n color: #007AFF;\n margin: 0;\n}\n\n\n\n\n\n\n.upload-progress[_ngcontent-%COMP%] {\n position: absolute;\n bottom: 40px;\n right: 20px;\n background: #fff;\n border: 1px solid #ccc;\n border-radius: 4px;\n padding: 12px 16px;\n box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);\n min-width: 300px;\n z-index: 100;\n}\n\n.progress-content[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n gap: 8px;\n}\n\n.progress-info[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 8px;\n font-size: 13px;\n color: #333;\n}\n\n.progress-bar-wrap[_ngcontent-%COMP%] {\n width: 100%;\n height: 6px;\n background-color: #e0e0e0;\n border-radius: 3px;\n overflow: hidden;\n}\n\n.progress-bar[_ngcontent-%COMP%] {\n height: 100%;\n background-color: #007AFF;\n transition: width 0.3s ease;\n}\n\n.progress-percent[_ngcontent-%COMP%] {\n font-size: 12px;\n color: #666;\n text-align: right;\n}\n\n\n\n\n\n\n.modal-overlay[_ngcontent-%COMP%] {\n position: fixed;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n background-color: rgba(0, 0, 0, 0.5);\n z-index: 2000;\n display: flex;\n align-items: center;\n justify-content: center;\n}\n\n.modal-dialog[_ngcontent-%COMP%] {\n background: #fff;\n border: 1px solid #999;\n border-radius: 4px;\n min-width: 400px;\n max-width: 90%;\n box-shadow: 0 4px 16px rgba(0, 0, 0, 0.3);\n}\n\n.modal-header[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n justify-content: space-between;\n padding: 12px 16px;\n background-color: #f8f8f8;\n border-bottom: 1px solid #ccc;\n}\n\n.modal-header[_ngcontent-%COMP%] h3[_ngcontent-%COMP%] {\n margin: 0;\n font-size: 14px;\n font-weight: 600;\n color: #333;\n}\n\n.modal-close[_ngcontent-%COMP%] {\n background: none;\n border: none;\n cursor: pointer;\n font-size: 16px;\n color: #666;\n padding: 4px;\n}\n\n.modal-close[_ngcontent-%COMP%]:hover {\n color: #333;\n}\n\n.modal-body[_ngcontent-%COMP%] {\n padding: 16px;\n}\n\n.modal-body[_ngcontent-%COMP%] label[_ngcontent-%COMP%] {\n display: block;\n margin-bottom: 6px;\n font-size: 12px;\n font-weight: 600;\n color: #333;\n}\n\n.modal-body[_ngcontent-%COMP%] input[type=\"text\"][_ngcontent-%COMP%] {\n width: 100%;\n padding: 6px 10px;\n border: 1px solid #ccc;\n border-radius: 3px;\n font-size: 13px;\n font-family: inherit;\n}\n\n.modal-body[_ngcontent-%COMP%] input[type=\"text\"][_ngcontent-%COMP%]:focus {\n outline: none;\n border-color: #007AFF;\n}\n\n.modal-body[_ngcontent-%COMP%] select[_ngcontent-%COMP%], \n.modal-body[_ngcontent-%COMP%] .provider-select[_ngcontent-%COMP%] {\n width: 100%;\n padding: 6px 10px;\n border: 1px solid #ccc;\n border-radius: 3px;\n font-size: 13px;\n font-family: inherit;\n background-color: #fff;\n cursor: pointer;\n}\n\n.modal-body[_ngcontent-%COMP%] select[_ngcontent-%COMP%]:focus, \n.modal-body[_ngcontent-%COMP%] .provider-select[_ngcontent-%COMP%]:focus {\n outline: none;\n border-color: #007AFF;\n}\n\n.modal-body[_ngcontent-%COMP%] select[_ngcontent-%COMP%]:disabled, \n.modal-body[_ngcontent-%COMP%] .provider-select[_ngcontent-%COMP%]:disabled {\n background-color: #f5f5f5;\n cursor: not-allowed;\n}\n\n.modal-body[_ngcontent-%COMP%] p[_ngcontent-%COMP%] {\n margin: 0 0 12px 0;\n font-size: 13px;\n color: #333;\n}\n\n.modal-body[_ngcontent-%COMP%] .warning[_ngcontent-%COMP%] {\n color: #D32F2F;\n font-size: 12px;\n}\n\n\n\n.account-checkbox-list[_ngcontent-%COMP%] {\n max-height: 200px;\n overflow-y: auto;\n border: 1px solid #ccc;\n border-radius: 4px;\n padding: 8px;\n background: #fafafa;\n}\n\n.account-checkbox-item[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 8px;\n padding: 6px 4px;\n border-radius: 3px;\n cursor: pointer;\n}\n\n.account-checkbox-item[_ngcontent-%COMP%]:hover {\n background-color: #e8f4fd;\n}\n\n.account-checkbox-item[_ngcontent-%COMP%] input[type=\"checkbox\"][_ngcontent-%COMP%] {\n width: 16px;\n height: 16px;\n cursor: pointer;\n accent-color: #007AFF;\n}\n\n.account-checkbox-item[_ngcontent-%COMP%] label[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 8px;\n cursor: pointer;\n font-size: 13px;\n font-weight: normal;\n margin: 0;\n}\n\n.provider-badge[_ngcontent-%COMP%] {\n font-size: 11px;\n color: #666;\n background: #e0e0e0;\n padding: 2px 6px;\n border-radius: 10px;\n}\n\n.copy-progress[_ngcontent-%COMP%] {\n margin-top: 12px;\n padding: 8px 12px;\n background: #e8f4fd;\n border-radius: 4px;\n font-size: 12px;\n color: #0066cc;\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n.modal-footer[_ngcontent-%COMP%] {\n display: flex;\n justify-content: flex-end;\n gap: 8px;\n padding: 12px 16px;\n background-color: #f8f8f8;\n border-top: 1px solid #ccc;\n}\n\n.modal-footer[_ngcontent-%COMP%] button[_ngcontent-%COMP%] {\n padding: 6px 16px;\n border: 1px solid #ccc;\n background: #fff;\n cursor: pointer;\n border-radius: 3px;\n font-size: 12px;\n font-weight: 500;\n transition: background-color 0.15s;\n}\n\n.modal-footer[_ngcontent-%COMP%] button[_ngcontent-%COMP%]:hover:not(:disabled) {\n background-color: #f0f0f0;\n}\n\n.modal-footer[_ngcontent-%COMP%] button[_ngcontent-%COMP%]:disabled {\n opacity: 0.5;\n cursor: not-allowed;\n}\n\n.modal-footer[_ngcontent-%COMP%] button.danger[_ngcontent-%COMP%] {\n background-color: #D32F2F;\n color: #fff;\n border-color: #D32F2F;\n}\n\n.modal-footer[_ngcontent-%COMP%] button.danger[_ngcontent-%COMP%]:hover:not(:disabled) {\n background-color: #B71C1C;\n}\n\n\n\n\n\n\n.file-table-wrapper[_ngcontent-%COMP%]::-webkit-scrollbar {\n width: 12px;\n height: 12px;\n}\n\n.file-table-wrapper[_ngcontent-%COMP%]::-webkit-scrollbar-track {\n background: #f0f0f0;\n}\n\n.file-table-wrapper[_ngcontent-%COMP%]::-webkit-scrollbar-thumb {\n background: #c0c0c0;\n border: 2px solid #f0f0f0;\n}\n\n.file-table-wrapper[_ngcontent-%COMP%]::-webkit-scrollbar-thumb:hover {\n background: #a0a0a0;\n}\n\n\n\n\n\n\n@media screen and (max-width: 768px) {\n .file-table[_ngcontent-%COMP%] {\n font-size: 11px;\n }\n\n .file-table[_ngcontent-%COMP%] th[_ngcontent-%COMP%], \n .file-table[_ngcontent-%COMP%] td[_ngcontent-%COMP%] {\n padding: 4px 6px;\n }\n\n .col-type[_ngcontent-%COMP%], \n .col-size[_ngcontent-%COMP%] {\n display: none;\n }\n\n .col-name[_ngcontent-%COMP%] {\n width: 60%;\n }\n\n .col-modified[_ngcontent-%COMP%] {\n width: 40%;\n }\n\n .toolbar-btn[_ngcontent-%COMP%] span[_ngcontent-%COMP%] {\n display: none;\n }\n\n .modal-dialog[_ngcontent-%COMP%] {\n min-width: 90%;\n }\n}\n\n\n\n\n\n\n.multi-search-btn[_ngcontent-%COMP%] {\n background: #fff;\n border: 1px solid #ccc;\n padding: 4px 8px;\n cursor: pointer;\n border-radius: 3px;\n font-size: 12px;\n color: #666;\n transition: all 0.15s;\n}\n\n.multi-search-btn[_ngcontent-%COMP%]:hover {\n background-color: #e8e8e8;\n color: #333;\n}\n\n.multi-search-btn.active[_ngcontent-%COMP%] {\n background-color: #007AFF;\n color: #fff;\n border-color: #007AFF;\n}\n\n.multi-provider-search-panel[_ngcontent-%COMP%] {\n background: #fff;\n border-bottom: 1px solid #ccc;\n display: flex;\n flex-direction: column;\n max-height: 70vh;\n overflow: hidden;\n}\n\n.search-panel-header[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n justify-content: space-between;\n padding: 10px 16px;\n background-color: #f0f7ff;\n border-bottom: 1px solid #cce8ff;\n}\n\n.search-panel-header[_ngcontent-%COMP%] h3[_ngcontent-%COMP%] {\n margin: 0;\n font-size: 14px;\n font-weight: 600;\n color: #007AFF;\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n.close-panel-btn[_ngcontent-%COMP%] {\n background: none;\n border: none;\n cursor: pointer;\n font-size: 16px;\n color: #666;\n padding: 4px;\n}\n\n.close-panel-btn[_ngcontent-%COMP%]:hover {\n color: #333;\n}\n\n.search-panel-body[_ngcontent-%COMP%] {\n padding: 16px;\n}\n\n.search-input-row[_ngcontent-%COMP%] {\n display: flex;\n gap: 8px;\n margin-bottom: 16px;\n}\n\n.multi-search-input[_ngcontent-%COMP%] {\n flex: 1;\n padding: 8px 12px;\n border: 1px solid #ccc;\n border-radius: 4px;\n font-size: 13px;\n font-family: inherit;\n}\n\n.multi-search-input[_ngcontent-%COMP%]:focus {\n outline: none;\n border-color: #007AFF;\n}\n\n.search-execute-btn[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 6px;\n background: #007AFF;\n color: #fff;\n border: none;\n padding: 8px 16px;\n cursor: pointer;\n border-radius: 4px;\n font-size: 13px;\n font-weight: 500;\n transition: background-color 0.15s;\n}\n\n.search-execute-btn[_ngcontent-%COMP%]:hover:not(:disabled) {\n background-color: #0056b3;\n}\n\n.search-execute-btn[_ngcontent-%COMP%]:disabled {\n opacity: 0.5;\n cursor: not-allowed;\n}\n\n.provider-selection[_ngcontent-%COMP%] {\n margin-bottom: 8px;\n}\n\n.provider-selection-label[_ngcontent-%COMP%] {\n display: block;\n font-size: 12px;\n font-weight: 600;\n color: #333;\n margin-bottom: 8px;\n}\n\n.provider-checkboxes[_ngcontent-%COMP%] {\n display: flex;\n flex-wrap: wrap;\n gap: 12px;\n}\n\n.provider-checkbox[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 6px;\n font-size: 13px;\n color: #333;\n cursor: pointer;\n padding: 4px 8px;\n border: 1px solid #e0e0e0;\n border-radius: 4px;\n background: #fafafa;\n transition: all 0.15s;\n}\n\n.provider-checkbox[_ngcontent-%COMP%]:hover:not(.disabled) {\n border-color: #007AFF;\n background: #f0f7ff;\n}\n\n.provider-checkbox.disabled[_ngcontent-%COMP%] {\n opacity: 0.6;\n cursor: not-allowed;\n background: #f5f5f5;\n}\n\n.provider-checkbox[_ngcontent-%COMP%] input[type=\"checkbox\"][_ngcontent-%COMP%] {\n cursor: pointer;\n}\n\n.provider-checkbox[_ngcontent-%COMP%] .provider-name[_ngcontent-%COMP%] {\n font-weight: 500;\n}\n\n.no-search-badge[_ngcontent-%COMP%] {\n font-size: 10px;\n color: #999;\n font-style: italic;\n}\n\n\n\n.search-results-container[_ngcontent-%COMP%] {\n flex: 1;\n overflow: auto;\n border-top: 1px solid #e0e0e0;\n}\n\n.search-results-summary[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 12px;\n padding: 10px 16px;\n background: #f8f8f8;\n border-bottom: 1px solid #e0e0e0;\n}\n\n.search-results-summary[_ngcontent-%COMP%] .result-count[_ngcontent-%COMP%] {\n font-weight: 600;\n font-size: 13px;\n color: #333;\n}\n\n.search-results-summary[_ngcontent-%COMP%] .provider-stats[_ngcontent-%COMP%] {\n font-size: 12px;\n color: #666;\n}\n\n.search-results-summary[_ngcontent-%COMP%] .failed-count[_ngcontent-%COMP%] {\n color: #D32F2F;\n}\n\n.clear-results-btn[_ngcontent-%COMP%] {\n margin-left: auto;\n background: none;\n border: 1px solid #ccc;\n padding: 4px 10px;\n cursor: pointer;\n border-radius: 3px;\n font-size: 11px;\n color: #666;\n display: flex;\n align-items: center;\n gap: 4px;\n}\n\n.clear-results-btn[_ngcontent-%COMP%]:hover {\n background: #f0f0f0;\n color: #333;\n}\n\n.provider-results-list[_ngcontent-%COMP%] {\n padding: 8px 0;\n}\n\n.provider-result-group[_ngcontent-%COMP%] {\n margin-bottom: 16px;\n}\n\n.provider-result-group[_ngcontent-%COMP%]:last-child {\n margin-bottom: 0;\n}\n\n.provider-result-header[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 8px;\n padding: 8px 16px;\n background: #f5f5f5;\n font-size: 13px;\n font-weight: 600;\n color: #333;\n}\n\n.provider-result-header[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n color: #007AFF;\n}\n\n.provider-result-header[_ngcontent-%COMP%] .result-count[_ngcontent-%COMP%] {\n font-weight: normal;\n color: #666;\n}\n\n.provider-result-group.failed[_ngcontent-%COMP%] .provider-result-header[_ngcontent-%COMP%] {\n background: #fff5f5;\n}\n\n.provider-result-group.failed[_ngcontent-%COMP%] .provider-result-header[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n color: #D32F2F;\n}\n\n.error-badge[_ngcontent-%COMP%] {\n color: #D32F2F;\n font-weight: normal;\n font-size: 12px;\n display: flex;\n align-items: center;\n gap: 4px;\n}\n\n.provider-result-files[_ngcontent-%COMP%] {\n padding: 0;\n}\n\n.search-result-item[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 12px;\n padding: 8px 16px 8px 40px;\n border-bottom: 1px solid #f0f0f0;\n cursor: pointer;\n transition: background-color 0.1s;\n}\n\n.search-result-item[_ngcontent-%COMP%]:hover {\n background-color: #f8f8f8;\n}\n\n.search-result-item[_ngcontent-%COMP%]:last-child {\n border-bottom: none;\n}\n\n.search-result-item[_ngcontent-%COMP%] .file-icon[_ngcontent-%COMP%] {\n font-size: 16px;\n color: #666;\n flex-shrink: 0;\n}\n\n.search-result-item[_ngcontent-%COMP%] .file-info[_ngcontent-%COMP%] {\n flex: 1;\n min-width: 0;\n display: flex;\n flex-direction: column;\n gap: 2px;\n}\n\n.search-result-item[_ngcontent-%COMP%] .file-name[_ngcontent-%COMP%] {\n font-size: 13px;\n font-weight: 500;\n color: #333;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\n.search-result-item[_ngcontent-%COMP%] .file-path[_ngcontent-%COMP%] {\n font-size: 11px;\n color: #999;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\n.search-result-item[_ngcontent-%COMP%] .file-size[_ngcontent-%COMP%] {\n font-size: 12px;\n color: #666;\n flex-shrink: 0;\n min-width: 60px;\n text-align: right;\n}\n\n.search-result-item[_ngcontent-%COMP%] .file-date[_ngcontent-%COMP%] {\n font-size: 12px;\n color: #666;\n flex-shrink: 0;\n min-width: 140px;\n text-align: right;\n}\n\n.no-results-message[_ngcontent-%COMP%] {\n padding: 16px 40px;\n font-size: 12px;\n color: #999;\n font-style: italic;\n}\n\n.searching-state[_ngcontent-%COMP%] {\n padding: 40px 20px;\n display: flex;\n align-items: center;\n justify-content: center;\n}"] });
|
|
2396
|
+
i0.ɵɵconditional(ctx.showCopyToProviderDialog && ctx.itemToCopyToProvider ? 16 : -1);
|
|
2397
|
+
} }, dependencies: [i1.NgSelectOption, i1.ɵNgSelectMultipleOption, i1.DefaultValueAccessor, i1.SelectControlValueAccessor, i1.NgControlStatus, i1.NgModel, i2.LoadingComponent, i3.LabelDirective], styles: ["\n\n\n\n\n[_nghost-%COMP%] {\n display: flex;\n flex-direction: column;\n height: 100%;\n width: 100%;\n background-color: #fff;\n font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;\n}\n\n.file-grid-container[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n height: 100%;\n width: 100%;\n position: relative;\n}\n\n\n\n\n\n\n.breadcrumb-bar[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n padding: 6px 10px;\n background-color: #f8f8f8;\n border-bottom: 1px solid #ccc;\n gap: 10px;\n flex-wrap: wrap;\n}\n\n.nav-buttons[_ngcontent-%COMP%] {\n display: flex;\n gap: 4px;\n}\n\n.nav-btn[_ngcontent-%COMP%] {\n background: #fff;\n border: 1px solid #ccc;\n padding: 4px 8px;\n cursor: pointer;\n border-radius: 3px;\n font-size: 12px;\n color: #333;\n transition: background-color 0.15s;\n}\n\n.nav-btn[_ngcontent-%COMP%]:hover:not(:disabled) {\n background-color: #e8e8e8;\n}\n\n.nav-btn[_ngcontent-%COMP%]:disabled {\n opacity: 0.5;\n cursor: not-allowed;\n}\n\n.breadcrumb-path[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 6px;\n font-size: 12px;\n color: #333;\n}\n\n.breadcrumb-path[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n color: #666;\n}\n\n.path-text[_ngcontent-%COMP%] {\n font-weight: 500;\n}\n\n.search-bar[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 6px;\n margin-left: auto;\n position: relative;\n}\n\n.search-input[_ngcontent-%COMP%] {\n padding: 4px 30px 4px 8px;\n border: 1px solid #ccc;\n border-radius: 3px;\n font-size: 12px;\n font-family: inherit;\n min-width: 200px;\n}\n\n.search-input[_ngcontent-%COMP%]:focus {\n outline: none;\n border-color: #007AFF;\n}\n\n.search-clear-btn[_ngcontent-%COMP%] {\n position: absolute;\n right: 142px;\n background: none;\n border: none;\n cursor: pointer;\n color: #999;\n padding: 4px;\n font-size: 12px;\n}\n\n.search-clear-btn[_ngcontent-%COMP%]:hover {\n color: #333;\n}\n\n.file-type-filter[_ngcontent-%COMP%] {\n padding: 4px 8px;\n border: 1px solid #ccc;\n border-radius: 3px;\n font-size: 12px;\n font-family: inherit;\n background: #fff;\n cursor: pointer;\n}\n\n.file-type-filter[_ngcontent-%COMP%]:focus {\n outline: none;\n border-color: #007AFF;\n}\n\n\n\n\n\n\n.file-table-wrapper[_ngcontent-%COMP%] {\n flex: 1;\n overflow: auto;\n border-bottom: 1px solid #ccc;\n}\n\n.file-table[_ngcontent-%COMP%] {\n width: 100%;\n border-collapse: collapse;\n font-size: 12px;\n}\n\n.file-table[_ngcontent-%COMP%] thead[_ngcontent-%COMP%] {\n position: sticky;\n top: 0;\n background-color: #f0f0f0;\n z-index: 10;\n}\n\n.file-table[_ngcontent-%COMP%] th[_ngcontent-%COMP%] {\n text-align: left;\n padding: 6px 10px;\n border-bottom: 1px solid #ccc;\n font-weight: 600;\n color: #333;\n cursor: pointer;\n user-select: none;\n}\n\n.file-table[_ngcontent-%COMP%] th[_ngcontent-%COMP%]:hover {\n background-color: #e8e8e8;\n}\n\n.file-table[_ngcontent-%COMP%] th[_ngcontent-%COMP%] span[_ngcontent-%COMP%] {\n margin-right: 4px;\n}\n\n.sort-icon[_ngcontent-%COMP%] {\n font-size: 10px;\n color: #666;\n}\n\n.file-table[_ngcontent-%COMP%] tbody[_ngcontent-%COMP%] tr[_ngcontent-%COMP%] {\n border-bottom: 1px solid #e8e8e8;\n cursor: pointer;\n transition: background-color 0.1s;\n}\n\n.file-table[_ngcontent-%COMP%] tbody[_ngcontent-%COMP%] tr[_ngcontent-%COMP%]:hover {\n background-color: #f8f8f8;\n}\n\n.file-table[_ngcontent-%COMP%] tbody[_ngcontent-%COMP%] tr.selected[_ngcontent-%COMP%] {\n background-color: #cce8ff;\n}\n\n.file-table[_ngcontent-%COMP%] tbody[_ngcontent-%COMP%] tr.selected[_ngcontent-%COMP%]:hover {\n background-color: #b3d9ff;\n}\n\n.file-table[_ngcontent-%COMP%] td[_ngcontent-%COMP%] {\n padding: 6px 10px;\n color: #333;\n}\n\n\n\n.col-name[_ngcontent-%COMP%] {\n width: 50%;\n}\n\n.col-type[_ngcontent-%COMP%] {\n width: 15%;\n}\n\n.col-size[_ngcontent-%COMP%] {\n width: 15%;\n}\n\n.col-modified[_ngcontent-%COMP%] {\n width: 20%;\n}\n\n\n\n.col-name[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n.item-icon[_ngcontent-%COMP%] {\n font-size: 14px;\n color: #666;\n flex-shrink: 0;\n}\n\n.item-name[_ngcontent-%COMP%] {\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\n\n\n.fa-folder[_ngcontent-%COMP%] {\n color: #FFB84D;\n}\n\n\n\n.fa-file-pdf[_ngcontent-%COMP%] {\n color: #D32F2F;\n}\n\n.fa-file-word[_ngcontent-%COMP%] {\n color: #2B579A;\n}\n\n.fa-file-excel[_ngcontent-%COMP%] {\n color: #217346;\n}\n\n.fa-file-image[_ngcontent-%COMP%] {\n color: #673AB7;\n}\n\n.fa-file-video[_ngcontent-%COMP%] {\n color: #F57C00;\n}\n\n.fa-file-audio[_ngcontent-%COMP%] {\n color: #D32F2F;\n}\n\n.fa-file-archive[_ngcontent-%COMP%] {\n color: #795548;\n}\n\n.fa-file-code[_ngcontent-%COMP%] {\n color: #388E3C;\n}\n\n\n\n\n\n\n.file-grid-wrapper[_ngcontent-%COMP%] {\n flex: 1;\n overflow: auto;\n padding: 10px;\n border-bottom: 1px solid #ccc;\n}\n\n.file-grid[_ngcontent-%COMP%] {\n display: grid;\n grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));\n gap: 12px;\n}\n\n.grid-item[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n align-items: center;\n padding: 12px 8px;\n border: 1px solid #e8e8e8;\n border-radius: 4px;\n cursor: pointer;\n transition: all 0.15s;\n background: #fff;\n}\n\n.grid-item[_ngcontent-%COMP%]:hover {\n background-color: #f8f8f8;\n border-color: #ccc;\n}\n\n.grid-item.selected[_ngcontent-%COMP%] {\n background-color: #cce8ff;\n border-color: #007AFF;\n}\n\n.grid-icon[_ngcontent-%COMP%] {\n font-size: 48px;\n margin-bottom: 8px;\n color: #666;\n}\n\n.grid-icon[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n display: block;\n}\n\n.grid-name[_ngcontent-%COMP%] {\n font-size: 12px;\n color: #333;\n text-align: center;\n word-break: break-word;\n overflow: hidden;\n text-overflow: ellipsis;\n display: -webkit-box;\n -webkit-line-clamp: 2;\n -webkit-box-orient: vertical;\n max-width: 100%;\n}\n\n.grid-meta[_ngcontent-%COMP%] {\n font-size: 11px;\n color: #666;\n margin-top: 4px;\n}\n\n\n\n\n\n\n.bottom-toolbar[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n justify-content: space-between;\n padding: 6px 10px;\n background-color: #f8f8f8;\n border-top: 1px solid #ccc;\n min-height: 36px;\n}\n\n.toolbar-left[_ngcontent-%COMP%] {\n display: flex;\n gap: 6px;\n}\n\n.toolbar-btn[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 6px;\n background: #fff;\n border: 1px solid #ccc;\n padding: 5px 12px;\n cursor: pointer;\n border-radius: 3px;\n font-size: 12px;\n color: #333;\n transition: background-color 0.15s;\n}\n\n.toolbar-btn[_ngcontent-%COMP%]:hover:not(:disabled) {\n background-color: #e8e8e8;\n}\n\n.toolbar-btn[_ngcontent-%COMP%]:disabled {\n opacity: 0.5;\n cursor: not-allowed;\n}\n\n.toolbar-btn[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n font-size: 12px;\n}\n\n.toolbar-right[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 12px;\n}\n\n.view-toggle[_ngcontent-%COMP%] {\n display: flex;\n border: 1px solid #ccc;\n border-radius: 3px;\n overflow: hidden;\n}\n\n.view-btn[_ngcontent-%COMP%] {\n background: #fff;\n border: none;\n border-right: 1px solid #ccc;\n padding: 4px 10px;\n cursor: pointer;\n font-size: 12px;\n color: #666;\n transition: all 0.15s;\n}\n\n.view-btn[_ngcontent-%COMP%]:last-child {\n border-right: none;\n}\n\n.view-btn[_ngcontent-%COMP%]:hover {\n background-color: #f0f0f0;\n color: #333;\n}\n\n.view-btn.active[_ngcontent-%COMP%] {\n background-color: #007AFF;\n color: #fff;\n}\n\n.item-count[_ngcontent-%COMP%] {\n font-size: 11px;\n color: #666;\n}\n\n\n\n\n\n\n.loading-state[_ngcontent-%COMP%], \n.error-state[_ngcontent-%COMP%], \n.empty-state[_ngcontent-%COMP%] {\n flex: 1;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n padding: 40px 20px;\n}\n\n.error-icon[_ngcontent-%COMP%], \n.empty-icon[_ngcontent-%COMP%] {\n font-size: 48px;\n color: #999;\n margin-bottom: 16px;\n}\n\n.error-message[_ngcontent-%COMP%], \n.empty-message[_ngcontent-%COMP%] {\n font-size: 14px;\n color: #666;\n margin-bottom: 16px;\n}\n\n.retry-btn[_ngcontent-%COMP%], \n.upload-btn[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 8px;\n background: #fff;\n border: 1px solid #ccc;\n padding: 8px 16px;\n cursor: pointer;\n border-radius: 3px;\n font-size: 13px;\n color: #333;\n transition: background-color 0.15s;\n}\n\n.retry-btn[_ngcontent-%COMP%]:hover, \n.upload-btn[_ngcontent-%COMP%]:hover {\n background-color: #f0f0f0;\n}\n\n\n\n\n\n\n.drag-overlay[_ngcontent-%COMP%] {\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n background-color: rgba(255, 255, 255, 0.95);\n z-index: 1000;\n display: flex;\n align-items: center;\n justify-content: center;\n border: 3px dashed #007AFF;\n}\n\n.drag-content[_ngcontent-%COMP%] {\n text-align: center;\n}\n\n.drag-icon[_ngcontent-%COMP%] {\n font-size: 64px;\n color: #007AFF;\n margin-bottom: 16px;\n}\n\n.drag-title[_ngcontent-%COMP%] {\n font-size: 20px;\n font-weight: 600;\n color: #007AFF;\n margin: 0;\n}\n\n\n\n\n\n\n.upload-progress[_ngcontent-%COMP%] {\n position: absolute;\n bottom: 40px;\n right: 20px;\n background: #fff;\n border: 1px solid #ccc;\n border-radius: 4px;\n padding: 12px 16px;\n box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);\n min-width: 300px;\n z-index: 100;\n}\n\n.progress-content[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n gap: 8px;\n}\n\n.progress-info[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 8px;\n font-size: 13px;\n color: #333;\n}\n\n.progress-bar-wrap[_ngcontent-%COMP%] {\n width: 100%;\n height: 6px;\n background-color: #e0e0e0;\n border-radius: 3px;\n overflow: hidden;\n}\n\n.progress-bar[_ngcontent-%COMP%] {\n height: 100%;\n background-color: #007AFF;\n transition: width 0.3s ease;\n}\n\n.progress-percent[_ngcontent-%COMP%] {\n font-size: 12px;\n color: #666;\n text-align: right;\n}\n\n\n\n\n\n\n.modal-overlay[_ngcontent-%COMP%] {\n position: fixed;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n background-color: rgba(0, 0, 0, 0.5);\n z-index: 2000;\n display: flex;\n align-items: center;\n justify-content: center;\n}\n\n.modal-dialog[_ngcontent-%COMP%] {\n background: #fff;\n border: 1px solid #999;\n border-radius: 4px;\n min-width: 400px;\n max-width: 90%;\n box-shadow: 0 4px 16px rgba(0, 0, 0, 0.3);\n}\n\n.modal-header[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n justify-content: space-between;\n padding: 12px 16px;\n background-color: #f8f8f8;\n border-bottom: 1px solid #ccc;\n}\n\n.modal-header[_ngcontent-%COMP%] h3[_ngcontent-%COMP%] {\n margin: 0;\n font-size: 14px;\n font-weight: 600;\n color: #333;\n}\n\n.modal-close[_ngcontent-%COMP%] {\n background: none;\n border: none;\n cursor: pointer;\n font-size: 16px;\n color: #666;\n padding: 4px;\n}\n\n.modal-close[_ngcontent-%COMP%]:hover {\n color: #333;\n}\n\n.modal-body[_ngcontent-%COMP%] {\n padding: 16px;\n}\n\n.modal-body[_ngcontent-%COMP%] label[_ngcontent-%COMP%] {\n display: block;\n margin-bottom: 6px;\n font-size: 12px;\n font-weight: 600;\n color: #333;\n}\n\n.modal-body[_ngcontent-%COMP%] input[type=\"text\"][_ngcontent-%COMP%] {\n width: 100%;\n padding: 6px 10px;\n border: 1px solid #ccc;\n border-radius: 3px;\n font-size: 13px;\n font-family: inherit;\n}\n\n.modal-body[_ngcontent-%COMP%] input[type=\"text\"][_ngcontent-%COMP%]:focus {\n outline: none;\n border-color: #007AFF;\n}\n\n.modal-body[_ngcontent-%COMP%] select[_ngcontent-%COMP%], \n.modal-body[_ngcontent-%COMP%] .provider-select[_ngcontent-%COMP%] {\n width: 100%;\n padding: 6px 10px;\n border: 1px solid #ccc;\n border-radius: 3px;\n font-size: 13px;\n font-family: inherit;\n background-color: #fff;\n cursor: pointer;\n}\n\n.modal-body[_ngcontent-%COMP%] select[_ngcontent-%COMP%]:focus, \n.modal-body[_ngcontent-%COMP%] .provider-select[_ngcontent-%COMP%]:focus {\n outline: none;\n border-color: #007AFF;\n}\n\n.modal-body[_ngcontent-%COMP%] select[_ngcontent-%COMP%]:disabled, \n.modal-body[_ngcontent-%COMP%] .provider-select[_ngcontent-%COMP%]:disabled {\n background-color: #f5f5f5;\n cursor: not-allowed;\n}\n\n.modal-body[_ngcontent-%COMP%] p[_ngcontent-%COMP%] {\n margin: 0 0 12px 0;\n font-size: 13px;\n color: #333;\n}\n\n.modal-body[_ngcontent-%COMP%] .warning[_ngcontent-%COMP%] {\n color: #D32F2F;\n font-size: 12px;\n}\n\n\n\n.account-checkbox-list[_ngcontent-%COMP%] {\n max-height: 200px;\n overflow-y: auto;\n border: 1px solid #ccc;\n border-radius: 4px;\n padding: 8px;\n background: #fafafa;\n}\n\n.account-checkbox-item[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 8px;\n padding: 6px 4px;\n border-radius: 3px;\n cursor: pointer;\n}\n\n.account-checkbox-item[_ngcontent-%COMP%]:hover {\n background-color: #e8f4fd;\n}\n\n.account-checkbox-item[_ngcontent-%COMP%] input[type=\"checkbox\"][_ngcontent-%COMP%] {\n width: 16px;\n height: 16px;\n cursor: pointer;\n accent-color: #007AFF;\n}\n\n.account-checkbox-item[_ngcontent-%COMP%] label[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 8px;\n cursor: pointer;\n font-size: 13px;\n font-weight: normal;\n margin: 0;\n}\n\n.provider-badge[_ngcontent-%COMP%] {\n font-size: 11px;\n color: #666;\n background: #e0e0e0;\n padding: 2px 6px;\n border-radius: 10px;\n}\n\n.copy-progress[_ngcontent-%COMP%] {\n margin-top: 12px;\n padding: 8px 12px;\n background: #e8f4fd;\n border-radius: 4px;\n font-size: 12px;\n color: #0066cc;\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n.modal-footer[_ngcontent-%COMP%] {\n display: flex;\n justify-content: flex-end;\n gap: 8px;\n padding: 12px 16px;\n background-color: #f8f8f8;\n border-top: 1px solid #ccc;\n}\n\n.modal-footer[_ngcontent-%COMP%] button[_ngcontent-%COMP%] {\n padding: 6px 16px;\n border: 1px solid #ccc;\n background: #fff;\n cursor: pointer;\n border-radius: 3px;\n font-size: 12px;\n font-weight: 500;\n transition: background-color 0.15s;\n}\n\n.modal-footer[_ngcontent-%COMP%] button[_ngcontent-%COMP%]:hover:not(:disabled) {\n background-color: #f0f0f0;\n}\n\n.modal-footer[_ngcontent-%COMP%] button[_ngcontent-%COMP%]:disabled {\n opacity: 0.5;\n cursor: not-allowed;\n}\n\n.modal-footer[_ngcontent-%COMP%] button.danger[_ngcontent-%COMP%] {\n background-color: #D32F2F;\n color: #fff;\n border-color: #D32F2F;\n}\n\n.modal-footer[_ngcontent-%COMP%] button.danger[_ngcontent-%COMP%]:hover:not(:disabled) {\n background-color: #B71C1C;\n}\n\n\n\n\n\n\n.file-table-wrapper[_ngcontent-%COMP%]::-webkit-scrollbar {\n width: 12px;\n height: 12px;\n}\n\n.file-table-wrapper[_ngcontent-%COMP%]::-webkit-scrollbar-track {\n background: #f0f0f0;\n}\n\n.file-table-wrapper[_ngcontent-%COMP%]::-webkit-scrollbar-thumb {\n background: #c0c0c0;\n border: 2px solid #f0f0f0;\n}\n\n.file-table-wrapper[_ngcontent-%COMP%]::-webkit-scrollbar-thumb:hover {\n background: #a0a0a0;\n}\n\n\n\n\n\n\n@media screen and (max-width: 768px) {\n .file-table[_ngcontent-%COMP%] {\n font-size: 11px;\n }\n\n .file-table[_ngcontent-%COMP%] th[_ngcontent-%COMP%], \n .file-table[_ngcontent-%COMP%] td[_ngcontent-%COMP%] {\n padding: 4px 6px;\n }\n\n .col-type[_ngcontent-%COMP%], \n .col-size[_ngcontent-%COMP%] {\n display: none;\n }\n\n .col-name[_ngcontent-%COMP%] {\n width: 60%;\n }\n\n .col-modified[_ngcontent-%COMP%] {\n width: 40%;\n }\n\n .toolbar-btn[_ngcontent-%COMP%] span[_ngcontent-%COMP%] {\n display: none;\n }\n\n .modal-dialog[_ngcontent-%COMP%] {\n min-width: 90%;\n }\n}\n\n\n\n\n\n\n.multi-search-btn[_ngcontent-%COMP%] {\n background: #fff;\n border: 1px solid #ccc;\n padding: 4px 8px;\n cursor: pointer;\n border-radius: 3px;\n font-size: 12px;\n color: #666;\n transition: all 0.15s;\n}\n\n.multi-search-btn[_ngcontent-%COMP%]:hover {\n background-color: #e8e8e8;\n color: #333;\n}\n\n.multi-search-btn.active[_ngcontent-%COMP%] {\n background-color: #007AFF;\n color: #fff;\n border-color: #007AFF;\n}\n\n.multi-provider-search-panel[_ngcontent-%COMP%] {\n background: #fff;\n border-bottom: 1px solid #ccc;\n display: flex;\n flex-direction: column;\n max-height: 70vh;\n overflow: hidden;\n}\n\n.search-panel-header[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n justify-content: space-between;\n padding: 10px 16px;\n background-color: #f0f7ff;\n border-bottom: 1px solid #cce8ff;\n}\n\n.search-panel-header[_ngcontent-%COMP%] h3[_ngcontent-%COMP%] {\n margin: 0;\n font-size: 14px;\n font-weight: 600;\n color: #007AFF;\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n.close-panel-btn[_ngcontent-%COMP%] {\n background: none;\n border: none;\n cursor: pointer;\n font-size: 16px;\n color: #666;\n padding: 4px;\n}\n\n.close-panel-btn[_ngcontent-%COMP%]:hover {\n color: #333;\n}\n\n.search-panel-body[_ngcontent-%COMP%] {\n padding: 16px;\n}\n\n.search-input-row[_ngcontent-%COMP%] {\n display: flex;\n gap: 8px;\n margin-bottom: 16px;\n}\n\n.multi-search-input[_ngcontent-%COMP%] {\n flex: 1;\n padding: 8px 12px;\n border: 1px solid #ccc;\n border-radius: 4px;\n font-size: 13px;\n font-family: inherit;\n}\n\n.multi-search-input[_ngcontent-%COMP%]:focus {\n outline: none;\n border-color: #007AFF;\n}\n\n.search-execute-btn[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 6px;\n background: #007AFF;\n color: #fff;\n border: none;\n padding: 8px 16px;\n cursor: pointer;\n border-radius: 4px;\n font-size: 13px;\n font-weight: 500;\n transition: background-color 0.15s;\n}\n\n.search-execute-btn[_ngcontent-%COMP%]:hover:not(:disabled) {\n background-color: #0056b3;\n}\n\n.search-execute-btn[_ngcontent-%COMP%]:disabled {\n opacity: 0.5;\n cursor: not-allowed;\n}\n\n.provider-selection[_ngcontent-%COMP%] {\n margin-bottom: 8px;\n}\n\n.provider-selection-label[_ngcontent-%COMP%] {\n display: block;\n font-size: 12px;\n font-weight: 600;\n color: #333;\n margin-bottom: 8px;\n}\n\n.provider-checkboxes[_ngcontent-%COMP%] {\n display: flex;\n flex-wrap: wrap;\n gap: 12px;\n}\n\n.provider-checkbox[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 6px;\n font-size: 13px;\n color: #333;\n cursor: pointer;\n padding: 4px 8px;\n border: 1px solid #e0e0e0;\n border-radius: 4px;\n background: #fafafa;\n transition: all 0.15s;\n}\n\n.provider-checkbox[_ngcontent-%COMP%]:hover:not(.disabled) {\n border-color: #007AFF;\n background: #f0f7ff;\n}\n\n.provider-checkbox.disabled[_ngcontent-%COMP%] {\n opacity: 0.6;\n cursor: not-allowed;\n background: #f5f5f5;\n}\n\n.provider-checkbox[_ngcontent-%COMP%] input[type=\"checkbox\"][_ngcontent-%COMP%] {\n cursor: pointer;\n}\n\n.provider-checkbox[_ngcontent-%COMP%] .provider-name[_ngcontent-%COMP%] {\n font-weight: 500;\n}\n\n.no-search-badge[_ngcontent-%COMP%] {\n font-size: 10px;\n color: #999;\n font-style: italic;\n}\n\n\n\n.search-results-container[_ngcontent-%COMP%] {\n flex: 1;\n overflow: auto;\n border-top: 1px solid #e0e0e0;\n}\n\n.search-results-summary[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 12px;\n padding: 10px 16px;\n background: #f8f8f8;\n border-bottom: 1px solid #e0e0e0;\n}\n\n.search-results-summary[_ngcontent-%COMP%] .result-count[_ngcontent-%COMP%] {\n font-weight: 600;\n font-size: 13px;\n color: #333;\n}\n\n.search-results-summary[_ngcontent-%COMP%] .provider-stats[_ngcontent-%COMP%] {\n font-size: 12px;\n color: #666;\n}\n\n.search-results-summary[_ngcontent-%COMP%] .failed-count[_ngcontent-%COMP%] {\n color: #D32F2F;\n}\n\n.clear-results-btn[_ngcontent-%COMP%] {\n margin-left: auto;\n background: none;\n border: 1px solid #ccc;\n padding: 4px 10px;\n cursor: pointer;\n border-radius: 3px;\n font-size: 11px;\n color: #666;\n display: flex;\n align-items: center;\n gap: 4px;\n}\n\n.clear-results-btn[_ngcontent-%COMP%]:hover {\n background: #f0f0f0;\n color: #333;\n}\n\n.provider-results-list[_ngcontent-%COMP%] {\n padding: 8px 0;\n}\n\n.provider-result-group[_ngcontent-%COMP%] {\n margin-bottom: 16px;\n}\n\n.provider-result-group[_ngcontent-%COMP%]:last-child {\n margin-bottom: 0;\n}\n\n.provider-result-header[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 8px;\n padding: 8px 16px;\n background: #f5f5f5;\n font-size: 13px;\n font-weight: 600;\n color: #333;\n}\n\n.provider-result-header[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n color: #007AFF;\n}\n\n.provider-result-header[_ngcontent-%COMP%] .result-count[_ngcontent-%COMP%] {\n font-weight: normal;\n color: #666;\n}\n\n.provider-result-group.failed[_ngcontent-%COMP%] .provider-result-header[_ngcontent-%COMP%] {\n background: #fff5f5;\n}\n\n.provider-result-group.failed[_ngcontent-%COMP%] .provider-result-header[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n color: #D32F2F;\n}\n\n.error-badge[_ngcontent-%COMP%] {\n color: #D32F2F;\n font-weight: normal;\n font-size: 12px;\n display: flex;\n align-items: center;\n gap: 4px;\n}\n\n.provider-result-files[_ngcontent-%COMP%] {\n padding: 0;\n}\n\n.search-result-item[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 12px;\n padding: 8px 16px 8px 40px;\n border-bottom: 1px solid #f0f0f0;\n cursor: pointer;\n transition: background-color 0.1s;\n}\n\n.search-result-item[_ngcontent-%COMP%]:hover {\n background-color: #f8f8f8;\n}\n\n.search-result-item[_ngcontent-%COMP%]:last-child {\n border-bottom: none;\n}\n\n.search-result-item[_ngcontent-%COMP%] .file-icon[_ngcontent-%COMP%] {\n font-size: 16px;\n color: #666;\n flex-shrink: 0;\n}\n\n.search-result-item[_ngcontent-%COMP%] .file-info[_ngcontent-%COMP%] {\n flex: 1;\n min-width: 0;\n display: flex;\n flex-direction: column;\n gap: 2px;\n}\n\n.search-result-item[_ngcontent-%COMP%] .file-name[_ngcontent-%COMP%] {\n font-size: 13px;\n font-weight: 500;\n color: #333;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\n.search-result-item[_ngcontent-%COMP%] .file-path[_ngcontent-%COMP%] {\n font-size: 11px;\n color: #999;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\n.search-result-item[_ngcontent-%COMP%] .file-size[_ngcontent-%COMP%] {\n font-size: 12px;\n color: #666;\n flex-shrink: 0;\n min-width: 60px;\n text-align: right;\n}\n\n.search-result-item[_ngcontent-%COMP%] .file-date[_ngcontent-%COMP%] {\n font-size: 12px;\n color: #666;\n flex-shrink: 0;\n min-width: 140px;\n text-align: right;\n}\n\n.no-results-message[_ngcontent-%COMP%] {\n padding: 16px 40px;\n font-size: 12px;\n color: #999;\n font-style: italic;\n}\n\n.searching-state[_ngcontent-%COMP%] {\n padding: 40px 20px;\n display: flex;\n align-items: center;\n justify-content: center;\n}"] });
|
|
2380
2398
|
}
|
|
2381
2399
|
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(FileGridComponent, [{
|
|
2382
2400
|
type: Component,
|
|
2383
|
-
args: [{ selector: 'mj-file-grid', template: "<div class=\"file-grid-container\"\n (dragenter)=\"onDragEnter($event)\"\n (dragover)=\"onDragOver($event)\"\n (dragleave)=\"onDragLeave($event)\"\n (drop)=\"onDrop($event)\">\n <!-- Breadcrumb Navigation Bar -->\n <div class=\"breadcrumb-bar\" *ngIf=\"!isLoading && !errorMessage\">\n <div class=\"nav-buttons\">\n <button class=\"nav-btn\"\n [disabled]=\"!canNavigateUp()\"\n (click)=\"navigateUp()\"\n title=\"Go up to parent folder\">\n <i class=\"fa-solid fa-arrow-up\"></i>\n </button>\n <button class=\"nav-btn\" (click)=\"refresh()\" title=\"Refresh\">\n <i class=\"fa-solid fa-arrows-rotate\"></i>\n </button>\n </div>\n <div class=\"breadcrumb-path\">\n <i class=\"fa-solid fa-folder\"></i>\n <span class=\"path-text\">{{ folderPath || 'Root' }} /</span>\n </div>\n <div class=\"search-bar\">\n <input type=\"text\"\n class=\"search-input\"\n [(ngModel)]=\"searchQuery\"\n (ngModelChange)=\"onSearchChange($event)\"\n placeholder=\"Search files and folders...\"\n [disabled]=\"isLoading || isMultiProviderSearchMode\">\n <button class=\"search-clear-btn\"\n *ngIf=\"searchQuery && !isMultiProviderSearchMode\"\n (click)=\"clearSearch()\"\n title=\"Clear search\">\n <i class=\"fa-solid fa-xmark\"></i>\n </button>\n <select class=\"file-type-filter\"\n [(ngModel)]=\"fileTypeFilter\"\n (ngModelChange)=\"onFileTypeFilterChange($event)\"\n [disabled]=\"isLoading || isMultiProviderSearchMode\">\n <option value=\"all\">All</option>\n <option value=\"files\">Files</option>\n <option value=\"folders\">Folders</option>\n </select>\n <button class=\"multi-search-btn\"\n [class.active]=\"isMultiProviderSearchMode\"\n (click)=\"toggleMultiAccountSearchMode()\"\n title=\"Search across all storage providers\">\n <i class=\"fa-solid fa-magnifying-glass-plus\"></i>\n </button>\n </div>\n </div>\n\n <!-- Multi-Provider Search Panel -->\n <div class=\"multi-provider-search-panel\" *ngIf=\"isMultiProviderSearchMode\">\n <div class=\"search-panel-header\">\n <h3><i class=\"fa-solid fa-magnifying-glass\"></i> Search Across Providers</h3>\n <button class=\"close-panel-btn\" (click)=\"toggleMultiAccountSearchMode()\">\n <i class=\"fa-solid fa-xmark\"></i>\n </button>\n </div>\n\n <div class=\"search-panel-body\">\n <div class=\"search-input-row\">\n <input type=\"text\"\n class=\"multi-search-input\"\n [(ngModel)]=\"multiProviderSearchQuery\"\n placeholder=\"Enter search term...\"\n (keydown.enter)=\"executeMultiAccountSearch()\"\n [disabled]=\"isSearching\">\n <button class=\"search-execute-btn\"\n (click)=\"executeMultiAccountSearch()\"\n [disabled]=\"isSearching || !multiProviderSearchQuery.trim() || selectedSearchProviders.size === 0\">\n <i class=\"fa-solid fa-spinner fa-spin\" *ngIf=\"isSearching\"></i>\n <i class=\"fa-solid fa-search\" *ngIf=\"!isSearching\"></i>\n {{ isSearching ? 'Searching...' : 'Search' }}\n </button>\n </div>\n\n <div class=\"provider-selection\">\n <label class=\"provider-selection-label\">Select accounts to search:</label>\n <div class=\"provider-checkboxes\">\n <label *ngFor=\"let a of availableAccounts\"\n class=\"provider-checkbox\"\n [class.disabled]=\"!accountSupportsSearch(a)\"\n [title]=\"accountSupportsSearch(a) ? '' : 'This account does not support search'\">\n <input type=\"checkbox\"\n [checked]=\"isAccountSelectedForSearch(a.account.ID)\"\n (change)=\"toggleSearchAccount(a.account.ID)\"\n [disabled]=\"!accountSupportsSearch(a)\">\n <span class=\"provider-name\">{{ a.account.Name }}</span>\n <span class=\"provider-type\">({{ a.provider.Name }})</span>\n <span class=\"no-search-badge\" *ngIf=\"!accountSupportsSearch(a)\">(no search)</span>\n </label>\n </div>\n </div>\n </div>\n\n <!-- Search Results -->\n <div class=\"search-results-container\" *ngIf=\"multiProviderSearchResults\">\n <div class=\"search-results-summary\">\n <span class=\"result-count\">{{ multiProviderSearchResults.totalResultsReturned }} result(s) found</span>\n <span class=\"provider-stats\">\n ({{ multiProviderSearchResults.successfulAccounts }} account(s) searched\n <span *ngIf=\"multiProviderSearchResults.failedAccounts > 0\" class=\"failed-count\">\n , {{ multiProviderSearchResults.failedAccounts }} failed\n </span>)\n </span>\n <button class=\"clear-results-btn\" (click)=\"clearMultiProviderSearch()\">\n <i class=\"fa-solid fa-xmark\"></i> Clear\n </button>\n </div>\n\n <div class=\"provider-results-list\">\n <div *ngFor=\"let accountResult of multiProviderSearchResults.accountResults\"\n class=\"provider-result-group\"\n [class.failed]=\"!accountResult.success\">\n <div class=\"provider-result-header\">\n <i class=\"fa-solid fa-cloud\"></i>\n <span class=\"provider-name\">{{ accountResult.accountName }}</span>\n <span class=\"result-count\" *ngIf=\"accountResult.success\">\n ({{ accountResult.results.length }} result(s))\n </span>\n <span class=\"error-badge\" *ngIf=\"!accountResult.success\">\n <i class=\"fa-solid fa-exclamation-triangle\"></i>\n {{ accountResult.errorMessage }}\n </span>\n </div>\n\n <div class=\"provider-result-files\" *ngIf=\"accountResult.success && accountResult.results.length > 0\">\n <div *ngFor=\"let file of accountResult.results\" class=\"search-result-item\">\n <i [class]=\"getSearchResultIcon(file)\" class=\"file-icon\"></i>\n <div class=\"file-info\">\n <span class=\"file-name\">{{ file.name }}</span>\n <span class=\"file-path\">{{ file.path }}</span>\n </div>\n <span class=\"file-size\">{{ formatSearchResultSize(file.size) }}</span>\n <span class=\"file-date\">{{ formatSearchResultDate(file.lastModified) }}</span>\n </div>\n </div>\n\n <div class=\"no-results-message\" *ngIf=\"accountResult.success && accountResult.results.length === 0\">\n No matching files found\n </div>\n </div>\n </div>\n </div>\n\n <!-- Searching State -->\n <div class=\"searching-state\" *ngIf=\"isSearching\">\n <mj-loading text=\"Searching across providers...\"></mj-loading>\n </div>\n </div>\n\n <!-- Loading State -->\n <div class=\"loading-state\" *ngIf=\"isLoading && !isMultiProviderSearchMode\">\n <mj-loading text=\"Loading files...\"></mj-loading>\n </div>\n\n <!-- Error State -->\n <div class=\"error-state\" *ngIf=\"errorMessage && !isLoading\">\n <div class=\"error-icon\">\n <i class=\"fa-solid fa-circle-exclamation\"></i>\n </div>\n <p class=\"error-message\">{{ errorMessage }}</p>\n <button class=\"retry-btn\" (click)=\"refresh()\">\n <i class=\"fa-solid fa-arrows-rotate\"></i>\n Retry\n </button>\n </div>\n\n <!-- List View -->\n <div class=\"file-table-wrapper\" *ngIf=\"!isLoading && !errorMessage && filteredItems.length > 0 && viewMode === 'list'\">\n <table class=\"file-table\">\n <thead>\n <tr>\n <th class=\"col-name\" (click)=\"onSortChange([{ field: 'name', dir: sort[0].field === 'name' && sort[0].dir === 'asc' ? 'desc' : 'asc' }])\">\n <span>Name</span>\n <i class=\"fa-solid sort-icon\"\n [class.fa-caret-up]=\"sort[0].field === 'name' && sort[0].dir === 'asc'\"\n [class.fa-caret-down]=\"sort[0].field === 'name' && sort[0].dir === 'desc'\"\n [class.fa-sort]=\"sort[0].field !== 'name'\"></i>\n </th>\n <th class=\"col-type\">Type</th>\n <th class=\"col-size\" (click)=\"onSortChange([{ field: 'size', dir: sort[0].field === 'size' && sort[0].dir === 'asc' ? 'desc' : 'asc' }])\">\n <span>Size</span>\n <i class=\"fa-solid sort-icon\"\n [class.fa-caret-up]=\"sort[0].field === 'size' && sort[0].dir === 'asc'\"\n [class.fa-caret-down]=\"sort[0].field === 'size' && sort[0].dir === 'desc'\"\n [class.fa-sort]=\"sort[0].field !== 'size'\"></i>\n </th>\n <th class=\"col-modified\" (click)=\"onSortChange([{ field: 'lastModified', dir: sort[0].field === 'lastModified' && sort[0].dir === 'asc' ? 'desc' : 'asc' }])\">\n <span>Modified</span>\n <i class=\"fa-solid sort-icon\"\n [class.fa-caret-up]=\"sort[0].field === 'lastModified' && sort[0].dir === 'asc'\"\n [class.fa-caret-down]=\"sort[0].field === 'lastModified' && sort[0].dir === 'desc'\"\n [class.fa-sort]=\"sort[0].field !== 'lastModified'\"></i>\n </th>\n </tr>\n </thead>\n <tbody>\n <tr *ngFor=\"let item of filteredItems\"\n class=\"file-row\"\n [class.selected]=\"selectedItems.includes(item.key)\"\n (click)=\"onTileClick(item, $event)\"\n (dblclick)=\"onItemDoubleClick(item)\">\n <td class=\"col-name\">\n <i [class]=\"getItemIcon(item)\" class=\"item-icon\"></i>\n <span class=\"item-name\">{{ item.name }}</span>\n </td>\n <td class=\"col-type\">\n <span class=\"item-type\">{{ getFileType(item) }}</span>\n </td>\n <td class=\"col-size\">\n <span class=\"item-size\">{{ item.type === 'folder' ? '\u2014' : formatFileSize(item.size) }}</span>\n </td>\n <td class=\"col-modified\">\n <span class=\"item-date\">{{ formatDate(item.lastModified) }}</span>\n </td>\n </tr>\n </tbody>\n </table>\n </div>\n\n <!-- Grid View -->\n <div class=\"file-grid-wrapper\" *ngIf=\"!isLoading && !errorMessage && filteredItems.length > 0 && viewMode === 'grid'\">\n <div class=\"file-grid\">\n <div *ngFor=\"let item of filteredItems\"\n class=\"grid-item\"\n [class.selected]=\"selectedItems.includes(item.key)\"\n (click)=\"onTileClick(item, $event)\"\n (dblclick)=\"onItemDoubleClick(item)\">\n <div class=\"grid-icon\">\n <i [class]=\"getItemIcon(item)\"></i>\n </div>\n <div class=\"grid-name\">{{ item.name }}</div>\n <div class=\"grid-meta\" *ngIf=\"item.type === 'file'\">{{ formatFileSize(item.size) }}</div>\n <div class=\"grid-meta\" *ngIf=\"item.type === 'folder'\">Folder</div>\n </div>\n </div>\n </div>\n\n <!-- Empty State -->\n <div class=\"empty-state\" *ngIf=\"!isLoading && !errorMessage && filteredItems.length === 0\">\n <div class=\"empty-icon\">\n <i class=\"fa-solid fa-folder-open\"></i>\n </div>\n <p class=\"empty-message\">This folder is empty</p>\n <button class=\"upload-btn\" (click)=\"onUploadClick()\">\n <i class=\"fa-solid fa-upload\"></i>\n Upload Files\n </button>\n </div>\n\n <!-- Bottom Toolbar -->\n <div class=\"bottom-toolbar\" *ngIf=\"!isLoading && !errorMessage\">\n <div class=\"toolbar-left\">\n <button class=\"toolbar-btn\" (click)=\"onUploadClick()\">\n <i class=\"fa-solid fa-upload\"></i>\n Upload\n </button>\n <button class=\"toolbar-btn\" (click)=\"onNewFolderClick()\">\n <i class=\"fa-solid fa-folder-plus\"></i>\n New Folder\n </button>\n <button class=\"toolbar-btn\"\n [disabled]=\"selectedItems.length !== 1\"\n (click)=\"onDownloadClick()\">\n <i class=\"fa-solid fa-download\"></i>\n Download\n </button>\n <button class=\"toolbar-btn\"\n [disabled]=\"selectedItems.length !== 1\"\n (click)=\"onRenameClick()\">\n <i class=\"fa-solid fa-pen\"></i>\n Rename\n </button>\n <button class=\"toolbar-btn\"\n [disabled]=\"selectedItems.length !== 1\"\n (click)=\"onCopyClick()\">\n <i class=\"fa-solid fa-copy\"></i>\n Copy\n </button>\n <button class=\"toolbar-btn\"\n [disabled]=\"selectedItems.length !== 1 || getSelectedItem()?.type === 'folder'\"\n (click)=\"onCopyToAccountClick()\"\n title=\"Copy file to another storage account\">\n <i class=\"fa-solid fa-cloud-arrow-up\"></i>\n Copy to...\n </button>\n <button class=\"toolbar-btn\"\n [disabled]=\"selectedItems.length !== 1\"\n (click)=\"onMoveClick()\">\n <i class=\"fa-solid fa-arrows-up-down-left-right\"></i>\n Move\n </button>\n <button class=\"toolbar-btn\"\n [disabled]=\"selectedItems.length === 0\"\n (click)=\"onDeleteClick()\">\n <i class=\"fa-solid fa-trash\"></i>\n Delete\n </button>\n </div>\n <div class=\"toolbar-right\">\n <!-- View Toggle -->\n <div class=\"view-toggle\">\n <button class=\"view-btn\"\n [class.active]=\"viewMode === 'list'\"\n (click)=\"viewMode = 'list'\"\n title=\"List View\">\n <i class=\"fa-solid fa-list\"></i>\n </button>\n <button class=\"view-btn\"\n [class.active]=\"viewMode === 'grid'\"\n (click)=\"viewMode = 'grid'\"\n title=\"Grid View\">\n <i class=\"fa-solid fa-th\"></i>\n </button>\n </div>\n <span class=\"item-count\">\n {{ filteredItems.length }} {{ filteredItems.length === 1 ? 'item' : 'filteredItems' }}\n </span>\n </div>\n </div>\n\n <!-- Drag & Drop Overlay -->\n <div class=\"drag-overlay\" *ngIf=\"isDragging\">\n <div class=\"drag-content\">\n <div class=\"drag-icon\">\n <i class=\"fa-solid fa-cloud-arrow-up\"></i>\n </div>\n <h2 class=\"drag-title\">Drop files to upload</h2>\n </div>\n </div>\n\n <!-- Upload Progress -->\n <div class=\"upload-progress\" *ngIf=\"isUploading\">\n <div class=\"progress-content\">\n <div class=\"progress-info\">\n <i class=\"fa-solid fa-spinner fa-spin\"></i>\n <span>Uploading {{ uploadingFileName }}...</span>\n </div>\n <div class=\"progress-bar-wrap\">\n <div class=\"progress-bar\" [style.width.%]=\"uploadProgress\"></div>\n </div>\n <span class=\"progress-percent\">{{ uploadProgress }}%</span>\n </div>\n </div>\n</div>\n\n<!-- New Folder Modal -->\n<div class=\"modal-overlay\" *ngIf=\"showNewFolderDialog\" (click)=\"onCancelNewFolder()\">\n <div class=\"modal-dialog\" (click)=\"$event.stopPropagation()\">\n <div class=\"modal-header\">\n <h3>Create New Folder</h3>\n <button class=\"modal-close\" (click)=\"onCancelNewFolder()\">\n <i class=\"fa-solid fa-xmark\"></i>\n </button>\n </div>\n <div class=\"modal-body\">\n <label>Folder name:</label>\n <input type=\"text\"\n [(ngModel)]=\"newFolderName\"\n [disabled]=\"isCreatingFolder\"\n placeholder=\"Enter folder name\"\n (keydown.enter)=\"onCreateFolder()\">\n </div>\n <div class=\"modal-footer\">\n <button (click)=\"onCancelNewFolder()\" [disabled]=\"isCreatingFolder\">Cancel</button>\n <button (click)=\"onCreateFolder()\" [disabled]=\"!newFolderName.trim() || isCreatingFolder\">\n <i class=\"fa-solid fa-spinner fa-spin\" *ngIf=\"isCreatingFolder\"></i>\n {{ isCreatingFolder ? 'Creating...' : 'Create' }}\n </button>\n </div>\n </div>\n</div>\n\n<!-- Delete Confirmation Modal -->\n<div class=\"modal-overlay\" *ngIf=\"showDeleteDialog && itemToDelete\" (click)=\"onCancelDelete()\">\n <div class=\"modal-dialog\" (click)=\"$event.stopPropagation()\">\n <div class=\"modal-header\">\n <h3>Delete {{ itemToDelete.type === 'folder' ? 'Folder' : 'File' }}?</h3>\n <button class=\"modal-close\" (click)=\"onCancelDelete()\">\n <i class=\"fa-solid fa-xmark\"></i>\n </button>\n </div>\n <div class=\"modal-body\">\n <p>Are you sure you want to delete <strong>{{ itemToDelete.name }}</strong>?</p>\n <p *ngIf=\"itemToDelete.type === 'folder'\" class=\"warning\">This will delete the folder and all its contents.</p>\n </div>\n <div class=\"modal-footer\">\n <button (click)=\"onCancelDelete()\" [disabled]=\"isDeleting\">Cancel</button>\n <button (click)=\"onConfirmDelete()\" [disabled]=\"isDeleting\" class=\"danger\">\n <i class=\"fa-solid fa-spinner fa-spin\" *ngIf=\"isDeleting\"></i>\n {{ isDeleting ? 'Deleting...' : 'Delete' }}\n </button>\n </div>\n </div>\n</div>\n\n<!-- Rename Modal -->\n<div class=\"modal-overlay\" *ngIf=\"showRenameDialog && itemToRename\" (click)=\"onCancelRename()\">\n <div class=\"modal-dialog\" (click)=\"$event.stopPropagation()\">\n <div class=\"modal-header\">\n <h3>Rename {{ itemToRename.type === 'folder' ? 'Folder' : 'File' }}</h3>\n <button class=\"modal-close\" (click)=\"onCancelRename()\">\n <i class=\"fa-solid fa-xmark\"></i>\n </button>\n </div>\n <div class=\"modal-body\">\n <label>New name:</label>\n <input type=\"text\"\n [(ngModel)]=\"newItemName\"\n [disabled]=\"isRenaming\"\n placeholder=\"Enter new name\"\n (keydown.enter)=\"onConfirmRename()\">\n </div>\n <div class=\"modal-footer\">\n <button (click)=\"onCancelRename()\" [disabled]=\"isRenaming\">Cancel</button>\n <button (click)=\"onConfirmRename()\" [disabled]=\"isRenaming || !newItemName.trim()\">\n <i class=\"fa-solid fa-spinner fa-spin\" *ngIf=\"isRenaming\"></i>\n {{ isRenaming ? 'Renaming...' : 'Rename' }}\n </button>\n </div>\n </div>\n</div>\n\n<!-- Copy Modal -->\n<div class=\"modal-overlay\" *ngIf=\"showCopyDialog && itemToCopy\" (click)=\"onCancelCopy()\">\n <div class=\"modal-dialog\" (click)=\"$event.stopPropagation()\">\n <div class=\"modal-header\">\n <h3>Copy {{ itemToCopy.type === 'folder' ? 'Folder' : 'File' }}</h3>\n <button class=\"modal-close\" (click)=\"onCancelCopy()\">\n <i class=\"fa-solid fa-xmark\"></i>\n </button>\n </div>\n <div class=\"modal-body\">\n <p>Copying: <strong>{{ itemToCopy.name }}</strong></p>\n <label>Destination path:</label>\n <input type=\"text\"\n [(ngModel)]=\"copyDestinationPath\"\n [disabled]=\"isCopying\"\n placeholder=\"Enter destination path\"\n (keydown.enter)=\"onConfirmCopy()\">\n </div>\n <div class=\"modal-footer\">\n <button (click)=\"onCancelCopy()\" [disabled]=\"isCopying\">Cancel</button>\n <button (click)=\"onConfirmCopy()\" [disabled]=\"isCopying || !copyDestinationPath.trim()\">\n <i class=\"fa-solid fa-spinner fa-spin\" *ngIf=\"isCopying\"></i>\n {{ isCopying ? 'Copying...' : 'Copy' }}\n </button>\n </div>\n </div>\n</div>\n\n<!-- Move Modal -->\n<div class=\"modal-overlay\" *ngIf=\"showMoveDialog && itemToMove\" (click)=\"onCancelMove()\">\n <div class=\"modal-dialog\" (click)=\"$event.stopPropagation()\">\n <div class=\"modal-header\">\n <h3>Move {{ itemToMove.type === 'folder' ? 'Folder' : 'File' }}</h3>\n <button class=\"modal-close\" (click)=\"onCancelMove()\">\n <i class=\"fa-solid fa-xmark\"></i>\n </button>\n </div>\n <div class=\"modal-body\">\n <p>Moving: <strong>{{ itemToMove.name }}</strong></p>\n <label>Destination folder path:</label>\n <input type=\"text\"\n [(ngModel)]=\"moveDestinationPath\"\n [disabled]=\"isMoving\"\n placeholder=\"Enter destination folder (e.g., folder1/folder2/)\"\n (keydown.enter)=\"onConfirmMove()\">\n <p style=\"font-size: 11px; color: #666; margin-top: 8px;\">\n File will be moved to: {{ moveDestinationPath }}{{ itemToMove.name }}\n </p>\n </div>\n <div class=\"modal-footer\">\n <button (click)=\"onCancelMove()\" [disabled]=\"isMoving\">Cancel</button>\n <button (click)=\"onConfirmMove()\" [disabled]=\"isMoving || !moveDestinationPath.trim()\">\n <i class=\"fa-solid fa-spinner fa-spin\" *ngIf=\"isMoving\"></i>\n {{ isMoving ? 'Moving...' : 'Move' }}\n </button>\n </div>\n </div>\n</div>\n\n<!-- Copy to Account Modal -->\n<div class=\"modal-overlay\" *ngIf=\"showCopyToProviderDialog && itemToCopyToProvider\" (click)=\"onCancelCopyToAccount()\">\n <div class=\"modal-dialog\" (click)=\"$event.stopPropagation()\">\n <div class=\"modal-header\">\n <h3>Copy to Another Account</h3>\n <button class=\"modal-close\" (click)=\"onCancelCopyToAccount()\">\n <i class=\"fa-solid fa-xmark\"></i>\n </button>\n </div>\n <div class=\"modal-body\">\n <p>Copying: <strong>{{ itemToCopyToProvider.name }}</strong></p>\n <p style=\"font-size: 12px; color: #666; margin-bottom: 16px;\">\n From: <strong>{{ account?.account?.Name }}</strong>\n </p>\n\n <label>Select destination account(s):</label>\n <div class=\"account-checkbox-list\">\n <div *ngFor=\"let a of availableAccounts\" class=\"account-checkbox-item\">\n <input type=\"checkbox\"\n [id]=\"'dest-account-' + a.account.ID\"\n [checked]=\"isDestinationAccountSelected(a.account.ID)\"\n [disabled]=\"isCopyingToAccount\"\n (change)=\"toggleDestinationAccount(a.account.ID)\">\n <label [for]=\"'dest-account-' + a.account.ID\">\n {{ a.account.Name }} <span class=\"provider-badge\">{{ a.provider.Name }}</span>\n </label>\n </div>\n </div>\n\n <label style=\"margin-top: 16px;\">Destination filename:</label>\n <input type=\"text\"\n [(ngModel)]=\"copyToAccountDestinationPath\"\n [disabled]=\"isCopyingToAccount\"\n placeholder=\"Enter destination filename\"\n (keydown.enter)=\"onConfirmCopyToAccount()\">\n <div *ngIf=\"copyToAccountProgress\" class=\"copy-progress\">\n <i class=\"fa-solid fa-spinner fa-spin\"></i>\n Copying to {{ copyToAccountProgress.currentAccount }} ({{ copyToAccountProgress.current }}/{{ copyToAccountProgress.total }})...\n </div>\n </div>\n <div class=\"modal-footer\">\n <button (click)=\"onCancelCopyToAccount()\" [disabled]=\"isCopyingToAccount\">Cancel</button>\n <button (click)=\"onConfirmCopyToAccount()\"\n [disabled]=\"isCopyingToAccount || selectedDestinationAccounts.size === 0 || !copyToAccountDestinationPath.trim()\">\n <i class=\"fa-solid fa-spinner fa-spin\" *ngIf=\"isCopyingToAccount\"></i>\n {{ isCopyingToAccount ? 'Copying...' : 'Copy to ' + selectedDestinationAccounts.size + ' account' + (selectedDestinationAccounts.size !== 1 ? 's' : '') }}\n </button>\n </div>\n </div>\n</div>\n", styles: ["/* ===========================\n File Grid - Traditional File Manager Style\n =========================== */\n\n:host {\n display: flex;\n flex-direction: column;\n height: 100%;\n width: 100%;\n background-color: #fff;\n font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;\n}\n\n.file-grid-container {\n display: flex;\n flex-direction: column;\n height: 100%;\n width: 100%;\n position: relative;\n}\n\n/* ===========================\n Breadcrumb Navigation Bar\n =========================== */\n\n.breadcrumb-bar {\n display: flex;\n align-items: center;\n padding: 6px 10px;\n background-color: #f8f8f8;\n border-bottom: 1px solid #ccc;\n gap: 10px;\n flex-wrap: wrap;\n}\n\n.nav-buttons {\n display: flex;\n gap: 4px;\n}\n\n.nav-btn {\n background: #fff;\n border: 1px solid #ccc;\n padding: 4px 8px;\n cursor: pointer;\n border-radius: 3px;\n font-size: 12px;\n color: #333;\n transition: background-color 0.15s;\n}\n\n.nav-btn:hover:not(:disabled) {\n background-color: #e8e8e8;\n}\n\n.nav-btn:disabled {\n opacity: 0.5;\n cursor: not-allowed;\n}\n\n.breadcrumb-path {\n display: flex;\n align-items: center;\n gap: 6px;\n font-size: 12px;\n color: #333;\n}\n\n.breadcrumb-path i {\n color: #666;\n}\n\n.path-text {\n font-weight: 500;\n}\n\n.search-bar {\n display: flex;\n align-items: center;\n gap: 6px;\n margin-left: auto;\n position: relative;\n}\n\n.search-input {\n padding: 4px 30px 4px 8px;\n border: 1px solid #ccc;\n border-radius: 3px;\n font-size: 12px;\n font-family: inherit;\n min-width: 200px;\n}\n\n.search-input:focus {\n outline: none;\n border-color: #007AFF;\n}\n\n.search-clear-btn {\n position: absolute;\n right: 142px;\n background: none;\n border: none;\n cursor: pointer;\n color: #999;\n padding: 4px;\n font-size: 12px;\n}\n\n.search-clear-btn:hover {\n color: #333;\n}\n\n.file-type-filter {\n padding: 4px 8px;\n border: 1px solid #ccc;\n border-radius: 3px;\n font-size: 12px;\n font-family: inherit;\n background: #fff;\n cursor: pointer;\n}\n\n.file-type-filter:focus {\n outline: none;\n border-color: #007AFF;\n}\n\n/* ===========================\n File Table\n =========================== */\n\n.file-table-wrapper {\n flex: 1;\n overflow: auto;\n border-bottom: 1px solid #ccc;\n}\n\n.file-table {\n width: 100%;\n border-collapse: collapse;\n font-size: 12px;\n}\n\n.file-table thead {\n position: sticky;\n top: 0;\n background-color: #f0f0f0;\n z-index: 10;\n}\n\n.file-table th {\n text-align: left;\n padding: 6px 10px;\n border-bottom: 1px solid #ccc;\n font-weight: 600;\n color: #333;\n cursor: pointer;\n user-select: none;\n}\n\n.file-table th:hover {\n background-color: #e8e8e8;\n}\n\n.file-table th span {\n margin-right: 4px;\n}\n\n.sort-icon {\n font-size: 10px;\n color: #666;\n}\n\n.file-table tbody tr {\n border-bottom: 1px solid #e8e8e8;\n cursor: pointer;\n transition: background-color 0.1s;\n}\n\n.file-table tbody tr:hover {\n background-color: #f8f8f8;\n}\n\n.file-table tbody tr.selected {\n background-color: #cce8ff;\n}\n\n.file-table tbody tr.selected:hover {\n background-color: #b3d9ff;\n}\n\n.file-table td {\n padding: 6px 10px;\n color: #333;\n}\n\n/* Column Widths */\n.col-name {\n width: 50%;\n}\n\n.col-type {\n width: 15%;\n}\n\n.col-size {\n width: 15%;\n}\n\n.col-modified {\n width: 20%;\n}\n\n/* Name Column with Icon */\n.col-name {\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n.item-icon {\n font-size: 14px;\n color: #666;\n flex-shrink: 0;\n}\n\n.item-name {\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\n/* Folder Icons */\n.fa-folder {\n color: #FFB84D;\n}\n\n/* File Type Icons */\n.fa-file-pdf {\n color: #D32F2F;\n}\n\n.fa-file-word {\n color: #2B579A;\n}\n\n.fa-file-excel {\n color: #217346;\n}\n\n.fa-file-image {\n color: #673AB7;\n}\n\n.fa-file-video {\n color: #F57C00;\n}\n\n.fa-file-audio {\n color: #D32F2F;\n}\n\n.fa-file-archive {\n color: #795548;\n}\n\n.fa-file-code {\n color: #388E3C;\n}\n\n/* ===========================\n Grid View\n =========================== */\n\n.file-grid-wrapper {\n flex: 1;\n overflow: auto;\n padding: 10px;\n border-bottom: 1px solid #ccc;\n}\n\n.file-grid {\n display: grid;\n grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));\n gap: 12px;\n}\n\n.grid-item {\n display: flex;\n flex-direction: column;\n align-items: center;\n padding: 12px 8px;\n border: 1px solid #e8e8e8;\n border-radius: 4px;\n cursor: pointer;\n transition: all 0.15s;\n background: #fff;\n}\n\n.grid-item:hover {\n background-color: #f8f8f8;\n border-color: #ccc;\n}\n\n.grid-item.selected {\n background-color: #cce8ff;\n border-color: #007AFF;\n}\n\n.grid-icon {\n font-size: 48px;\n margin-bottom: 8px;\n color: #666;\n}\n\n.grid-icon i {\n display: block;\n}\n\n.grid-name {\n font-size: 12px;\n color: #333;\n text-align: center;\n word-break: break-word;\n overflow: hidden;\n text-overflow: ellipsis;\n display: -webkit-box;\n -webkit-line-clamp: 2;\n -webkit-box-orient: vertical;\n max-width: 100%;\n}\n\n.grid-meta {\n font-size: 11px;\n color: #666;\n margin-top: 4px;\n}\n\n/* ===========================\n Bottom Toolbar\n =========================== */\n\n.bottom-toolbar {\n display: flex;\n align-items: center;\n justify-content: space-between;\n padding: 6px 10px;\n background-color: #f8f8f8;\n border-top: 1px solid #ccc;\n min-height: 36px;\n}\n\n.toolbar-left {\n display: flex;\n gap: 6px;\n}\n\n.toolbar-btn {\n display: flex;\n align-items: center;\n gap: 6px;\n background: #fff;\n border: 1px solid #ccc;\n padding: 5px 12px;\n cursor: pointer;\n border-radius: 3px;\n font-size: 12px;\n color: #333;\n transition: background-color 0.15s;\n}\n\n.toolbar-btn:hover:not(:disabled) {\n background-color: #e8e8e8;\n}\n\n.toolbar-btn:disabled {\n opacity: 0.5;\n cursor: not-allowed;\n}\n\n.toolbar-btn i {\n font-size: 12px;\n}\n\n.toolbar-right {\n display: flex;\n align-items: center;\n gap: 12px;\n}\n\n.view-toggle {\n display: flex;\n border: 1px solid #ccc;\n border-radius: 3px;\n overflow: hidden;\n}\n\n.view-btn {\n background: #fff;\n border: none;\n border-right: 1px solid #ccc;\n padding: 4px 10px;\n cursor: pointer;\n font-size: 12px;\n color: #666;\n transition: all 0.15s;\n}\n\n.view-btn:last-child {\n border-right: none;\n}\n\n.view-btn:hover {\n background-color: #f0f0f0;\n color: #333;\n}\n\n.view-btn.active {\n background-color: #007AFF;\n color: #fff;\n}\n\n.item-count {\n font-size: 11px;\n color: #666;\n}\n\n/* ===========================\n Loading / Error / Empty States\n =========================== */\n\n.loading-state,\n.error-state,\n.empty-state {\n flex: 1;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n padding: 40px 20px;\n}\n\n.error-icon,\n.empty-icon {\n font-size: 48px;\n color: #999;\n margin-bottom: 16px;\n}\n\n.error-message,\n.empty-message {\n font-size: 14px;\n color: #666;\n margin-bottom: 16px;\n}\n\n.retry-btn,\n.upload-btn {\n display: flex;\n align-items: center;\n gap: 8px;\n background: #fff;\n border: 1px solid #ccc;\n padding: 8px 16px;\n cursor: pointer;\n border-radius: 3px;\n font-size: 13px;\n color: #333;\n transition: background-color 0.15s;\n}\n\n.retry-btn:hover,\n.upload-btn:hover {\n background-color: #f0f0f0;\n}\n\n/* ===========================\n Drag & Drop Overlay\n =========================== */\n\n.drag-overlay {\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n background-color: rgba(255, 255, 255, 0.95);\n z-index: 1000;\n display: flex;\n align-items: center;\n justify-content: center;\n border: 3px dashed #007AFF;\n}\n\n.drag-content {\n text-align: center;\n}\n\n.drag-icon {\n font-size: 64px;\n color: #007AFF;\n margin-bottom: 16px;\n}\n\n.drag-title {\n font-size: 20px;\n font-weight: 600;\n color: #007AFF;\n margin: 0;\n}\n\n/* ===========================\n Upload Progress\n =========================== */\n\n.upload-progress {\n position: absolute;\n bottom: 40px;\n right: 20px;\n background: #fff;\n border: 1px solid #ccc;\n border-radius: 4px;\n padding: 12px 16px;\n box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);\n min-width: 300px;\n z-index: 100;\n}\n\n.progress-content {\n display: flex;\n flex-direction: column;\n gap: 8px;\n}\n\n.progress-info {\n display: flex;\n align-items: center;\n gap: 8px;\n font-size: 13px;\n color: #333;\n}\n\n.progress-bar-wrap {\n width: 100%;\n height: 6px;\n background-color: #e0e0e0;\n border-radius: 3px;\n overflow: hidden;\n}\n\n.progress-bar {\n height: 100%;\n background-color: #007AFF;\n transition: width 0.3s ease;\n}\n\n.progress-percent {\n font-size: 12px;\n color: #666;\n text-align: right;\n}\n\n/* ===========================\n Modal Dialogs\n =========================== */\n\n.modal-overlay {\n position: fixed;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n background-color: rgba(0, 0, 0, 0.5);\n z-index: 2000;\n display: flex;\n align-items: center;\n justify-content: center;\n}\n\n.modal-dialog {\n background: #fff;\n border: 1px solid #999;\n border-radius: 4px;\n min-width: 400px;\n max-width: 90%;\n box-shadow: 0 4px 16px rgba(0, 0, 0, 0.3);\n}\n\n.modal-header {\n display: flex;\n align-items: center;\n justify-content: space-between;\n padding: 12px 16px;\n background-color: #f8f8f8;\n border-bottom: 1px solid #ccc;\n}\n\n.modal-header h3 {\n margin: 0;\n font-size: 14px;\n font-weight: 600;\n color: #333;\n}\n\n.modal-close {\n background: none;\n border: none;\n cursor: pointer;\n font-size: 16px;\n color: #666;\n padding: 4px;\n}\n\n.modal-close:hover {\n color: #333;\n}\n\n.modal-body {\n padding: 16px;\n}\n\n.modal-body label {\n display: block;\n margin-bottom: 6px;\n font-size: 12px;\n font-weight: 600;\n color: #333;\n}\n\n.modal-body input[type=\"text\"] {\n width: 100%;\n padding: 6px 10px;\n border: 1px solid #ccc;\n border-radius: 3px;\n font-size: 13px;\n font-family: inherit;\n}\n\n.modal-body input[type=\"text\"]:focus {\n outline: none;\n border-color: #007AFF;\n}\n\n.modal-body select,\n.modal-body .provider-select {\n width: 100%;\n padding: 6px 10px;\n border: 1px solid #ccc;\n border-radius: 3px;\n font-size: 13px;\n font-family: inherit;\n background-color: #fff;\n cursor: pointer;\n}\n\n.modal-body select:focus,\n.modal-body .provider-select:focus {\n outline: none;\n border-color: #007AFF;\n}\n\n.modal-body select:disabled,\n.modal-body .provider-select:disabled {\n background-color: #f5f5f5;\n cursor: not-allowed;\n}\n\n.modal-body p {\n margin: 0 0 12px 0;\n font-size: 13px;\n color: #333;\n}\n\n.modal-body .warning {\n color: #D32F2F;\n font-size: 12px;\n}\n\n/* Checkbox list for multi-account selection */\n.account-checkbox-list {\n max-height: 200px;\n overflow-y: auto;\n border: 1px solid #ccc;\n border-radius: 4px;\n padding: 8px;\n background: #fafafa;\n}\n\n.account-checkbox-item {\n display: flex;\n align-items: center;\n gap: 8px;\n padding: 6px 4px;\n border-radius: 3px;\n cursor: pointer;\n}\n\n.account-checkbox-item:hover {\n background-color: #e8f4fd;\n}\n\n.account-checkbox-item input[type=\"checkbox\"] {\n width: 16px;\n height: 16px;\n cursor: pointer;\n accent-color: #007AFF;\n}\n\n.account-checkbox-item label {\n display: flex;\n align-items: center;\n gap: 8px;\n cursor: pointer;\n font-size: 13px;\n font-weight: normal;\n margin: 0;\n}\n\n.provider-badge {\n font-size: 11px;\n color: #666;\n background: #e0e0e0;\n padding: 2px 6px;\n border-radius: 10px;\n}\n\n.copy-progress {\n margin-top: 12px;\n padding: 8px 12px;\n background: #e8f4fd;\n border-radius: 4px;\n font-size: 12px;\n color: #0066cc;\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n.modal-footer {\n display: flex;\n justify-content: flex-end;\n gap: 8px;\n padding: 12px 16px;\n background-color: #f8f8f8;\n border-top: 1px solid #ccc;\n}\n\n.modal-footer button {\n padding: 6px 16px;\n border: 1px solid #ccc;\n background: #fff;\n cursor: pointer;\n border-radius: 3px;\n font-size: 12px;\n font-weight: 500;\n transition: background-color 0.15s;\n}\n\n.modal-footer button:hover:not(:disabled) {\n background-color: #f0f0f0;\n}\n\n.modal-footer button:disabled {\n opacity: 0.5;\n cursor: not-allowed;\n}\n\n.modal-footer button.danger {\n background-color: #D32F2F;\n color: #fff;\n border-color: #D32F2F;\n}\n\n.modal-footer button.danger:hover:not(:disabled) {\n background-color: #B71C1C;\n}\n\n/* ===========================\n Scrollbars\n =========================== */\n\n.file-table-wrapper::-webkit-scrollbar {\n width: 12px;\n height: 12px;\n}\n\n.file-table-wrapper::-webkit-scrollbar-track {\n background: #f0f0f0;\n}\n\n.file-table-wrapper::-webkit-scrollbar-thumb {\n background: #c0c0c0;\n border: 2px solid #f0f0f0;\n}\n\n.file-table-wrapper::-webkit-scrollbar-thumb:hover {\n background: #a0a0a0;\n}\n\n/* ===========================\n Responsive Design\n =========================== */\n\n@media screen and (max-width: 768px) {\n .file-table {\n font-size: 11px;\n }\n\n .file-table th,\n .file-table td {\n padding: 4px 6px;\n }\n\n .col-type,\n .col-size {\n display: none;\n }\n\n .col-name {\n width: 60%;\n }\n\n .col-modified {\n width: 40%;\n }\n\n .toolbar-btn span {\n display: none;\n }\n\n .modal-dialog {\n min-width: 90%;\n }\n}\n\n/* ===========================\n Multi-Provider Search\n =========================== */\n\n.multi-search-btn {\n background: #fff;\n border: 1px solid #ccc;\n padding: 4px 8px;\n cursor: pointer;\n border-radius: 3px;\n font-size: 12px;\n color: #666;\n transition: all 0.15s;\n}\n\n.multi-search-btn:hover {\n background-color: #e8e8e8;\n color: #333;\n}\n\n.multi-search-btn.active {\n background-color: #007AFF;\n color: #fff;\n border-color: #007AFF;\n}\n\n.multi-provider-search-panel {\n background: #fff;\n border-bottom: 1px solid #ccc;\n display: flex;\n flex-direction: column;\n max-height: 70vh;\n overflow: hidden;\n}\n\n.search-panel-header {\n display: flex;\n align-items: center;\n justify-content: space-between;\n padding: 10px 16px;\n background-color: #f0f7ff;\n border-bottom: 1px solid #cce8ff;\n}\n\n.search-panel-header h3 {\n margin: 0;\n font-size: 14px;\n font-weight: 600;\n color: #007AFF;\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n.close-panel-btn {\n background: none;\n border: none;\n cursor: pointer;\n font-size: 16px;\n color: #666;\n padding: 4px;\n}\n\n.close-panel-btn:hover {\n color: #333;\n}\n\n.search-panel-body {\n padding: 16px;\n}\n\n.search-input-row {\n display: flex;\n gap: 8px;\n margin-bottom: 16px;\n}\n\n.multi-search-input {\n flex: 1;\n padding: 8px 12px;\n border: 1px solid #ccc;\n border-radius: 4px;\n font-size: 13px;\n font-family: inherit;\n}\n\n.multi-search-input:focus {\n outline: none;\n border-color: #007AFF;\n}\n\n.search-execute-btn {\n display: flex;\n align-items: center;\n gap: 6px;\n background: #007AFF;\n color: #fff;\n border: none;\n padding: 8px 16px;\n cursor: pointer;\n border-radius: 4px;\n font-size: 13px;\n font-weight: 500;\n transition: background-color 0.15s;\n}\n\n.search-execute-btn:hover:not(:disabled) {\n background-color: #0056b3;\n}\n\n.search-execute-btn:disabled {\n opacity: 0.5;\n cursor: not-allowed;\n}\n\n.provider-selection {\n margin-bottom: 8px;\n}\n\n.provider-selection-label {\n display: block;\n font-size: 12px;\n font-weight: 600;\n color: #333;\n margin-bottom: 8px;\n}\n\n.provider-checkboxes {\n display: flex;\n flex-wrap: wrap;\n gap: 12px;\n}\n\n.provider-checkbox {\n display: flex;\n align-items: center;\n gap: 6px;\n font-size: 13px;\n color: #333;\n cursor: pointer;\n padding: 4px 8px;\n border: 1px solid #e0e0e0;\n border-radius: 4px;\n background: #fafafa;\n transition: all 0.15s;\n}\n\n.provider-checkbox:hover:not(.disabled) {\n border-color: #007AFF;\n background: #f0f7ff;\n}\n\n.provider-checkbox.disabled {\n opacity: 0.6;\n cursor: not-allowed;\n background: #f5f5f5;\n}\n\n.provider-checkbox input[type=\"checkbox\"] {\n cursor: pointer;\n}\n\n.provider-checkbox .provider-name {\n font-weight: 500;\n}\n\n.no-search-badge {\n font-size: 10px;\n color: #999;\n font-style: italic;\n}\n\n/* Search Results */\n.search-results-container {\n flex: 1;\n overflow: auto;\n border-top: 1px solid #e0e0e0;\n}\n\n.search-results-summary {\n display: flex;\n align-items: center;\n gap: 12px;\n padding: 10px 16px;\n background: #f8f8f8;\n border-bottom: 1px solid #e0e0e0;\n}\n\n.search-results-summary .result-count {\n font-weight: 600;\n font-size: 13px;\n color: #333;\n}\n\n.search-results-summary .provider-stats {\n font-size: 12px;\n color: #666;\n}\n\n.search-results-summary .failed-count {\n color: #D32F2F;\n}\n\n.clear-results-btn {\n margin-left: auto;\n background: none;\n border: 1px solid #ccc;\n padding: 4px 10px;\n cursor: pointer;\n border-radius: 3px;\n font-size: 11px;\n color: #666;\n display: flex;\n align-items: center;\n gap: 4px;\n}\n\n.clear-results-btn:hover {\n background: #f0f0f0;\n color: #333;\n}\n\n.provider-results-list {\n padding: 8px 0;\n}\n\n.provider-result-group {\n margin-bottom: 16px;\n}\n\n.provider-result-group:last-child {\n margin-bottom: 0;\n}\n\n.provider-result-header {\n display: flex;\n align-items: center;\n gap: 8px;\n padding: 8px 16px;\n background: #f5f5f5;\n font-size: 13px;\n font-weight: 600;\n color: #333;\n}\n\n.provider-result-header i {\n color: #007AFF;\n}\n\n.provider-result-header .result-count {\n font-weight: normal;\n color: #666;\n}\n\n.provider-result-group.failed .provider-result-header {\n background: #fff5f5;\n}\n\n.provider-result-group.failed .provider-result-header i {\n color: #D32F2F;\n}\n\n.error-badge {\n color: #D32F2F;\n font-weight: normal;\n font-size: 12px;\n display: flex;\n align-items: center;\n gap: 4px;\n}\n\n.provider-result-files {\n padding: 0;\n}\n\n.search-result-item {\n display: flex;\n align-items: center;\n gap: 12px;\n padding: 8px 16px 8px 40px;\n border-bottom: 1px solid #f0f0f0;\n cursor: pointer;\n transition: background-color 0.1s;\n}\n\n.search-result-item:hover {\n background-color: #f8f8f8;\n}\n\n.search-result-item:last-child {\n border-bottom: none;\n}\n\n.search-result-item .file-icon {\n font-size: 16px;\n color: #666;\n flex-shrink: 0;\n}\n\n.search-result-item .file-info {\n flex: 1;\n min-width: 0;\n display: flex;\n flex-direction: column;\n gap: 2px;\n}\n\n.search-result-item .file-name {\n font-size: 13px;\n font-weight: 500;\n color: #333;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\n.search-result-item .file-path {\n font-size: 11px;\n color: #999;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\n.search-result-item .file-size {\n font-size: 12px;\n color: #666;\n flex-shrink: 0;\n min-width: 60px;\n text-align: right;\n}\n\n.search-result-item .file-date {\n font-size: 12px;\n color: #666;\n flex-shrink: 0;\n min-width: 140px;\n text-align: right;\n}\n\n.no-results-message {\n padding: 16px 40px;\n font-size: 12px;\n color: #999;\n font-style: italic;\n}\n\n.searching-state {\n padding: 40px 20px;\n display: flex;\n align-items: center;\n justify-content: center;\n}\n"] }]
|
|
2401
|
+
args: [{ standalone: false, selector: 'mj-file-grid', template: "<div class=\"file-grid-container\"\n (dragenter)=\"onDragEnter($event)\"\n (dragover)=\"onDragOver($event)\"\n (dragleave)=\"onDragLeave($event)\"\n (drop)=\"onDrop($event)\">\n <!-- Breadcrumb Navigation Bar -->\n @if (!isLoading && !errorMessage) {\n <div class=\"breadcrumb-bar\">\n <div class=\"nav-buttons\">\n <button class=\"nav-btn\"\n [disabled]=\"!canNavigateUp()\"\n (click)=\"navigateUp()\"\n title=\"Go up to parent folder\">\n <i class=\"fa-solid fa-arrow-up\"></i>\n </button>\n <button class=\"nav-btn\" (click)=\"refresh()\" title=\"Refresh\">\n <i class=\"fa-solid fa-arrows-rotate\"></i>\n </button>\n </div>\n <div class=\"breadcrumb-path\">\n <i class=\"fa-solid fa-folder\"></i>\n <span class=\"path-text\">{{ folderPath || 'Root' }} /</span>\n </div>\n <div class=\"search-bar\">\n <input type=\"text\"\n class=\"search-input\"\n [(ngModel)]=\"searchQuery\"\n (ngModelChange)=\"onSearchChange($event)\"\n placeholder=\"Search files and folders...\"\n [disabled]=\"isLoading || isMultiProviderSearchMode\">\n @if (searchQuery && !isMultiProviderSearchMode) {\n <button class=\"search-clear-btn\"\n (click)=\"clearSearch()\"\n title=\"Clear search\">\n <i class=\"fa-solid fa-xmark\"></i>\n </button>\n }\n <select class=\"file-type-filter\"\n [(ngModel)]=\"fileTypeFilter\"\n (ngModelChange)=\"onFileTypeFilterChange($event)\"\n [disabled]=\"isLoading || isMultiProviderSearchMode\">\n <option value=\"all\">All</option>\n <option value=\"files\">Files</option>\n <option value=\"folders\">Folders</option>\n </select>\n <button class=\"multi-search-btn\"\n [class.active]=\"isMultiProviderSearchMode\"\n (click)=\"toggleMultiAccountSearchMode()\"\n title=\"Search across all storage providers\">\n <i class=\"fa-solid fa-magnifying-glass-plus\"></i>\n </button>\n </div>\n </div>\n }\n\n <!-- Multi-Provider Search Panel -->\n @if (isMultiProviderSearchMode) {\n <div class=\"multi-provider-search-panel\">\n <div class=\"search-panel-header\">\n <h3><i class=\"fa-solid fa-magnifying-glass\"></i> Search Across Providers</h3>\n <button class=\"close-panel-btn\" (click)=\"toggleMultiAccountSearchMode()\">\n <i class=\"fa-solid fa-xmark\"></i>\n </button>\n </div>\n <div class=\"search-panel-body\">\n <div class=\"search-input-row\">\n <input type=\"text\"\n class=\"multi-search-input\"\n [(ngModel)]=\"multiProviderSearchQuery\"\n placeholder=\"Enter search term...\"\n (keydown.enter)=\"executeMultiAccountSearch()\"\n [disabled]=\"isSearching\">\n <button class=\"search-execute-btn\"\n (click)=\"executeMultiAccountSearch()\"\n [disabled]=\"isSearching || !multiProviderSearchQuery.trim() || selectedSearchProviders.size === 0\">\n @if (isSearching) {\n <i class=\"fa-solid fa-spinner fa-spin\"></i>\n }\n @if (!isSearching) {\n <i class=\"fa-solid fa-search\"></i>\n }\n {{ isSearching ? 'Searching...' : 'Search' }}\n </button>\n </div>\n <div class=\"provider-selection\">\n <label class=\"provider-selection-label\">Select accounts to search:</label>\n <div class=\"provider-checkboxes\">\n @for (a of availableAccounts; track a) {\n <label\n class=\"provider-checkbox\"\n [class.disabled]=\"!accountSupportsSearch(a)\"\n [title]=\"accountSupportsSearch(a) ? '' : 'This account does not support search'\">\n <input type=\"checkbox\"\n [checked]=\"isAccountSelectedForSearch(a.account.ID)\"\n (change)=\"toggleSearchAccount(a.account.ID)\"\n [disabled]=\"!accountSupportsSearch(a)\">\n <span class=\"provider-name\">{{ a.account.Name }}</span>\n <span class=\"provider-type\">({{ a.provider.Name }})</span>\n @if (!accountSupportsSearch(a)) {\n <span class=\"no-search-badge\">(no search)</span>\n }\n </label>\n }\n </div>\n </div>\n </div>\n <!-- Search Results -->\n @if (multiProviderSearchResults) {\n <div class=\"search-results-container\">\n <div class=\"search-results-summary\">\n <span class=\"result-count\">{{ multiProviderSearchResults.totalResultsReturned }} result(s) found</span>\n <span class=\"provider-stats\">\n ({{ multiProviderSearchResults.successfulAccounts }} account(s) searched\n @if (multiProviderSearchResults.failedAccounts > 0) {\n <span class=\"failed-count\">\n , {{ multiProviderSearchResults.failedAccounts }} failed\n </span>\n })\n </span>\n <button class=\"clear-results-btn\" (click)=\"clearMultiProviderSearch()\">\n <i class=\"fa-solid fa-xmark\"></i> Clear\n </button>\n </div>\n <div class=\"provider-results-list\">\n @for (accountResult of multiProviderSearchResults.accountResults; track accountResult) {\n <div\n class=\"provider-result-group\"\n [class.failed]=\"!accountResult.success\">\n <div class=\"provider-result-header\">\n <i class=\"fa-solid fa-cloud\"></i>\n <span class=\"provider-name\">{{ accountResult.accountName }}</span>\n @if (accountResult.success) {\n <span class=\"result-count\">\n ({{ accountResult.results.length }} result(s))\n </span>\n }\n @if (!accountResult.success) {\n <span class=\"error-badge\">\n <i class=\"fa-solid fa-exclamation-triangle\"></i>\n {{ accountResult.errorMessage }}\n </span>\n }\n </div>\n @if (accountResult.success && accountResult.results.length > 0) {\n <div class=\"provider-result-files\">\n @for (file of accountResult.results; track file) {\n <div class=\"search-result-item\">\n <i [class]=\"getSearchResultIcon(file)\" class=\"file-icon\"></i>\n <div class=\"file-info\">\n <span class=\"file-name\">{{ file.name }}</span>\n <span class=\"file-path\">{{ file.path }}</span>\n </div>\n <span class=\"file-size\">{{ formatSearchResultSize(file.size) }}</span>\n <span class=\"file-date\">{{ formatSearchResultDate(file.lastModified) }}</span>\n </div>\n }\n </div>\n }\n @if (accountResult.success && accountResult.results.length === 0) {\n <div class=\"no-results-message\">\n No matching files found\n </div>\n }\n </div>\n }\n </div>\n </div>\n }\n <!-- Searching State -->\n @if (isSearching) {\n <div class=\"searching-state\">\n <mj-loading text=\"Searching across providers...\"></mj-loading>\n </div>\n }\n </div>\n }\n\n <!-- Loading State -->\n @if (isLoading && !isMultiProviderSearchMode) {\n <div class=\"loading-state\">\n <mj-loading text=\"Loading files...\"></mj-loading>\n </div>\n }\n\n <!-- Error State -->\n @if (errorMessage && !isLoading) {\n <div class=\"error-state\">\n <div class=\"error-icon\">\n <i class=\"fa-solid fa-circle-exclamation\"></i>\n </div>\n <p class=\"error-message\">{{ errorMessage }}</p>\n <button class=\"retry-btn\" (click)=\"refresh()\">\n <i class=\"fa-solid fa-arrows-rotate\"></i>\n Retry\n </button>\n </div>\n }\n\n <!-- List View -->\n @if (!isLoading && !errorMessage && filteredItems.length > 0 && viewMode === 'list') {\n <div class=\"file-table-wrapper\">\n <table class=\"file-table\">\n <thead>\n <tr>\n <th class=\"col-name\" (click)=\"onSortChange([{ field: 'name', dir: sort[0].field === 'name' && sort[0].dir === 'asc' ? 'desc' : 'asc' }])\">\n <span>Name</span>\n <i class=\"fa-solid sort-icon\"\n [class.fa-caret-up]=\"sort[0].field === 'name' && sort[0].dir === 'asc'\"\n [class.fa-caret-down]=\"sort[0].field === 'name' && sort[0].dir === 'desc'\"\n [class.fa-sort]=\"sort[0].field !== 'name'\"></i>\n </th>\n <th class=\"col-type\">Type</th>\n <th class=\"col-size\" (click)=\"onSortChange([{ field: 'size', dir: sort[0].field === 'size' && sort[0].dir === 'asc' ? 'desc' : 'asc' }])\">\n <span>Size</span>\n <i class=\"fa-solid sort-icon\"\n [class.fa-caret-up]=\"sort[0].field === 'size' && sort[0].dir === 'asc'\"\n [class.fa-caret-down]=\"sort[0].field === 'size' && sort[0].dir === 'desc'\"\n [class.fa-sort]=\"sort[0].field !== 'size'\"></i>\n </th>\n <th class=\"col-modified\" (click)=\"onSortChange([{ field: 'lastModified', dir: sort[0].field === 'lastModified' && sort[0].dir === 'asc' ? 'desc' : 'asc' }])\">\n <span>Modified</span>\n <i class=\"fa-solid sort-icon\"\n [class.fa-caret-up]=\"sort[0].field === 'lastModified' && sort[0].dir === 'asc'\"\n [class.fa-caret-down]=\"sort[0].field === 'lastModified' && sort[0].dir === 'desc'\"\n [class.fa-sort]=\"sort[0].field !== 'lastModified'\"></i>\n </th>\n </tr>\n </thead>\n <tbody>\n @for (item of filteredItems; track item) {\n <tr\n class=\"file-row\"\n [class.selected]=\"selectedItems.includes(item.key)\"\n (click)=\"onTileClick(item, $event)\"\n (dblclick)=\"onItemDoubleClick(item)\">\n <td class=\"col-name\">\n <i [class]=\"getItemIcon(item)\" class=\"item-icon\"></i>\n <span class=\"item-name\">{{ item.name }}</span>\n </td>\n <td class=\"col-type\">\n <span class=\"item-type\">{{ getFileType(item) }}</span>\n </td>\n <td class=\"col-size\">\n <span class=\"item-size\">{{ item.type === 'folder' ? '\u2014' : formatFileSize(item.size) }}</span>\n </td>\n <td class=\"col-modified\">\n <span class=\"item-date\">{{ formatDate(item.lastModified) }}</span>\n </td>\n </tr>\n }\n </tbody>\n </table>\n </div>\n }\n\n <!-- Grid View -->\n @if (!isLoading && !errorMessage && filteredItems.length > 0 && viewMode === 'grid') {\n <div class=\"file-grid-wrapper\">\n <div class=\"file-grid\">\n @for (item of filteredItems; track item) {\n <div\n class=\"grid-item\"\n [class.selected]=\"selectedItems.includes(item.key)\"\n (click)=\"onTileClick(item, $event)\"\n (dblclick)=\"onItemDoubleClick(item)\">\n <div class=\"grid-icon\">\n <i [class]=\"getItemIcon(item)\"></i>\n </div>\n <div class=\"grid-name\">{{ item.name }}</div>\n @if (item.type === 'file') {\n <div class=\"grid-meta\">{{ formatFileSize(item.size) }}</div>\n }\n @if (item.type === 'folder') {\n <div class=\"grid-meta\">Folder</div>\n }\n </div>\n }\n </div>\n </div>\n }\n\n <!-- Empty State -->\n @if (!isLoading && !errorMessage && filteredItems.length === 0) {\n <div class=\"empty-state\">\n <div class=\"empty-icon\">\n <i class=\"fa-solid fa-folder-open\"></i>\n </div>\n <p class=\"empty-message\">This folder is empty</p>\n <button class=\"upload-btn\" (click)=\"onUploadClick()\">\n <i class=\"fa-solid fa-upload\"></i>\n Upload Files\n </button>\n </div>\n }\n\n <!-- Bottom Toolbar -->\n @if (!isLoading && !errorMessage) {\n <div class=\"bottom-toolbar\">\n <div class=\"toolbar-left\">\n <button class=\"toolbar-btn\" (click)=\"onUploadClick()\">\n <i class=\"fa-solid fa-upload\"></i>\n Upload\n </button>\n <button class=\"toolbar-btn\" (click)=\"onNewFolderClick()\">\n <i class=\"fa-solid fa-folder-plus\"></i>\n New Folder\n </button>\n <button class=\"toolbar-btn\"\n [disabled]=\"selectedItems.length !== 1\"\n (click)=\"onDownloadClick()\">\n <i class=\"fa-solid fa-download\"></i>\n Download\n </button>\n <button class=\"toolbar-btn\"\n [disabled]=\"selectedItems.length !== 1\"\n (click)=\"onRenameClick()\">\n <i class=\"fa-solid fa-pen\"></i>\n Rename\n </button>\n <button class=\"toolbar-btn\"\n [disabled]=\"selectedItems.length !== 1\"\n (click)=\"onCopyClick()\">\n <i class=\"fa-solid fa-copy\"></i>\n Copy\n </button>\n <button class=\"toolbar-btn\"\n [disabled]=\"selectedItems.length !== 1 || getSelectedItem()?.type === 'folder'\"\n (click)=\"onCopyToAccountClick()\"\n title=\"Copy file to another storage account\">\n <i class=\"fa-solid fa-cloud-arrow-up\"></i>\n Copy to...\n </button>\n <button class=\"toolbar-btn\"\n [disabled]=\"selectedItems.length !== 1\"\n (click)=\"onMoveClick()\">\n <i class=\"fa-solid fa-arrows-up-down-left-right\"></i>\n Move\n </button>\n <button class=\"toolbar-btn\"\n [disabled]=\"selectedItems.length === 0\"\n (click)=\"onDeleteClick()\">\n <i class=\"fa-solid fa-trash\"></i>\n Delete\n </button>\n </div>\n <div class=\"toolbar-right\">\n <!-- View Toggle -->\n <div class=\"view-toggle\">\n <button class=\"view-btn\"\n [class.active]=\"viewMode === 'list'\"\n (click)=\"viewMode = 'list'\"\n title=\"List View\">\n <i class=\"fa-solid fa-list\"></i>\n </button>\n <button class=\"view-btn\"\n [class.active]=\"viewMode === 'grid'\"\n (click)=\"viewMode = 'grid'\"\n title=\"Grid View\">\n <i class=\"fa-solid fa-th\"></i>\n </button>\n </div>\n <span class=\"item-count\">\n {{ filteredItems.length }} {{ filteredItems.length === 1 ? 'item' : 'filteredItems' }}\n </span>\n </div>\n </div>\n }\n\n <!-- Drag & Drop Overlay -->\n @if (isDragging) {\n <div class=\"drag-overlay\">\n <div class=\"drag-content\">\n <div class=\"drag-icon\">\n <i class=\"fa-solid fa-cloud-arrow-up\"></i>\n </div>\n <h2 class=\"drag-title\">Drop files to upload</h2>\n </div>\n </div>\n }\n\n <!-- Upload Progress -->\n @if (isUploading) {\n <div class=\"upload-progress\">\n <div class=\"progress-content\">\n <div class=\"progress-info\">\n <i class=\"fa-solid fa-spinner fa-spin\"></i>\n <span>Uploading {{ uploadingFileName }}...</span>\n </div>\n <div class=\"progress-bar-wrap\">\n <div class=\"progress-bar\" [style.width.%]=\"uploadProgress\"></div>\n </div>\n <span class=\"progress-percent\">{{ uploadProgress }}%</span>\n </div>\n </div>\n }\n </div>\n\n <!-- New Folder Modal -->\n @if (showNewFolderDialog) {\n <div class=\"modal-overlay\" (click)=\"onCancelNewFolder()\">\n <div class=\"modal-dialog\" (click)=\"$event.stopPropagation()\">\n <div class=\"modal-header\">\n <h3>Create New Folder</h3>\n <button class=\"modal-close\" (click)=\"onCancelNewFolder()\">\n <i class=\"fa-solid fa-xmark\"></i>\n </button>\n </div>\n <div class=\"modal-body\">\n <label>Folder name:</label>\n <input type=\"text\"\n [(ngModel)]=\"newFolderName\"\n [disabled]=\"isCreatingFolder\"\n placeholder=\"Enter folder name\"\n (keydown.enter)=\"onCreateFolder()\">\n </div>\n <div class=\"modal-footer\">\n <button (click)=\"onCancelNewFolder()\" [disabled]=\"isCreatingFolder\">Cancel</button>\n <button (click)=\"onCreateFolder()\" [disabled]=\"!newFolderName.trim() || isCreatingFolder\">\n @if (isCreatingFolder) {\n <i class=\"fa-solid fa-spinner fa-spin\"></i>\n }\n {{ isCreatingFolder ? 'Creating...' : 'Create' }}\n </button>\n </div>\n </div>\n </div>\n }\n\n <!-- Delete Confirmation Modal -->\n @if (showDeleteDialog && itemToDelete) {\n <div class=\"modal-overlay\" (click)=\"onCancelDelete()\">\n <div class=\"modal-dialog\" (click)=\"$event.stopPropagation()\">\n <div class=\"modal-header\">\n <h3>Delete {{ itemToDelete.type === 'folder' ? 'Folder' : 'File' }}?</h3>\n <button class=\"modal-close\" (click)=\"onCancelDelete()\">\n <i class=\"fa-solid fa-xmark\"></i>\n </button>\n </div>\n <div class=\"modal-body\">\n <p>Are you sure you want to delete <strong>{{ itemToDelete.name }}</strong>?</p>\n @if (itemToDelete.type === 'folder') {\n <p class=\"warning\">This will delete the folder and all its contents.</p>\n }\n </div>\n <div class=\"modal-footer\">\n <button (click)=\"onCancelDelete()\" [disabled]=\"isDeleting\">Cancel</button>\n <button (click)=\"onConfirmDelete()\" [disabled]=\"isDeleting\" class=\"danger\">\n @if (isDeleting) {\n <i class=\"fa-solid fa-spinner fa-spin\"></i>\n }\n {{ isDeleting ? 'Deleting...' : 'Delete' }}\n </button>\n </div>\n </div>\n </div>\n }\n\n <!-- Rename Modal -->\n @if (showRenameDialog && itemToRename) {\n <div class=\"modal-overlay\" (click)=\"onCancelRename()\">\n <div class=\"modal-dialog\" (click)=\"$event.stopPropagation()\">\n <div class=\"modal-header\">\n <h3>Rename {{ itemToRename.type === 'folder' ? 'Folder' : 'File' }}</h3>\n <button class=\"modal-close\" (click)=\"onCancelRename()\">\n <i class=\"fa-solid fa-xmark\"></i>\n </button>\n </div>\n <div class=\"modal-body\">\n <label>New name:</label>\n <input type=\"text\"\n [(ngModel)]=\"newItemName\"\n [disabled]=\"isRenaming\"\n placeholder=\"Enter new name\"\n (keydown.enter)=\"onConfirmRename()\">\n </div>\n <div class=\"modal-footer\">\n <button (click)=\"onCancelRename()\" [disabled]=\"isRenaming\">Cancel</button>\n <button (click)=\"onConfirmRename()\" [disabled]=\"isRenaming || !newItemName.trim()\">\n @if (isRenaming) {\n <i class=\"fa-solid fa-spinner fa-spin\"></i>\n }\n {{ isRenaming ? 'Renaming...' : 'Rename' }}\n </button>\n </div>\n </div>\n </div>\n }\n\n <!-- Copy Modal -->\n @if (showCopyDialog && itemToCopy) {\n <div class=\"modal-overlay\" (click)=\"onCancelCopy()\">\n <div class=\"modal-dialog\" (click)=\"$event.stopPropagation()\">\n <div class=\"modal-header\">\n <h3>Copy {{ itemToCopy.type === 'folder' ? 'Folder' : 'File' }}</h3>\n <button class=\"modal-close\" (click)=\"onCancelCopy()\">\n <i class=\"fa-solid fa-xmark\"></i>\n </button>\n </div>\n <div class=\"modal-body\">\n <p>Copying: <strong>{{ itemToCopy.name }}</strong></p>\n <label>Destination path:</label>\n <input type=\"text\"\n [(ngModel)]=\"copyDestinationPath\"\n [disabled]=\"isCopying\"\n placeholder=\"Enter destination path\"\n (keydown.enter)=\"onConfirmCopy()\">\n </div>\n <div class=\"modal-footer\">\n <button (click)=\"onCancelCopy()\" [disabled]=\"isCopying\">Cancel</button>\n <button (click)=\"onConfirmCopy()\" [disabled]=\"isCopying || !copyDestinationPath.trim()\">\n @if (isCopying) {\n <i class=\"fa-solid fa-spinner fa-spin\"></i>\n }\n {{ isCopying ? 'Copying...' : 'Copy' }}\n </button>\n </div>\n </div>\n </div>\n }\n\n <!-- Move Modal -->\n @if (showMoveDialog && itemToMove) {\n <div class=\"modal-overlay\" (click)=\"onCancelMove()\">\n <div class=\"modal-dialog\" (click)=\"$event.stopPropagation()\">\n <div class=\"modal-header\">\n <h3>Move {{ itemToMove.type === 'folder' ? 'Folder' : 'File' }}</h3>\n <button class=\"modal-close\" (click)=\"onCancelMove()\">\n <i class=\"fa-solid fa-xmark\"></i>\n </button>\n </div>\n <div class=\"modal-body\">\n <p>Moving: <strong>{{ itemToMove.name }}</strong></p>\n <label>Destination folder path:</label>\n <input type=\"text\"\n [(ngModel)]=\"moveDestinationPath\"\n [disabled]=\"isMoving\"\n placeholder=\"Enter destination folder (e.g., folder1/folder2/)\"\n (keydown.enter)=\"onConfirmMove()\">\n <p style=\"font-size: 11px; color: #666; margin-top: 8px;\">\n File will be moved to: {{ moveDestinationPath }}{{ itemToMove.name }}\n </p>\n </div>\n <div class=\"modal-footer\">\n <button (click)=\"onCancelMove()\" [disabled]=\"isMoving\">Cancel</button>\n <button (click)=\"onConfirmMove()\" [disabled]=\"isMoving || !moveDestinationPath.trim()\">\n @if (isMoving) {\n <i class=\"fa-solid fa-spinner fa-spin\"></i>\n }\n {{ isMoving ? 'Moving...' : 'Move' }}\n </button>\n </div>\n </div>\n </div>\n }\n\n <!-- Copy to Account Modal -->\n @if (showCopyToProviderDialog && itemToCopyToProvider) {\n <div class=\"modal-overlay\" (click)=\"onCancelCopyToAccount()\">\n <div class=\"modal-dialog\" (click)=\"$event.stopPropagation()\">\n <div class=\"modal-header\">\n <h3>Copy to Another Account</h3>\n <button class=\"modal-close\" (click)=\"onCancelCopyToAccount()\">\n <i class=\"fa-solid fa-xmark\"></i>\n </button>\n </div>\n <div class=\"modal-body\">\n <p>Copying: <strong>{{ itemToCopyToProvider.name }}</strong></p>\n <p style=\"font-size: 12px; color: #666; margin-bottom: 16px;\">\n From: <strong>{{ account?.account?.Name }}</strong>\n </p>\n <label>Select destination account(s):</label>\n <div class=\"account-checkbox-list\">\n @for (a of availableAccounts; track a) {\n <div class=\"account-checkbox-item\">\n <input type=\"checkbox\"\n [id]=\"'dest-account-' + a.account.ID\"\n [checked]=\"isDestinationAccountSelected(a.account.ID)\"\n [disabled]=\"isCopyingToAccount\"\n (change)=\"toggleDestinationAccount(a.account.ID)\">\n <label [for]=\"'dest-account-' + a.account.ID\">\n {{ a.account.Name }} <span class=\"provider-badge\">{{ a.provider.Name }}</span>\n </label>\n </div>\n }\n </div>\n <label style=\"margin-top: 16px;\">Destination filename:</label>\n <input type=\"text\"\n [(ngModel)]=\"copyToAccountDestinationPath\"\n [disabled]=\"isCopyingToAccount\"\n placeholder=\"Enter destination filename\"\n (keydown.enter)=\"onConfirmCopyToAccount()\">\n @if (copyToAccountProgress) {\n <div class=\"copy-progress\">\n <i class=\"fa-solid fa-spinner fa-spin\"></i>\n Copying to {{ copyToAccountProgress.currentAccount }} ({{ copyToAccountProgress.current }}/{{ copyToAccountProgress.total }})...\n </div>\n }\n </div>\n <div class=\"modal-footer\">\n <button (click)=\"onCancelCopyToAccount()\" [disabled]=\"isCopyingToAccount\">Cancel</button>\n <button (click)=\"onConfirmCopyToAccount()\"\n [disabled]=\"isCopyingToAccount || selectedDestinationAccounts.size === 0 || !copyToAccountDestinationPath.trim()\">\n @if (isCopyingToAccount) {\n <i class=\"fa-solid fa-spinner fa-spin\"></i>\n }\n {{ isCopyingToAccount ? 'Copying...' : 'Copy to ' + selectedDestinationAccounts.size + ' account' + (selectedDestinationAccounts.size !== 1 ? 's' : '') }}\n </button>\n </div>\n </div>\n </div>\n }\n", styles: ["/* ===========================\n File Grid - Traditional File Manager Style\n =========================== */\n\n:host {\n display: flex;\n flex-direction: column;\n height: 100%;\n width: 100%;\n background-color: #fff;\n font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;\n}\n\n.file-grid-container {\n display: flex;\n flex-direction: column;\n height: 100%;\n width: 100%;\n position: relative;\n}\n\n/* ===========================\n Breadcrumb Navigation Bar\n =========================== */\n\n.breadcrumb-bar {\n display: flex;\n align-items: center;\n padding: 6px 10px;\n background-color: #f8f8f8;\n border-bottom: 1px solid #ccc;\n gap: 10px;\n flex-wrap: wrap;\n}\n\n.nav-buttons {\n display: flex;\n gap: 4px;\n}\n\n.nav-btn {\n background: #fff;\n border: 1px solid #ccc;\n padding: 4px 8px;\n cursor: pointer;\n border-radius: 3px;\n font-size: 12px;\n color: #333;\n transition: background-color 0.15s;\n}\n\n.nav-btn:hover:not(:disabled) {\n background-color: #e8e8e8;\n}\n\n.nav-btn:disabled {\n opacity: 0.5;\n cursor: not-allowed;\n}\n\n.breadcrumb-path {\n display: flex;\n align-items: center;\n gap: 6px;\n font-size: 12px;\n color: #333;\n}\n\n.breadcrumb-path i {\n color: #666;\n}\n\n.path-text {\n font-weight: 500;\n}\n\n.search-bar {\n display: flex;\n align-items: center;\n gap: 6px;\n margin-left: auto;\n position: relative;\n}\n\n.search-input {\n padding: 4px 30px 4px 8px;\n border: 1px solid #ccc;\n border-radius: 3px;\n font-size: 12px;\n font-family: inherit;\n min-width: 200px;\n}\n\n.search-input:focus {\n outline: none;\n border-color: #007AFF;\n}\n\n.search-clear-btn {\n position: absolute;\n right: 142px;\n background: none;\n border: none;\n cursor: pointer;\n color: #999;\n padding: 4px;\n font-size: 12px;\n}\n\n.search-clear-btn:hover {\n color: #333;\n}\n\n.file-type-filter {\n padding: 4px 8px;\n border: 1px solid #ccc;\n border-radius: 3px;\n font-size: 12px;\n font-family: inherit;\n background: #fff;\n cursor: pointer;\n}\n\n.file-type-filter:focus {\n outline: none;\n border-color: #007AFF;\n}\n\n/* ===========================\n File Table\n =========================== */\n\n.file-table-wrapper {\n flex: 1;\n overflow: auto;\n border-bottom: 1px solid #ccc;\n}\n\n.file-table {\n width: 100%;\n border-collapse: collapse;\n font-size: 12px;\n}\n\n.file-table thead {\n position: sticky;\n top: 0;\n background-color: #f0f0f0;\n z-index: 10;\n}\n\n.file-table th {\n text-align: left;\n padding: 6px 10px;\n border-bottom: 1px solid #ccc;\n font-weight: 600;\n color: #333;\n cursor: pointer;\n user-select: none;\n}\n\n.file-table th:hover {\n background-color: #e8e8e8;\n}\n\n.file-table th span {\n margin-right: 4px;\n}\n\n.sort-icon {\n font-size: 10px;\n color: #666;\n}\n\n.file-table tbody tr {\n border-bottom: 1px solid #e8e8e8;\n cursor: pointer;\n transition: background-color 0.1s;\n}\n\n.file-table tbody tr:hover {\n background-color: #f8f8f8;\n}\n\n.file-table tbody tr.selected {\n background-color: #cce8ff;\n}\n\n.file-table tbody tr.selected:hover {\n background-color: #b3d9ff;\n}\n\n.file-table td {\n padding: 6px 10px;\n color: #333;\n}\n\n/* Column Widths */\n.col-name {\n width: 50%;\n}\n\n.col-type {\n width: 15%;\n}\n\n.col-size {\n width: 15%;\n}\n\n.col-modified {\n width: 20%;\n}\n\n/* Name Column with Icon */\n.col-name {\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n.item-icon {\n font-size: 14px;\n color: #666;\n flex-shrink: 0;\n}\n\n.item-name {\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\n/* Folder Icons */\n.fa-folder {\n color: #FFB84D;\n}\n\n/* File Type Icons */\n.fa-file-pdf {\n color: #D32F2F;\n}\n\n.fa-file-word {\n color: #2B579A;\n}\n\n.fa-file-excel {\n color: #217346;\n}\n\n.fa-file-image {\n color: #673AB7;\n}\n\n.fa-file-video {\n color: #F57C00;\n}\n\n.fa-file-audio {\n color: #D32F2F;\n}\n\n.fa-file-archive {\n color: #795548;\n}\n\n.fa-file-code {\n color: #388E3C;\n}\n\n/* ===========================\n Grid View\n =========================== */\n\n.file-grid-wrapper {\n flex: 1;\n overflow: auto;\n padding: 10px;\n border-bottom: 1px solid #ccc;\n}\n\n.file-grid {\n display: grid;\n grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));\n gap: 12px;\n}\n\n.grid-item {\n display: flex;\n flex-direction: column;\n align-items: center;\n padding: 12px 8px;\n border: 1px solid #e8e8e8;\n border-radius: 4px;\n cursor: pointer;\n transition: all 0.15s;\n background: #fff;\n}\n\n.grid-item:hover {\n background-color: #f8f8f8;\n border-color: #ccc;\n}\n\n.grid-item.selected {\n background-color: #cce8ff;\n border-color: #007AFF;\n}\n\n.grid-icon {\n font-size: 48px;\n margin-bottom: 8px;\n color: #666;\n}\n\n.grid-icon i {\n display: block;\n}\n\n.grid-name {\n font-size: 12px;\n color: #333;\n text-align: center;\n word-break: break-word;\n overflow: hidden;\n text-overflow: ellipsis;\n display: -webkit-box;\n -webkit-line-clamp: 2;\n -webkit-box-orient: vertical;\n max-width: 100%;\n}\n\n.grid-meta {\n font-size: 11px;\n color: #666;\n margin-top: 4px;\n}\n\n/* ===========================\n Bottom Toolbar\n =========================== */\n\n.bottom-toolbar {\n display: flex;\n align-items: center;\n justify-content: space-between;\n padding: 6px 10px;\n background-color: #f8f8f8;\n border-top: 1px solid #ccc;\n min-height: 36px;\n}\n\n.toolbar-left {\n display: flex;\n gap: 6px;\n}\n\n.toolbar-btn {\n display: flex;\n align-items: center;\n gap: 6px;\n background: #fff;\n border: 1px solid #ccc;\n padding: 5px 12px;\n cursor: pointer;\n border-radius: 3px;\n font-size: 12px;\n color: #333;\n transition: background-color 0.15s;\n}\n\n.toolbar-btn:hover:not(:disabled) {\n background-color: #e8e8e8;\n}\n\n.toolbar-btn:disabled {\n opacity: 0.5;\n cursor: not-allowed;\n}\n\n.toolbar-btn i {\n font-size: 12px;\n}\n\n.toolbar-right {\n display: flex;\n align-items: center;\n gap: 12px;\n}\n\n.view-toggle {\n display: flex;\n border: 1px solid #ccc;\n border-radius: 3px;\n overflow: hidden;\n}\n\n.view-btn {\n background: #fff;\n border: none;\n border-right: 1px solid #ccc;\n padding: 4px 10px;\n cursor: pointer;\n font-size: 12px;\n color: #666;\n transition: all 0.15s;\n}\n\n.view-btn:last-child {\n border-right: none;\n}\n\n.view-btn:hover {\n background-color: #f0f0f0;\n color: #333;\n}\n\n.view-btn.active {\n background-color: #007AFF;\n color: #fff;\n}\n\n.item-count {\n font-size: 11px;\n color: #666;\n}\n\n/* ===========================\n Loading / Error / Empty States\n =========================== */\n\n.loading-state,\n.error-state,\n.empty-state {\n flex: 1;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n padding: 40px 20px;\n}\n\n.error-icon,\n.empty-icon {\n font-size: 48px;\n color: #999;\n margin-bottom: 16px;\n}\n\n.error-message,\n.empty-message {\n font-size: 14px;\n color: #666;\n margin-bottom: 16px;\n}\n\n.retry-btn,\n.upload-btn {\n display: flex;\n align-items: center;\n gap: 8px;\n background: #fff;\n border: 1px solid #ccc;\n padding: 8px 16px;\n cursor: pointer;\n border-radius: 3px;\n font-size: 13px;\n color: #333;\n transition: background-color 0.15s;\n}\n\n.retry-btn:hover,\n.upload-btn:hover {\n background-color: #f0f0f0;\n}\n\n/* ===========================\n Drag & Drop Overlay\n =========================== */\n\n.drag-overlay {\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n background-color: rgba(255, 255, 255, 0.95);\n z-index: 1000;\n display: flex;\n align-items: center;\n justify-content: center;\n border: 3px dashed #007AFF;\n}\n\n.drag-content {\n text-align: center;\n}\n\n.drag-icon {\n font-size: 64px;\n color: #007AFF;\n margin-bottom: 16px;\n}\n\n.drag-title {\n font-size: 20px;\n font-weight: 600;\n color: #007AFF;\n margin: 0;\n}\n\n/* ===========================\n Upload Progress\n =========================== */\n\n.upload-progress {\n position: absolute;\n bottom: 40px;\n right: 20px;\n background: #fff;\n border: 1px solid #ccc;\n border-radius: 4px;\n padding: 12px 16px;\n box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);\n min-width: 300px;\n z-index: 100;\n}\n\n.progress-content {\n display: flex;\n flex-direction: column;\n gap: 8px;\n}\n\n.progress-info {\n display: flex;\n align-items: center;\n gap: 8px;\n font-size: 13px;\n color: #333;\n}\n\n.progress-bar-wrap {\n width: 100%;\n height: 6px;\n background-color: #e0e0e0;\n border-radius: 3px;\n overflow: hidden;\n}\n\n.progress-bar {\n height: 100%;\n background-color: #007AFF;\n transition: width 0.3s ease;\n}\n\n.progress-percent {\n font-size: 12px;\n color: #666;\n text-align: right;\n}\n\n/* ===========================\n Modal Dialogs\n =========================== */\n\n.modal-overlay {\n position: fixed;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n background-color: rgba(0, 0, 0, 0.5);\n z-index: 2000;\n display: flex;\n align-items: center;\n justify-content: center;\n}\n\n.modal-dialog {\n background: #fff;\n border: 1px solid #999;\n border-radius: 4px;\n min-width: 400px;\n max-width: 90%;\n box-shadow: 0 4px 16px rgba(0, 0, 0, 0.3);\n}\n\n.modal-header {\n display: flex;\n align-items: center;\n justify-content: space-between;\n padding: 12px 16px;\n background-color: #f8f8f8;\n border-bottom: 1px solid #ccc;\n}\n\n.modal-header h3 {\n margin: 0;\n font-size: 14px;\n font-weight: 600;\n color: #333;\n}\n\n.modal-close {\n background: none;\n border: none;\n cursor: pointer;\n font-size: 16px;\n color: #666;\n padding: 4px;\n}\n\n.modal-close:hover {\n color: #333;\n}\n\n.modal-body {\n padding: 16px;\n}\n\n.modal-body label {\n display: block;\n margin-bottom: 6px;\n font-size: 12px;\n font-weight: 600;\n color: #333;\n}\n\n.modal-body input[type=\"text\"] {\n width: 100%;\n padding: 6px 10px;\n border: 1px solid #ccc;\n border-radius: 3px;\n font-size: 13px;\n font-family: inherit;\n}\n\n.modal-body input[type=\"text\"]:focus {\n outline: none;\n border-color: #007AFF;\n}\n\n.modal-body select,\n.modal-body .provider-select {\n width: 100%;\n padding: 6px 10px;\n border: 1px solid #ccc;\n border-radius: 3px;\n font-size: 13px;\n font-family: inherit;\n background-color: #fff;\n cursor: pointer;\n}\n\n.modal-body select:focus,\n.modal-body .provider-select:focus {\n outline: none;\n border-color: #007AFF;\n}\n\n.modal-body select:disabled,\n.modal-body .provider-select:disabled {\n background-color: #f5f5f5;\n cursor: not-allowed;\n}\n\n.modal-body p {\n margin: 0 0 12px 0;\n font-size: 13px;\n color: #333;\n}\n\n.modal-body .warning {\n color: #D32F2F;\n font-size: 12px;\n}\n\n/* Checkbox list for multi-account selection */\n.account-checkbox-list {\n max-height: 200px;\n overflow-y: auto;\n border: 1px solid #ccc;\n border-radius: 4px;\n padding: 8px;\n background: #fafafa;\n}\n\n.account-checkbox-item {\n display: flex;\n align-items: center;\n gap: 8px;\n padding: 6px 4px;\n border-radius: 3px;\n cursor: pointer;\n}\n\n.account-checkbox-item:hover {\n background-color: #e8f4fd;\n}\n\n.account-checkbox-item input[type=\"checkbox\"] {\n width: 16px;\n height: 16px;\n cursor: pointer;\n accent-color: #007AFF;\n}\n\n.account-checkbox-item label {\n display: flex;\n align-items: center;\n gap: 8px;\n cursor: pointer;\n font-size: 13px;\n font-weight: normal;\n margin: 0;\n}\n\n.provider-badge {\n font-size: 11px;\n color: #666;\n background: #e0e0e0;\n padding: 2px 6px;\n border-radius: 10px;\n}\n\n.copy-progress {\n margin-top: 12px;\n padding: 8px 12px;\n background: #e8f4fd;\n border-radius: 4px;\n font-size: 12px;\n color: #0066cc;\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n.modal-footer {\n display: flex;\n justify-content: flex-end;\n gap: 8px;\n padding: 12px 16px;\n background-color: #f8f8f8;\n border-top: 1px solid #ccc;\n}\n\n.modal-footer button {\n padding: 6px 16px;\n border: 1px solid #ccc;\n background: #fff;\n cursor: pointer;\n border-radius: 3px;\n font-size: 12px;\n font-weight: 500;\n transition: background-color 0.15s;\n}\n\n.modal-footer button:hover:not(:disabled) {\n background-color: #f0f0f0;\n}\n\n.modal-footer button:disabled {\n opacity: 0.5;\n cursor: not-allowed;\n}\n\n.modal-footer button.danger {\n background-color: #D32F2F;\n color: #fff;\n border-color: #D32F2F;\n}\n\n.modal-footer button.danger:hover:not(:disabled) {\n background-color: #B71C1C;\n}\n\n/* ===========================\n Scrollbars\n =========================== */\n\n.file-table-wrapper::-webkit-scrollbar {\n width: 12px;\n height: 12px;\n}\n\n.file-table-wrapper::-webkit-scrollbar-track {\n background: #f0f0f0;\n}\n\n.file-table-wrapper::-webkit-scrollbar-thumb {\n background: #c0c0c0;\n border: 2px solid #f0f0f0;\n}\n\n.file-table-wrapper::-webkit-scrollbar-thumb:hover {\n background: #a0a0a0;\n}\n\n/* ===========================\n Responsive Design\n =========================== */\n\n@media screen and (max-width: 768px) {\n .file-table {\n font-size: 11px;\n }\n\n .file-table th,\n .file-table td {\n padding: 4px 6px;\n }\n\n .col-type,\n .col-size {\n display: none;\n }\n\n .col-name {\n width: 60%;\n }\n\n .col-modified {\n width: 40%;\n }\n\n .toolbar-btn span {\n display: none;\n }\n\n .modal-dialog {\n min-width: 90%;\n }\n}\n\n/* ===========================\n Multi-Provider Search\n =========================== */\n\n.multi-search-btn {\n background: #fff;\n border: 1px solid #ccc;\n padding: 4px 8px;\n cursor: pointer;\n border-radius: 3px;\n font-size: 12px;\n color: #666;\n transition: all 0.15s;\n}\n\n.multi-search-btn:hover {\n background-color: #e8e8e8;\n color: #333;\n}\n\n.multi-search-btn.active {\n background-color: #007AFF;\n color: #fff;\n border-color: #007AFF;\n}\n\n.multi-provider-search-panel {\n background: #fff;\n border-bottom: 1px solid #ccc;\n display: flex;\n flex-direction: column;\n max-height: 70vh;\n overflow: hidden;\n}\n\n.search-panel-header {\n display: flex;\n align-items: center;\n justify-content: space-between;\n padding: 10px 16px;\n background-color: #f0f7ff;\n border-bottom: 1px solid #cce8ff;\n}\n\n.search-panel-header h3 {\n margin: 0;\n font-size: 14px;\n font-weight: 600;\n color: #007AFF;\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n.close-panel-btn {\n background: none;\n border: none;\n cursor: pointer;\n font-size: 16px;\n color: #666;\n padding: 4px;\n}\n\n.close-panel-btn:hover {\n color: #333;\n}\n\n.search-panel-body {\n padding: 16px;\n}\n\n.search-input-row {\n display: flex;\n gap: 8px;\n margin-bottom: 16px;\n}\n\n.multi-search-input {\n flex: 1;\n padding: 8px 12px;\n border: 1px solid #ccc;\n border-radius: 4px;\n font-size: 13px;\n font-family: inherit;\n}\n\n.multi-search-input:focus {\n outline: none;\n border-color: #007AFF;\n}\n\n.search-execute-btn {\n display: flex;\n align-items: center;\n gap: 6px;\n background: #007AFF;\n color: #fff;\n border: none;\n padding: 8px 16px;\n cursor: pointer;\n border-radius: 4px;\n font-size: 13px;\n font-weight: 500;\n transition: background-color 0.15s;\n}\n\n.search-execute-btn:hover:not(:disabled) {\n background-color: #0056b3;\n}\n\n.search-execute-btn:disabled {\n opacity: 0.5;\n cursor: not-allowed;\n}\n\n.provider-selection {\n margin-bottom: 8px;\n}\n\n.provider-selection-label {\n display: block;\n font-size: 12px;\n font-weight: 600;\n color: #333;\n margin-bottom: 8px;\n}\n\n.provider-checkboxes {\n display: flex;\n flex-wrap: wrap;\n gap: 12px;\n}\n\n.provider-checkbox {\n display: flex;\n align-items: center;\n gap: 6px;\n font-size: 13px;\n color: #333;\n cursor: pointer;\n padding: 4px 8px;\n border: 1px solid #e0e0e0;\n border-radius: 4px;\n background: #fafafa;\n transition: all 0.15s;\n}\n\n.provider-checkbox:hover:not(.disabled) {\n border-color: #007AFF;\n background: #f0f7ff;\n}\n\n.provider-checkbox.disabled {\n opacity: 0.6;\n cursor: not-allowed;\n background: #f5f5f5;\n}\n\n.provider-checkbox input[type=\"checkbox\"] {\n cursor: pointer;\n}\n\n.provider-checkbox .provider-name {\n font-weight: 500;\n}\n\n.no-search-badge {\n font-size: 10px;\n color: #999;\n font-style: italic;\n}\n\n/* Search Results */\n.search-results-container {\n flex: 1;\n overflow: auto;\n border-top: 1px solid #e0e0e0;\n}\n\n.search-results-summary {\n display: flex;\n align-items: center;\n gap: 12px;\n padding: 10px 16px;\n background: #f8f8f8;\n border-bottom: 1px solid #e0e0e0;\n}\n\n.search-results-summary .result-count {\n font-weight: 600;\n font-size: 13px;\n color: #333;\n}\n\n.search-results-summary .provider-stats {\n font-size: 12px;\n color: #666;\n}\n\n.search-results-summary .failed-count {\n color: #D32F2F;\n}\n\n.clear-results-btn {\n margin-left: auto;\n background: none;\n border: 1px solid #ccc;\n padding: 4px 10px;\n cursor: pointer;\n border-radius: 3px;\n font-size: 11px;\n color: #666;\n display: flex;\n align-items: center;\n gap: 4px;\n}\n\n.clear-results-btn:hover {\n background: #f0f0f0;\n color: #333;\n}\n\n.provider-results-list {\n padding: 8px 0;\n}\n\n.provider-result-group {\n margin-bottom: 16px;\n}\n\n.provider-result-group:last-child {\n margin-bottom: 0;\n}\n\n.provider-result-header {\n display: flex;\n align-items: center;\n gap: 8px;\n padding: 8px 16px;\n background: #f5f5f5;\n font-size: 13px;\n font-weight: 600;\n color: #333;\n}\n\n.provider-result-header i {\n color: #007AFF;\n}\n\n.provider-result-header .result-count {\n font-weight: normal;\n color: #666;\n}\n\n.provider-result-group.failed .provider-result-header {\n background: #fff5f5;\n}\n\n.provider-result-group.failed .provider-result-header i {\n color: #D32F2F;\n}\n\n.error-badge {\n color: #D32F2F;\n font-weight: normal;\n font-size: 12px;\n display: flex;\n align-items: center;\n gap: 4px;\n}\n\n.provider-result-files {\n padding: 0;\n}\n\n.search-result-item {\n display: flex;\n align-items: center;\n gap: 12px;\n padding: 8px 16px 8px 40px;\n border-bottom: 1px solid #f0f0f0;\n cursor: pointer;\n transition: background-color 0.1s;\n}\n\n.search-result-item:hover {\n background-color: #f8f8f8;\n}\n\n.search-result-item:last-child {\n border-bottom: none;\n}\n\n.search-result-item .file-icon {\n font-size: 16px;\n color: #666;\n flex-shrink: 0;\n}\n\n.search-result-item .file-info {\n flex: 1;\n min-width: 0;\n display: flex;\n flex-direction: column;\n gap: 2px;\n}\n\n.search-result-item .file-name {\n font-size: 13px;\n font-weight: 500;\n color: #333;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\n.search-result-item .file-path {\n font-size: 11px;\n color: #999;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\n.search-result-item .file-size {\n font-size: 12px;\n color: #666;\n flex-shrink: 0;\n min-width: 60px;\n text-align: right;\n}\n\n.search-result-item .file-date {\n font-size: 12px;\n color: #666;\n flex-shrink: 0;\n min-width: 140px;\n text-align: right;\n}\n\n.no-results-message {\n padding: 16px 40px;\n font-size: 12px;\n color: #999;\n font-style: italic;\n}\n\n.searching-state {\n padding: 40px 20px;\n display: flex;\n align-items: center;\n justify-content: center;\n}\n"] }]
|
|
2384
2402
|
}], () => [], { account: [{
|
|
2385
2403
|
type: Input
|
|
2386
2404
|
}], folderPath: [{
|
|
@@ -2390,5 +2408,5 @@ export class FileGridComponent {
|
|
|
2390
2408
|
}], folderStructureChanged: [{
|
|
2391
2409
|
type: Output
|
|
2392
2410
|
}] }); })();
|
|
2393
|
-
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(FileGridComponent, { className: "FileGridComponent", filePath: "src/lib/file-browser/file-grid.component.ts", lineNumber:
|
|
2411
|
+
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(FileGridComponent, { className: "FileGridComponent", filePath: "src/lib/file-browser/file-grid.component.ts", lineNumber: 68 }); })();
|
|
2394
2412
|
//# sourceMappingURL=file-grid.component.js.map
|