Merge pull request #7606 from jwangyangls/fix_delete_repository_and_oidc_add_tooltip

Add OIDC Redirect url and fix delete repository bug and fix operation refresh bug

src/portal/lib/src/operation/operate.ts

@@ -8,7 +8,7 @@ export class OperateInfo {
         this.name = '';
         this.state = '';
         this.data = {id: -1, name: '', errorInf: ''};
-        this.timeStamp = 0;
+        this.timeStamp = new Date().getTime();
         this.timeDiff = 'less 1 minute';
     }
 }

src/portal/lib/src/repository-gridview/repository-gridview.component.ts

@@ -138,7 +138,7 @@ export class RepositoryGridviewComponent implements OnChanges, OnInit {
         // Get system info for tag views
         this.systemInfoService.getSystemInfo()
             .subscribe(systemInfo => (this.systemInfo = systemInfo)
-            , error => this.errorHandler.error(error));
+                , error => this.errorHandler.error(error));
 
         if (this.mode === "admiral") {
             this.isCardView = true;
@@ -151,29 +151,42 @@ export class RepositoryGridviewComponent implements OnChanges, OnInit {
     }
 
     confirmDeletion(message: ConfirmationAcknowledgement) {
-        if (message &&
+        let repArr: any[] = [];
-            message.source === ConfirmationTargets.REPOSITORY &&
+        message.data.forEach(repo => {
-            message.state === ConfirmationState.CONFIRMED) {
+            if (!this.signedCon[repo.name]) {
-
+                repArr.push(this.getTagInfo(repo.name));
-            let repoLists = message.data;
-            if (repoLists && repoLists.length) {
-                let observableLists: any[] = [];
-                repoLists.forEach(repo => {
-                    observableLists.push(this.delOperate(repo));
-                });
-
-                forkJoin(observableLists).subscribe((item) => {
-                    this.selectedRow = [];
-                    this.refresh();
-                    let st: State = this.getStateAfterDeletion();
-                    if (!st) {
-                        this.refresh();
-                    } else {
-                        this.clrLoad(st);
-                    }
-                });
             }
-        }
+        });
+        this.loading = true;
+        forkJoin(...repArr).subscribe(() => {
+            if (message &&
+                message.source === ConfirmationTargets.REPOSITORY &&
+                message.state === ConfirmationState.CONFIRMED) {
+                let repoLists = message.data;
+                if (repoLists && repoLists.length) {
+                    let observableLists: any[] = [];
+                    repoLists.forEach(repo => {
+                        observableLists.push(this.delOperate(repo));
+                    });
+                    forkJoin(observableLists).subscribe((item) => {
+                        this.selectedRow = [];
+                        this.refresh();
+                        let st: State = this.getStateAfterDeletion();
+                        if (!st) {
+                            this.refresh();
+                        } else {
+                            this.clrLoad(st);
+                        }
+                    }, error => {
+                        this.errorHandler.error(error);
+                        this.loading = false;
+                    });
+                }
+            }
+        }, error => {
+            this.errorHandler.error(error);
+            this.loading = false;
+        });
     }
 
     delOperate(repo: RepositoryItem): Observable<any> {
@@ -238,25 +251,16 @@ export class RepositoryGridviewComponent implements OnChanges, OnInit {
     deleteRepos(repoLists: RepositoryItem[]) {
         if (repoLists && repoLists.length) {
             let repoNames: string[] = [];
-            let repArr: any[] = [];
-
             repoLists.forEach(repo => {
                 repoNames.push(repo.name);
-
-                if (!this.signedCon[repo.name]) {
-                    repArr.push(this.getTagInfo(repo.name));
-                }
             });
-
+            this.confirmationDialogSet(
-            forkJoin(...repArr).subscribe(() => {
+                'REPOSITORY.DELETION_TITLE_REPO',
-                this.confirmationDialogSet(
+                '',
-                    'REPOSITORY.DELETION_TITLE_REPO',
+                repoNames.join(','),
-                    '',
+                repoLists,
-                    repoNames.join(','),
+                'REPOSITORY.DELETION_SUMMARY_REPO',
-                    repoLists,
+                ConfirmationButtons.DELETE_CANCEL);
-                    'REPOSITORY.DELETION_SUMMARY_REPO',
-                    ConfirmationButtons.DELETE_CANCEL);
-            }, error => this.errorHandler.error(error));
         }
     }
 
@@ -270,7 +274,7 @@ export class RepositoryGridviewComponent implements OnChanges, OnInit {
                     }
                 });
             })
