Skip to content

Commit

Permalink
Switched routes to be prefixed with /owner/repo for clarity and minor…
Browse files Browse the repository at this point in the history
… fixes (#69)

* Add recommended vscode extensions and settings

* change color= to mat-

* Add processing to all save buttons

* Add email validation

* Add version to footer

* Got settings tab routing working

* Turned off requireHttps for load balancer

* Fixes for switching repositories

* rename deployManagerSiteUrl to prdeployPortalUrl

* Update template URLs for prdeploy portal
  • Loading branch information
greggbjensen authored Aug 23, 2024
1 parent 7f4f094 commit d2cb099
Show file tree
Hide file tree
Showing 62 changed files with 415 additions and 223 deletions.
7 changes: 6 additions & 1 deletion .vscode/settings.json
Original file line number Diff line number Diff line change
Expand Up @@ -27,5 +27,10 @@
"**/package-lock.json": true
},
"files.eol": "\n",
"editor.tabSize": 2
"editor.tabSize": 2,
"workbench.colorCustomizations": {
"activityBar.background": "#5A073E",
"titleBar.activeBackground": "#7E0957",
"titleBar.activeForeground": "#FFFBFE"
}
}
3 changes: 0 additions & 3 deletions prdeploy-api/.gitignore
Original file line number Diff line number Diff line change
Expand Up @@ -246,8 +246,5 @@ _Pvt_Extensions
.idea/
*.sln.iml

# VS Code
**/.vscode

# build job output
/build/output/
14 changes: 14 additions & 0 deletions prdeploy-api/.vscode/extensions.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,14 @@
{
"recommendations": [
"ms-vscode.powershell",
"editorconfig.editorconfig",
"ms-dotnettools.csharp",
"eamodio.gitlens",
"github.vscode-pull-request-github",
"dbaeumer.vscode-eslint",
"pkief.material-icon-theme",
"pflannery.vscode-versionlens",
"shardulm94.trailing-spaces",
"ms-dotnettools.csdevkit"
]
}
7 changes: 7 additions & 0 deletions prdeploy-api/.vscode/settings.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,7 @@
{
"workbench.colorCustomizations": {
"activityBar.background": "#222F3E",
"titleBar.activeBackground": "#304157",
"titleBar.activeForeground": "#F9FAFC"
}
}
7 changes: 7 additions & 0 deletions prdeploy-app/.vscode/extensions.json
Original file line number Diff line number Diff line change
@@ -1,7 +1,14 @@
{
"recommendations": [
"eamodio.gitlens",
"editorconfig.editorconfig",
"dbaeumer.vscode-eslint",
"esbenp.prettier-vscode",
"github.vscode-pull-request-github",
"pkief.material-icon-theme",
"pflannery.vscode-versionlens",
"stylelint.vscode-stylelint",
"mrmlnc.vscode-scss",
"shardulm94.trailing-spaces"
]
}
59 changes: 36 additions & 23 deletions prdeploy-app/src/app/app-navigation.ts
Original file line number Diff line number Diff line change
Expand Up @@ -6,26 +6,39 @@ export interface NavItem {
children?: NavItem[];
}

export const navigation = () =>
[
{
text: 'Deployments',
path: '/deployments',
icon: 'cloud_upload'
},
{
text: 'Environments',
path: '/environments',
icon: 'list_alt'
},
{
text: 'Repositories',
path: '/repositories',
icon: 'folder_open'
},
{
text: 'Settings',
path: '/settings',
icon: 'settings'
}
] as NavItem[];
let currentNav = [
{
text: 'Repositories',
path: '/repositories',
icon: 'folder_open'
}
];

