Skip to content

Commit

Permalink
[#11878] Admin Search UI Update for ARF (#12945)
Browse files Browse the repository at this point in the history 
* update admin search page to use acc req component

* fix selector for e2e test

* fix spec files and imports

* update e2e selector

* fix column numbers
  • Loading branch information
@domoberzin
domoberzin committed Mar 27, 2024
1 parent 40613df commit 5618370
Show file tree
Hide file tree
Showing 7 changed files with 143 additions and 249 deletions.
10 changes: 5 additions & 5 deletions src/e2e/java/teammates/e2e/pageobjects/AdminSearchPage.java
View file
Original file line number Diff line number Diff line change
Expand Up @@ -38,9 +38,9 @@ public class AdminSearchPage extends AppPage {

private static final int ACCOUNT_REQUEST_COL_NAME = 1;
private static final int ACCOUNT_REQUEST_COL_EMAIL = 2;
private static final int ACCOUNT_REQUEST_COL_INSTITUTE = 3;
private static final int ACCOUNT_REQUEST_COL_CREATED_AT = 4;
private static final int ACCOUNT_REQUEST_COL_REGISTERED_AT = 5;
private static final int ACCOUNT_REQUEST_COL_INSTITUTE = 4;
private static final int ACCOUNT_REQUEST_COL_CREATED_AT = 5;
private static final int ACCOUNT_REQUEST_COL_REGISTERED_AT = 6;

private static final String EXPANDED_ROWS_HEADER_EMAIL = "Email";
private static final String EXPANDED_ROWS_HEADER_COURSE_JOIN_LINK = "Course Join Link";
Expand Down Expand Up @@ -273,7 +273,7 @@ public void resetInstructorGoogleId(InstructorAttributes instructor) {
public WebElement getAccountRequestRow(AccountRequestAttributes accountRequest) {
String email = accountRequest.getEmail();
String institute = accountRequest.getInstitute();
List<WebElement> rows = browser.driver.findElements(By.cssSelector("#search-table-account-request tbody tr"));
List<WebElement> rows = browser.driver.findElements(By.cssSelector("tm-account-request-table tbody tr"));
for (WebElement row : rows) {
List<WebElement> columns = row.findElements(By.tagName("td"));
if (removeSpanFromText(columns.get(ACCOUNT_REQUEST_COL_EMAIL - 1)
Expand All @@ -289,7 +289,7 @@ && removeSpanFromText(columns.get(ACCOUNT_REQUEST_COL_INSTITUTE - 1)
public WebElement getAccountRequestRow(AccountRequest accountRequest) {
String email = accountRequest.getEmail();
String institute = accountRequest.getInstitute();
List<WebElement> rows = browser.driver.findElements(By.cssSelector("#search-table-account-request tbody tr"));
List<WebElement> rows = browser.driver.findElements(By.cssSelector("tm-account-request-table tbody tr"));
for (WebElement row : rows) {
List<WebElement> columns = row.findElements(By.tagName("td"));
if (removeSpanFromText(columns.get(ACCOUNT_REQUEST_COL_EMAIL - 1)
Expand Down
2 changes: 1 addition & 1 deletion src/web/app/components/account-requests-table/account-request-table.component.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -68,7 +68,7 @@
</td>
</tr>
<tr *ngIf="accountRequest.showLinks && searchString">
<td colspan="8">
<td colspan="100">
<ul class="list-group" *ngIf="accountRequest.showLinks" @collapseAnim>
<li class="list-group-item list-group-item-info">
<strong>Account Registration Link</strong>
Expand Down
195 changes: 93 additions & 102 deletions .../app/pages-admin/admin-search-page/__snapshots__/admin-search-page.component.spec.ts.snap
View file
Original file line number Diff line number Diff line change
Expand Up @@ -433,119 +433,110 @@ exports[`AdminSearchPageComponent should snap with an expanded account requests
100 characters left
</span>
</div>
</div><div
class="card bg-light top-padded"
>
</div><tm-account-request-table>
<div
class="card-header bg-primary text-white"
class="card bg-light top-padded"
>
<strong>
Account Requests Found
</strong>
<div
class="card-header-btn-toolbar"
class="card-header bg-primary text-white"
>
<button
class="btn btn-light btn-sm"
id="show-account-request-links"
style="margin-right: 10px;"
type="button"
>
Expand All
</button>
<button
class="btn btn-light btn-sm"
id="hide-account-request-links"
type="button"
>
Collapse All
</button>
<strong>
Pending Account Requests
</strong>
</div>
</div>
<div
class="table-responsive"
>
<table
class="table table-striped data-table"
id="search-table-account-request"
<div
class="table-responsive"
>
<thead>
<tr>
<th>
Name
</th>
<th>
Email
</th>
<th>
Institute
</th>
<th>
Created At
</th>
<th>
Registered At
</th>
<th>
Options
</th>
</tr>
</thead>
<tbody>
<tr>
<td>
name
</td>
<td>
email
</td>
<td>
institute
</td>
<td>
Tue, 08 Feb 2022, 08:23 AM +00:00
</td>
<td>
Not Registered Yet
</td>
<td>
<div
class="ngb-tooltip-class"
<table
class="table table-striped data-table"
id="search-table-account-request"
>
<thead>
<tr>
<th>
Name
</th>
<th>
Email
</th>
<th>
Status
</th>
<th>
Institute, Country
</th>
<th>
Created At
</th>
<th>
Comments
</th>
<th>
Options
</th>
</tr>
</thead>
<tbody>
<tr>
<td>
name
</td>
<td>
email
</td>
<td>
PENDING
</td>
<td>
institute
</td>
<td
id="timestamp-box"
>
<button
class="btn btn-danger"
id="delete-account-request-0"
Tue, 08 Feb 2022, 08:23 AM +00:00
</td>
<td>
<div
id="comment-box"
>
Delete
</button>
</div>
</td>
</tr>
<tr>
<td
colspan="6"
>
<ul
class="list-group ng-trigger ng-trigger-collapseAnim ng-animating"
</div>
</td>
<td
class="align-middle"
>
<li
class="list-group-item list-group-item-info"
<div
class="d-flex flex-row align-items-center justify-content-center gap-2"
>
<strong>
Account Registration Link
</strong>
<input
class="form-control"
disabled=""
/>
</li>
</ul>
</td>
</tr>
</tbody>
</table>
<div
class="ngb-tooltip-class"
>
<a
href="javascript:;"
id="delete-account-request-0"
>
<i
class="fa-solid fa-trash"
/>
</a>
</div>
<div>
<a
href="javascript:;"
id="view-account-request-0"
>
<i
class="fa-solid fa-eye"
/>
</a>
</div>
</div>
</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</tm-account-request-table>
</tm-admin-search-page>
`;

Expand Down
64 changes: 1 addition & 63 deletions src/web/app/pages-admin/admin-search-page/admin-search-page.component.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -203,66 +203,4 @@
</div>
</div>

<div class="card bg-light top-padded" *ngIf="accountRequests.length">
<div class="card-header bg-primary text-white">
<strong>Account Requests Found</strong>
<div class="card-header-btn-toolbar">
<button id="show-account-request-links" class="btn btn-light btn-sm" style="margin-right: 10px;" type="button" (click)="showAllAccountRequestsLinks()">Expand All</button>
<button id="hide-account-request-links" class="btn btn-light btn-sm" type="button" (click)="hideAllAccountRequestsLinks()">Collapse All</button>
</div>
</div>

<div class="table-responsive">
<table class="table table-striped data-table" id="search-table-account-request">
<thead>
<tr>
<th>Name</th>
<th>Email</th>
<th>Institute</th>
<th>Created At</th>
<th>Registered At</th>
<th>Options</th>
</tr>
</thead>
<tbody>
<ng-container *ngFor="let accountRequest of accountRequests; let i = index">
<tr (click)="accountRequest.showLinks = !accountRequest.showLinks">
<td [innerHtml]="accountRequest.name | highlighter:searchString:true">
<br>
<div class="col-sm-1">
<button *ngIf="!accountRequest.showLinks" class="btn" aria-label="Expand">
<i class="fas fa-chevron-circle-down" style="color: blue;"></i>
</button>
<button *ngIf="accountRequest.showLinks" class="btn" aria-label="Collapse">
<i class="fas fa-chevron-circle-up" style="color: blue;"></i>
</button>
</div>
</td>
<td [innerHtml]="accountRequest.email | highlighter:searchString:true">{{ accountRequest.email }}</td>
<td [innerHtml]="accountRequest.institute | highlighter:searchString:true">{{ accountRequest.institute }}</td>
<td>{{ accountRequest.createdAtText }}</td>
<td>{{ accountRequest.registeredAtText || 'Not Registered Yet' }}</td>
<td>
<a id="reset-account-request-{{i}}" href="javascript:;" (click)="$event.stopPropagation(); resetAccountRequest(accountRequest);" *ngIf="accountRequest.registeredAtText">
<i class="fas fa-sync"></i> Reset Account Request
</a>
<div class="ngb-tooltip-class" [ngbTooltip]="accountRequest.registeredAtText && 'Account requests of registered instructors cannot be deleted'">
<button id="delete-account-request-{{i}}" class="btn btn-danger" [disabled]="accountRequest.registeredAtText" (click)="$event.stopPropagation(); deleteAccountRequest(accountRequest);">Delete</button>
</div>
</td>
</tr>
<tr *ngIf="accountRequest.showLinks">
<td colspan="6">
<ul class="list-group" *ngIf="accountRequest.showLinks" @collapseAnim>
<li class="list-group-item list-group-item-info">
<strong>Account Registration Link</strong>
<input [value]="accountRequest.registrationLink" disabled class="form-control">
</li>
</ul>
</td>
</tr>
</ng-container>
</tbody>
</table>
</div>
</div>
<tm-account-request-table *ngIf="accountRequests.length" [accountRequests]="accountRequests" [searchString]="searchQuery"></tm-account-request-table>
Loading

0 comments on commit 5618370

Please sign in to comment.