-            , catchError(error => observableThrowError(error)));
+                , catchError(error => observableThrowError(error)));
     }
 
     confirmationDialogSet(summaryTitle: string, signature: string,
@@ -311,7 +315,7 @@ export class RepositoryGridviewComponent implements OnChanges, OnInit {
                 }
 
             })
-            , catchError(error => observableThrowError(false)));
+                , catchError(error => observableThrowError(false)));
     }
 
     provisionItemEvent(evt: any, repo: RepositoryItem): void {
@@ -358,11 +362,11 @@ export class RepositoryGridviewComponent implements OnChanges, OnInit {
         params.set("page_size", "" + this.pageSize);
 
         this.loading = true;
-            this.repositoryService.getRepositories(
+        this.repositoryService.getRepositories(
-                this.projectId,
+            this.projectId,
-                this.lastFilteredRepoName,
+            this.lastFilteredRepoName,
-                params
+            params
-            )
+        )
             .subscribe((repo: Repository) => {
                 this.totalCount = repo.metadata.xTotalCount;
                 this.repositoriesCopy = repo.data;
@@ -406,11 +410,11 @@ export class RepositoryGridviewComponent implements OnChanges, OnInit {
 
         this.loading = true;
 
-            this.repositoryService.getRepositories(
+        this.repositoryService.getRepositories(
-                this.projectId,
+            this.projectId,
-                this.lastFilteredRepoName,
+            this.lastFilteredRepoName,
-                params
+            params
-            )
+        )
             .subscribe((repo: Repository) => {
 
                 this.totalCount = repo.metadata.xTotalCount;

src/portal/lib/src/service/interface.ts

@@ -257,6 +257,7 @@ export interface SystemInfo {
   harbor_version?: string;
   clair_vulnerability_status?: ClairDBStatus;
   next_scan_all?: number;
+  external_url?: string;
 }
 
 /**

src/portal/src/app/config/auth/config-auth.component.html

@@ -322,6 +322,7 @@
     </section>
 
     <section class="form-block" *ngIf="showOIDC">
+        <div class="oidc-tip">{{ 'CONFIG.OIDC.OIDC_REDIREC_URL' | translate}} <span>{{redirectUrl}}/c/oidc/callback</span></div>
         <div class="form-group">
             <label for="oidcName" class="required">{{'CONFIG.OIDC.OIDC_PROVIDER' | translate}}</label>
             <label for="oidcName" aria-haspopup="true" role="tooltip"

src/portal/src/app/config/auth/config-auth.component.scss

@@ -15,3 +15,8 @@ clr-tooltip {
 .top-5 {
     top: -5px;
 }
+.oidc-tip {
+    position: absolute;
+    top: 170px;
+    color: rgb(210, 74, 112);
+}

src/portal/src/app/config/auth/config-auth.component.ts

@@ -11,11 +11,11 @@
 // WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 // See the License for the specific language governing permissions and
 // limitations under the License.
-import { Component, Input, ViewChild, SimpleChanges, OnChanges } from '@angular/core';
+import { Component, Input, ViewChild, SimpleChanges, OnChanges, OnInit } from '@angular/core';
 import { NgForm } from '@angular/forms';
 import { Subscription } from "rxjs";
 
-import { Configuration, clone, isEmpty, getChanges, StringValueItem, BoolValueItem } from '@harbor/ui';
+import { Configuration, clone, isEmpty, getChanges, StringValueItem, BoolValueItem, SystemInfoService, ErrorHandler } from '@harbor/ui';
 import { MessageHandlerService } from '../../shared/message-handler/message-handler.service';
 import { ConfirmMessageHandler } from '../config.msg.utils';
 import { AppConfigService } from '../../app-config.service';
@@ -28,10 +28,11 @@ const fakePass = 'aWpLOSYkIzJTTU4wMDkx';
     templateUrl: 'config-auth.component.html',
     styleUrls: ['./config-auth.component.scss', '../config.component.scss']
 })
-export class ConfigurationAuthComponent implements OnChanges {
+export class ConfigurationAuthComponent implements OnChanges, OnInit {
     changeSub: Subscription;
     testingLDAPOnGoing = false;
     onGoing = false;
+    redirectUrl: string;
     // tslint:disable-next-line:no-input-rename
     @Input('allConfig') currentConfig: Configuration = new Configuration();
     private originalConfig: Configuration;
@@ -41,10 +42,19 @@ export class ConfigurationAuthComponent implements OnChanges {
         private msgHandler: MessageHandlerService,
         private configService: ConfigurationService,
         private appConfigService: AppConfigService,
-        private confirmMessageHandler: ConfirmMessageHandler
+        private confirmMessageHandler: ConfirmMessageHandler,
+        private systemInfo: SystemInfoService,
+        private errorHandler: ErrorHandler,
     ) {
     }
-
+    ngOnInit() {
+        this.getSystemInfo();
+    }
+    getSystemInfo(): void {
+        this.systemInfo.getSystemInfo()
+            .subscribe(systemInfo => (this.redirectUrl = systemInfo.external_url)
+                , error => this.errorHandler.error(error));
+    }
     get checkable() {
         return this.currentConfig &&
             this.currentConfig.self_registration &&

src/portal/src/i18n/lang/en-us-lang.json

@@ -756,6 +756,7 @@
         },
         "OIDC": {
             "OIDC_PROVIDER": "OIDC Provider Name",
+            "OIDC_REDIREC_URL": "Please make sure the Redirect URI on the OIDC provider is set to",
             "ENDPOINT": "OIDC Endpoint",
             "CLIENT_ID": "OIDC Client ID",
             "CLIENTSECRET": "OIDC Client Secret",

src/portal/src/i18n/lang/es-es-lang.json

@@ -756,6 +756,7 @@
         },
         "OIDC": {
             "OIDC_PROVIDER": "OIDC Proveedor",
+            "OIDC_REDIREC_URL": "Please make sure the Redirect URI on the OIDC provider is set to",
             "ENDPOINT": "OIDC Endpoint",
             "CLIENT_ID": "ID de cliente OIDC",
             "CLIENTSECRET": "OIDC Client Secret",

src/portal/src/i18n/lang/fr-fr-lang.json

@@ -729,6 +729,7 @@
         },
         "OIDC": {
             "OIDC_PROVIDER": "OIDC Fournisseur",
+            "OIDC_REDIREC_URL": "Please make sure the Redirect URI on the OIDC provider is set to",
             "ENDPOINT": "OIDC Faramètre",
             "CLIENT_ID": "no d'identification du client OIDC",
             "CLIENTSECRET": "OIDC Client Secret",

src/portal/src/i18n/lang/pt-br-lang.json

@@ -750,6 +750,7 @@
         },
         "OIDC": {
             "OIDC_PROVIDER": "OIDC Fornecedor",
+            "OIDC_REDIREC_URL": "Please make sure the Redirect URI on the OIDC provider is set to",
             "ENDPOINT": "OIDC Endpoint",
             "CLIENT_ID": "ID de cliente OIDC",
             "CLIENTSECRET": "OIDC Client Secret",

src/portal/src/i18n/lang/zh-cn-lang.json

@@ -755,6 +755,7 @@
         },
         "OIDC": {
             "OIDC_PROVIDER": "OIDC 供应商",
+            "OIDC_REDIREC_URL": "请确保将OIDC提供的重定向地址设置为",
             "ENDPOINT": "OIDC Endpoint",
             "CLIENT_ID": "OIDC 客户端标识",
             "CLIENTSECRET": "OIDC 客户端密码",