export const navigation = (owner: string, repo: string) => {
if (owner && repo && owner.length > 0 && repo.length > 0) {
currentNav = [
{
text: 'Deployments',
path: `${owner}/${repo}/deployments`,
icon: 'cloud_upload'
},
{
text: 'Environments',
path: `${owner}/${repo}/environments`,
icon: 'list_alt'
},
{
text: 'Repositories',
path: '/repositories',
icon: 'folder_open'
},
{
text: 'Settings',
path: `${owner}/${repo}/settings`,
icon: 'settings'
}
] as NavItem[];
}

return currentNav;
};
3 changes: 1 addition & 2 deletions prdeploy-app/src/app/app.component.ts
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
import { Component, HostListener } from '@angular/core';
import { AppInfoService, AuthService } from './shared/services';
import { AuthService } from './shared/services';
import { RouterOutlet } from '@angular/router';
import { FooterComponent, SideNavigationMenuComponent, HeaderComponent } from './shared/components';
import { MatSnackBarModule } from '@angular/material/snack-bar';
Expand Down Expand Up @@ -38,7 +38,6 @@ export class AppComponent {
isAuthenticated = false;

constructor(
public appInfo: AppInfoService,
private _breakpointObserver: BreakpointObserver,
private _authService: AuthService
) {
Expand Down
37 changes: 24 additions & 13 deletions prdeploy-app/src/app/app.routes.ts
Original file line number Diff line number Diff line change
Expand Up @@ -9,25 +9,36 @@ export const routes: Routes = [
pathMatch: 'full'
},
...authRoutes,
{
path: 'deployments',
canActivate: [AuthGuard],
loadChildren: () => import('./deployments/deployments.routes').then(m => m.routes)
},
{
path: 'environments',
canActivate: [AuthGuard],
loadChildren: () => import('./environments/environments.routes').then(m => m.routes)
},
{
path: 'repositories',
canActivate: [AuthGuard],
loadChildren: () => import('./repositories/repositories.routes').then(m => m.routes)
},
{
path: 'settings',
canActivate: [AuthGuard],
loadChildren: () => import('./settings/settings.routes').then(m => m.routes)
path: ':owner/:repo',
children: [
{
path: 'deployments',
redirectTo: 'login',
pathMatch: 'full'
},
{
path: 'deployments',
canActivate: [AuthGuard],
loadChildren: () => import('./deployments/deployments.routes').then(m => m.routes)
},
{
path: 'environments',
canActivate: [AuthGuard],
loadChildren: () => import('./environments/environments.routes').then(m => m.routes)
},

{
path: 'settings',
canActivate: [AuthGuard],
loadChildren: () => import('./settings/settings.routes').then(m => m.routes)
}
]
},
{
path: '**',
Expand Down
6 changes: 6 additions & 0 deletions prdeploy-app/src/app/auth/auth.routes.ts
Original file line number Diff line number Diff line change
@@ -1,6 +1,12 @@
import { Routes } from '@angular/router';
import { AuthGuard } from '../shared/services';

export const authRoutes: Routes = [
{
path: 'auth/secure-redirect',
canActivate: [AuthGuard],
loadComponent: () => import('./secure-redirect/secure-redirect.component').then(m => m.SecureRedirectComponent)
},
{
path: 'login/callback',
loadComponent: () => import('./login-callback/login-callback.component').then(m => m.LoginCallbackComponent)
Expand Down
Original file line number Diff line number Diff line change
@@ -1,5 +1,3 @@
<div class="loading">
<div>
<mat-spinner></mat-spinner>
</div>
<mat-spinner class="loading-spinner"></mat-spinner>
</div>
Original file line number Diff line number Diff line change
Expand Up @@ -4,10 +4,9 @@
flex: 1 1 auto;
}

.loading {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
height: 400px;
.loading-spinner {
position: absolute;
top: 300px;
left: 50%;
margin-left: -50px;
}
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@
<div class="text-emptystate-header margin-bottom-tiny">Oops! your account is unreachable</div>
<div class="text-emptystate-default margin-bottom-small">Contact us if this persists.</div>
<div class="button-container">
<button mat-flat-button color="primary" (click)="logInAgainClicked()">
<button mat-flat-button class="mat-primary" (click)="logInAgainClicked()">
{{ !loggingOut ? 'Log in again' : 'Redirecting' }}
</button>
</div>
Expand Down
2 changes: 1 addition & 1 deletion prdeploy-app/src/app/auth/login/login.component.html
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,7 @@
}
<img class="logo" alt="prdeploy" src="/assets/images/logo.svg" />
<div class="actions">
<button mat-flat-button color="primary" class="login-btn" [routerLink]="['/deployments']">
<button mat-flat-button class="mat-primary login-btn" [routerLink]="['/auth/secure-redirect']">
Login with GitHub
</button>
</div>
Expand Down
2 changes: 1 addition & 1 deletion prdeploy-app/src/app/auth/login/login.component.ts
Original file line number Diff line number Diff line change
Expand Up @@ -23,7 +23,7 @@ export class LoginComponent implements OnInit {
) {
const path = this._location.path();
if (authService.hasValidToken() && path.startsWith('/login')) {
this._router.navigate(['/deployments']);
this._router.navigate(['/auth/secure-redirect']);
} else {
this.visible = true;
}
Expand Down
Original file line number Diff line number Diff line change
@@ -0,0 +1,3 @@
<div class="loading">
<mat-spinner class="loading-spinner"></mat-spinner>
</div>
Original file line number Diff line number Diff line change
@@ -0,0 +1,10 @@
:host {
flex: 1 1 auto;
}

.loading-spinner {
position: absolute;
top: 300px;
left: 50%;
margin-left: -50px;
}
Original file line number Diff line number Diff line change
@@ -0,0 +1,33 @@
import { Component } from '@angular/core';
import { MatProgressSpinnerModule } from '@angular/material/progress-spinner';
import { firstValueFrom } from 'rxjs';
import { EnabledOwnerReposGQL } from 'src/app/shared/graphql';
import { RepoManager, RouteManager } from 'src/app/shared/managers';

@Component({
selector: 'app-secure-redirect',
standalone: true,
imports: [MatProgressSpinnerModule],
templateUrl: './secure-redirect.component.html',
styleUrl: './secure-redirect.component.scss'
})
export class SecureRedirectComponent {
constructor(
private _repoManager: RepoManager,
private _routeManager: RouteManager,
private _enabledOwnerReposGQL: EnabledOwnerReposGQL
) {
this.redirectToOwnerRepo();
}

async redirectToOwnerRepo() {
const response = await firstValueFrom(this._enabledOwnerReposGQL.fetch());
const ownerRepos = response.data.enabledOwnerRepos;
const hasRepos = await this._repoManager.updateOwnerRepos(ownerRepos);
if (hasRepos && ownerRepos && ownerRepos.length > 0) {
const owner = ownerRepos[0].owner;
const repo = ownerRepos[0].repos[0];
this._routeManager.navigate(['/', owner, repo, 'deployments']);
}
}
}
Original file line number Diff line number Diff line change
Expand Up @@ -42,10 +42,10 @@ <h2 mat-dialog-title>Add Services to Pull Request</h2>
</form>
</mat-dialog-content>
<mat-dialog-actions>
<button mat-stroked-button color="primary" (click)="cancel()">Cancel</button>
<button mat-stroked-button class="mat-primary" (click)="cancel()">Cancel</button>
<button
mat-flat-button
color="primary"
class="mat-primary"
(click)="addServicesToPr()"
[loading]="processing"
[disabled]="!selectedPullRequest || processing || !selectedServices?.length">
Expand Down
8 changes: 4 additions & 4 deletions prdeploy-app/src/app/deployments/deployments.component.html
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
<h2>
Deployments
<button mat-icon-button title="Refresh" color="accent" (click)="update()">
<button mat-icon-button title="Refresh" class="mat-accent" (click)="update()">
<mat-icon>sync</mat-icon>
</button>
</h2>
Expand All @@ -10,7 +10,7 @@ <h2>

<h2>
Queues
<button mat-icon-button title="Refresh" color="accent" (click)="update()">
<button mat-icon-button title="Refresh" class="mat-accent" (click)="update()">
<mat-icon>sync</mat-icon>
</button>
</h2>
Expand All @@ -27,7 +27,7 @@ <h2>
@if (queue.pullRequests.length) {
<button
mat-icon-button
color="accent"
class="mat-accent"
title="Trigger deployments"
(click)="triggerDeployments($event, queue)">
<mat-icon>refresh</mat-icon>
Expand All @@ -50,7 +50,7 @@ <h2>
}

<div class="page-actions">
<button mat-stroked-button color="primary" class="add-service-pr-btn" (click)="showAddServiceToPr()">
<button mat-stroked-button class="mat-primary add-service-pr-btn" (click)="showAddServiceToPr()">
Add Services to Pull Request
</button>
</div>
2 changes: 1 addition & 1 deletion prdeploy-app/src/app/deployments/deployments.component.ts
Original file line number Diff line number Diff line change
Expand Up @@ -108,7 +108,7 @@ export class DeploymentsComponent implements OnInit {
}

this.deployQueues = response.data.deployQueues;
this._routeManager.updateQueryParams();
this._routeManager.updateQueryParams({ environment: this.selectedEnvironment });
} catch (error) {
this._loggingService.error(error);
}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -32,11 +32,12 @@ <h2 mat-dialog-title>Force Deploy {{ data.environment }}</h2>
</form>
</mat-dialog-content>
<mat-dialog-actions>
<button mat-stroked-button color="primary" (click)="cancel()">Cancel</button>
<button mat-stroked-button class="mat-primary" (click)="cancel()">Cancel</button>
<button
mat-flat-button
color="primary"
class="mat-primary"
(click)="forceDeploy()"
[loading]="processing"
[disabled]="!form.valid || !selectedPullRequest || processing">
Deploy
</button>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -20,6 +20,7 @@ import { MatAutocompleteModule, MatAutocompleteSelectedEvent } from '@angular/ma
import { MatInputModule } from '@angular/material/input';
import { FormControl, FormGroup, ReactiveFormsModule, Validators } from '@angular/forms';
import { MatFormFieldModule } from '@angular/material/form-field';
import { MtxButtonModule } from '@ng-matero/extensions/button';
import _ from 'lodash';
import { MatIconModule } from '@angular/material/icon';

Expand All @@ -39,6 +40,7 @@ import { MatIconModule } from '@angular/material/icon';
MatCheckboxModule,
MatButtonModule,
MatFormFieldModule,
MtxButtonModule,
ReactiveFormsModule
]
})
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,8 @@ <h2 mat-dialog-title>Rollback {{ data.environment }}</h2>
</form>
</mat-dialog-content>
<mat-dialog-actions>
<button mat-stroked-button color="primary" (click)="cancel()">Cancel</button>
<button mat-flat-button color="primary" (click)="rollback()" [disabled]="processing">Rollback</button>
<button mat-stroked-button class="mat-primary" (click)="cancel()">Cancel</button>
<button mat-flat-button class="mat-primary" (click)="rollback()" [loading]="processing" [disabled]="processing">
Rollback
</button>
</mat-dialog-actions>
Loading

0 comments on commit d2cb099

Please sign in to comment.