Compare commits
1 Commits
master
...
chore/angu
| Author | SHA1 | Date |
|---|---|---|
 Clément FRÉVILLE
|
0e0804acdd | 1 year ago |
@ -1,41 +0,0 @@
|
|||||||
{
|
|
||||||
"root": true,
|
|
||||||
"ignorePatterns": ["projects/**/*"],
|
|
||||||
"overrides": [
|
|
||||||
{
|
|
||||||
"files": ["*.ts"],
|
|
||||||
"extends": [
|
|
||||||
"eslint:recommended",
|
|
||||||
"plugin:@typescript-eslint/recommended",
|
|
||||||
"plugin:@angular-eslint/recommended",
|
|
||||||
"plugin:@angular-eslint/template/process-inline-templates"
|
|
||||||
],
|
|
||||||
"rules": {
|
|
||||||
"@angular-eslint/directive-selector": [
|
|
||||||
"error",
|
|
||||||
{
|
|
||||||
"type": "attribute",
|
|
||||||
"prefix": "app",
|
|
||||||
"style": "camelCase"
|
|
||||||
}
|
|
||||||
],
|
|
||||||
"@angular-eslint/component-selector": [
|
|
||||||
"error",
|
|
||||||
{
|
|
||||||
"type": "element",
|
|
||||||
"prefix": "app",
|
|
||||||
"style": "kebab-case"
|
|
||||||
}
|
|
||||||
]
|
|
||||||
}
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"files": ["*.html"],
|
|
||||||
"extends": [
|
|
||||||
"plugin:@angular-eslint/template/recommended",
|
|
||||||
"plugin:@angular-eslint/template/accessibility"
|
|
||||||
],
|
|
||||||
"rules": {}
|
|
||||||
}
|
|
||||||
]
|
|
||||||
}
|
|
||||||
@ -0,0 +1,44 @@
|
|||||||
|
// @ts-check
|
||||||
|
const eslint = require("@eslint/js");
|
||||||
|
const tseslint = require("typescript-eslint");
|
||||||
|
const angular = require("angular-eslint");
|
||||||
|
|
||||||
|
module.exports = tseslint.config(
|
||||||
|
{
|
||||||
|
files: ["**/*.ts"],
|
||||||
|
extends: [
|
||||||
|
eslint.configs.recommended,
|
||||||
|
...tseslint.configs.recommended,
|
||||||
|
...tseslint.configs.stylistic,
|
||||||
|
...angular.configs.tsRecommended,
|
||||||
|
],
|
||||||
|
processor: angular.processInlineTemplates,
|
||||||
|
rules: {
|
||||||
|
"@angular-eslint/directive-selector": [
|
||||||
|
"error",
|
||||||
|
{
|
||||||
|
type: "attribute",
|
||||||
|
prefix: "app",
|
||||||
|
style: "camelCase",
|
||||||
|
},
|
||||||
|
],
|
||||||
|
"@angular-eslint/component-selector": [
|
||||||
|
"error",
|
||||||
|
{
|
||||||
|
type: "element",
|
||||||
|
prefix: "app",
|
||||||
|
style: "kebab-case",
|
||||||
|
},
|
||||||
|
],
|
||||||
|
"@typescript-eslint/no-inferrable-types": "off",
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
files: ["**/*.html"],
|
||||||
|
extends: [
|
||||||
|
...angular.configs.templateRecommended,
|
||||||
|
...angular.configs.templateAccessibility,
|
||||||
|
],
|
||||||
|
rules: {},
|
||||||
|
}
|
||||||
|
);
|
||||||
File diff suppressed because it is too large
Load Diff
@ -1,18 +0,0 @@
|
|||||||
.form-container {
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
}
|
|
||||||
|
|
||||||
.form-field {
|
|
||||||
width: 100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
.success-message {
|
|
||||||
color: green;
|
|
||||||
margin-top: 20px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.error-message {
|
|
||||||
color: red;
|
|
||||||
margin-top: 20px;
|
|
||||||
}
|
|
||||||
@ -1,33 +0,0 @@
|
|||||||
<form [formGroup]="loginForm" (ngSubmit)="loginAction()">
|
|
||||||
<mat-form-field>
|
|
||||||
<mat-label>Login</mat-label>
|
|
||||||
<input matInput formControlName="login" required />
|
|
||||||
<mat-error *ngIf="loginForm.controls.login.invalid">
|
|
||||||
Login is required
|
|
||||||
</mat-error>
|
|
||||||
</mat-form-field>
|
|
||||||
|
|
||||||
<mat-form-field>
|
|
||||||
<mat-label>Password</mat-label>
|
|
||||||
<input
|
|
||||||
matInput
|
|
||||||
[type]="hide ? 'password' : 'text'"
|
|
||||||
formControlName="password"
|
|
||||||
required />
|
|
||||||
<button
|
|
||||||
mat-icon-button
|
|
||||||
matSuffix
|
|
||||||
(click)="hide = !hide"
|
|
||||||
[attr.aria-label]="'Hide password'">
|
|
||||||
<mat-icon>{{ hide ? 'visibility_off' : 'visibility' }}</mat-icon>
|
|
||||||
</button>
|
|
||||||
<mat-error *ngIf="loginForm.controls.password.invalid">
|
|
||||||
Password is required
|
|
||||||
</mat-error>
|
|
||||||
</mat-form-field>
|
|
||||||
|
|
||||||
<button mat-raised-button type="submit">Login</button>
|
|
||||||
|
|
||||||
<div *ngIf="errorLogin">{{ errorLogin }}</div>
|
|
||||||
<div *ngIf="successLogin">{{ successLogin }}</div>
|
|
||||||
</form>
|
|
||||||
@ -1,24 +0,0 @@
|
|||||||
import { ComponentFixture, TestBed } from '@angular/core/testing';
|
|
||||||
|
|
||||||
import { LoginComponent } from './login.component';
|
|
||||||
import { HttpClientModule } from '@angular/common/http';
|
|
||||||
import { NoopAnimationsModule } from '@angular/platform-browser/animations';
|
|
||||||
|
|
||||||
describe('LoginComponent', () => {
|
|
||||||
let component: LoginComponent;
|
|
||||||
let fixture: ComponentFixture<LoginComponent>;
|
|
||||||
|
|
||||||
beforeEach(async () => {
|
|
||||||
await TestBed.configureTestingModule({
|
|
||||||
imports: [LoginComponent, HttpClientModule, NoopAnimationsModule],
|
|
||||||
}).compileComponents();
|
|
||||||
|
|
||||||
fixture = TestBed.createComponent(LoginComponent);
|
|
||||||
component = fixture.componentInstance;
|
|
||||||
fixture.detectChanges();
|
|
||||||
});
|
|
||||||
|
|
||||||
it('should create', () => {
|
|
||||||
expect(component).toBeTruthy();
|
|
||||||
});
|
|
||||||
});
|
|
||||||
@ -1,71 +0,0 @@
|
|||||||
import { Component } from '@angular/core';
|
|
||||||
import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
|
|
||||||
import {
|
|
||||||
FormControl,
|
|
||||||
Validators,
|
|
||||||
FormsModule,
|
|
||||||
ReactiveFormsModule,
|
|
||||||
NgForm,
|
|
||||||
FormGroup,
|
|
||||||
FormBuilder,
|
|
||||||
} from '@angular/forms';
|
|
||||||
import { MatInputModule } from '@angular/material/input';
|
|
||||||
import { MatFormFieldModule } from '@angular/material/form-field';
|
|
||||||
import { merge } from 'rxjs';
|
|
||||||
import { MatIconModule } from '@angular/material/icon';
|
|
||||||
import { MatButtonModule } from '@angular/material/button';
|
|
||||||
import { CommonModule } from '@angular/common';
|
|
||||||
import { UserService } from 'src/app/services/user.service';
|
|
||||||
import { User } from 'src/app/models/user.model';
|
|
||||||
|
|
||||||
@Component({
|
|
||||||
selector: 'app-auth',
|
|
||||||
templateUrl: './login.component.html',
|
|
||||||
styleUrl: './login.component.css',
|
|
||||||
standalone: true,
|
|
||||||
imports: [
|
|
||||||
MatFormFieldModule,
|
|
||||||
MatInputModule,
|
|
||||||
FormsModule,
|
|
||||||
ReactiveFormsModule,
|
|
||||||
MatButtonModule,
|
|
||||||
MatIconModule,
|
|
||||||
CommonModule,
|
|
||||||
],
|
|
||||||
})
|
|
||||||
export class LoginComponent {
|
|
||||||
hide = true;
|
|
||||||
|
|
||||||
loginForm = this.formBuilder.group({
|
|
||||||
login: ['', Validators.required],
|
|
||||||
password: ['', Validators.required],
|
|
||||||
});
|
|
||||||
|
|
||||||
errorMessage = '';
|
|
||||||
|
|
||||||
successLogin = '';
|
|
||||||
errorLogin = '';
|
|
||||||
|
|
||||||
constructor(
|
|
||||||
private userService: UserService,
|
|
||||||
private formBuilder: FormBuilder
|
|
||||||
) {
|
|
||||||
}
|
|
||||||
|
|
||||||
loginAction() {
|
|
||||||
const formValue = this.loginForm.value;
|
|
||||||
|
|
||||||
this.userService
|
|
||||||
.loginUser(formValue.login!, formValue.password!)
|
|
||||||
.then((response) => {
|
|
||||||
console.log('response :', response);
|
|
||||||
if (response.success) {
|
|
||||||
this.successLogin = 'Vous êtes connecté.';
|
|
||||||
this.errorLogin = '';
|
|
||||||
} else {
|
|
||||||
this.errorLogin = "L'authentification a échoué.";
|
|
||||||
this.successLogin = '';
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@ -0,0 +1,36 @@
|
|||||||
|
<body>
|
||||||
|
<main>
|
||||||
|
<div>
|
||||||
|
<img class="colin" [src]="colin" alt="Photo-Colin" />
|
||||||
|
<h1>COLIN FRIZOT</h1>
|
||||||
|
<p>Bonjour, je suis Colin, un poisson développeur. (fraude)</p>
|
||||||
|
|
||||||
|
<img class="hugo" [src]="hugo" alt="Photo-Hugo" />
|
||||||
|
<h1>HUGO PRADIER</h1>
|
||||||
|
<p>
|
||||||
|
Bonjour, je suis Hugo, un développeur bientôt chauve. (suit tous les
|
||||||
|
tutos en ligne, mais ça marche jamais)
|
||||||
|
</p>
|
||||||
|
|
||||||
|
<img class="bastien" [src]="bastien" alt="Photo-Bastien" />
|
||||||
|
<h1>BASTIEN OLLIER</h1>
|
||||||
|
<p>
|
||||||
|
Bonjour, je suis Bastien, un développeur visuellement parlant, très
|
||||||
|
puant. (connaît l'adresse de la grand-mère de Colin)
|
||||||
|
</p>
|
||||||
|
|
||||||
|
<img class="clement" [src]="clement" alt="Photo-Clement" />
|
||||||
|
<h1>CLÉMENT FRÉVILLE</h1>
|
||||||
|
<p>
|
||||||
|
Bonjour, je suis Clément, un développeur meilleur que tes profs. (dieu)
|
||||||
|
</p>
|
||||||
|
|
||||||
|
<img class="matis" [src]="matis" alt="Photo-Matis" />
|
||||||
|
<h1>MATIS MAZINGUE</h1>
|
||||||
|
<p>
|
||||||
|
Bonjour, je suis Matis, un "développeur". (est là que pour l'argent,
|
||||||
|
mais il est nul)
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</main>
|
||||||
|
</body>
|
||||||
@ -0,0 +1,22 @@
|
|||||||
|
import { ComponentFixture, TestBed } from '@angular/core/testing';
|
||||||
|
|
||||||
|
import { OurStoryComponent } from './our-story.component';
|
||||||
|
|
||||||
|
describe('OurStoryComponent', () => {
|
||||||
|
let component: OurStoryComponent;
|
||||||
|
let fixture: ComponentFixture<OurStoryComponent>;
|
||||||
|
|
||||||
|
beforeEach(async () => {
|
||||||
|
await TestBed.configureTestingModule({
|
||||||
|
imports: [OurStoryComponent],
|
||||||
|
}).compileComponents();
|
||||||
|
|
||||||
|
fixture = TestBed.createComponent(OurStoryComponent);
|
||||||
|
component = fixture.componentInstance;
|
||||||
|
fixture.detectChanges();
|
||||||
|
});
|
||||||
|
|
||||||
|
it('should create', () => {
|
||||||
|
expect(component).toBeTruthy();
|
||||||
|
});
|
||||||
|
});
|
||||||
@ -0,0 +1,22 @@
|
|||||||
|
import { Component } from '@angular/core';
|
||||||
|
import { Router } from '@angular/router';
|
||||||
|
|
||||||
|
@Component({
|
||||||
|
selector: 'app-our-story',
|
||||||
|
templateUrl: './our-story.component.html',
|
||||||
|
styleUrl: './our-story.component.scss',
|
||||||
|
standalone: true,
|
||||||
|
})
|
||||||
|
export class OurStoryComponent {
|
||||||
|
constructor(private router: Router) {}
|
||||||
|
colin: string = 'assets/img/colin.png';
|
||||||
|
hugo: string = 'assets/img/hugo.png';
|
||||||
|
bastien: string = 'assets/img/bastien.png';
|
||||||
|
clement: string = 'assets/img/clement.png';
|
||||||
|
matis: string = 'assets/img/matis.png';
|
||||||
|
|
||||||
|
// Si click sur "Run", on redirige vers la page de notre histoire
|
||||||
|
onContinue(): void {
|
||||||
|
this.router.navigateByUrl('/our-story');
|
||||||
|
}
|
||||||
|
}
|
||||||
@ -1,3 +0,0 @@
|
|||||||
body {
|
|
||||||
margin: 0 150px 0 150px;
|
|
||||||
}
|
|
||||||
@ -1,18 +0,0 @@
|
|||||||
.form-container {
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
}
|
|
||||||
|
|
||||||
.form-field {
|
|
||||||
width: 100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
.success-message {
|
|
||||||
color: green;
|
|
||||||
margin-top: 20px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.error-message {
|
|
||||||
color: red;
|
|
||||||
margin-top: 20px;
|
|
||||||
}
|
|
||||||
@ -1,53 +0,0 @@
|
|||||||
<form [formGroup]="registerForm" (ngSubmit)="register()">
|
|
||||||
<h1>Formulaire d'inscription :</h1>
|
|
||||||
|
|
||||||
<mat-form-field class="form-field">
|
|
||||||
<mat-label>Enter your email</mat-label>
|
|
||||||
<input
|
|
||||||
matInput
|
|
||||||
placeholder="pat@example.com"
|
|
||||||
formControlName="email"
|
|
||||||
required />
|
|
||||||
<mat-error *ngIf="registerForm.controls.email.invalid">{{
|
|
||||||
errorMessage
|
|
||||||
}}</mat-error>
|
|
||||||
</mat-form-field>
|
|
||||||
|
|
||||||
<mat-form-field class="form-field">
|
|
||||||
<mat-label>Enter your login</mat-label>
|
|
||||||
<input matInput placeholder="pat" formControlName="login" required />
|
|
||||||
<mat-error *ngIf="registerForm.controls.login.invalid">{{
|
|
||||||
errorMessage
|
|
||||||
}}</mat-error>
|
|
||||||
</mat-form-field>
|
|
||||||
|
|
||||||
<mat-form-field class="form-field">
|
|
||||||
<mat-label>Enter your password</mat-label>
|
|
||||||
<input
|
|
||||||
matInput
|
|
||||||
[type]="hide ? 'password' : 'text'"
|
|
||||||
formControlName="password"
|
|
||||||
required />
|
|
||||||
<button
|
|
||||||
mat-icon-button
|
|
||||||
matSuffix
|
|
||||||
(click)="hide = !hide"
|
|
||||||
[attr.aria-label]="'Hide password'"
|
|
||||||
[attr.aria-pressed]="hide">
|
|
||||||
<mat-icon>{{ hide ? 'visibility_off' : 'visibility' }}</mat-icon>
|
|
||||||
</button>
|
|
||||||
<mat-error *ngIf="registerForm.controls.password.invalid">{{
|
|
||||||
errorMessage
|
|
||||||
}}</mat-error>
|
|
||||||
</mat-form-field>
|
|
||||||
|
|
||||||
<button mat-flat-button color="primary" type="submit">Créer un compte</button>
|
|
||||||
|
|
||||||
<!-- Message de retour de l'inscription -->
|
|
||||||
<div *ngIf="successRegister" class="success-message">
|
|
||||||
{{ successRegister }}
|
|
||||||
</div>
|
|
||||||
<div *ngIf="errorRegister" class="error-message">
|
|
||||||
{{ errorRegister }}
|
|
||||||
</div>
|
|
||||||
</form>
|
|
||||||
@ -1,75 +0,0 @@
|
|||||||
import { Component } from '@angular/core';
|
|
||||||
import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
|
|
||||||
import {
|
|
||||||
FormControl,
|
|
||||||
Validators,
|
|
||||||
FormsModule,
|
|
||||||
ReactiveFormsModule,
|
|
||||||
NgForm,
|
|
||||||
FormBuilder,
|
|
||||||
} from '@angular/forms';
|
|
||||||
import { MatInputModule } from '@angular/material/input';
|
|
||||||
import { MatFormFieldModule } from '@angular/material/form-field';
|
|
||||||
import { merge } from 'rxjs';
|
|
||||||
import { MatIconModule } from '@angular/material/icon';
|
|
||||||
import { MatButtonModule } from '@angular/material/button';
|
|
||||||
import { CommonModule } from '@angular/common';
|
|
||||||
import { UserService } from 'src/app/services/user.service';
|
|
||||||
import { User } from 'src/app/models/user.model';
|
|
||||||
|
|
||||||
@Component({
|
|
||||||
selector: 'app-auth',
|
|
||||||
templateUrl: './register.component.html',
|
|
||||||
styleUrl: './register.component.css',
|
|
||||||
standalone: true,
|
|
||||||
imports: [
|
|
||||||
MatFormFieldModule,
|
|
||||||
MatInputModule,
|
|
||||||
FormsModule,
|
|
||||||
ReactiveFormsModule,
|
|
||||||
MatButtonModule,
|
|
||||||
MatIconModule,
|
|
||||||
CommonModule,
|
|
||||||
],
|
|
||||||
})
|
|
||||||
export class RegisterComponent {
|
|
||||||
hide = true;
|
|
||||||
|
|
||||||
registerForm = this.formBuilder.group({
|
|
||||||
email: ['', Validators.required],
|
|
||||||
login: ['', Validators.required],
|
|
||||||
password: ['', Validators.required],
|
|
||||||
});
|
|
||||||
errorMessage = '';
|
|
||||||
|
|
||||||
successRegister = '';
|
|
||||||
errorRegister = '';
|
|
||||||
|
|
||||||
constructor(
|
|
||||||
private userService: UserService,
|
|
||||||
private formBuilder: FormBuilder
|
|
||||||
) {
|
|
||||||
}
|
|
||||||
|
|
||||||
register() {
|
|
||||||
const formRegisterValue = this.registerForm.value;
|
|
||||||
|
|
||||||
this.userService
|
|
||||||
.postUser(
|
|
||||||
formRegisterValue.email!,
|
|
||||||
formRegisterValue.login!,
|
|
||||||
formRegisterValue.password!
|
|
||||||
)
|
|
||||||
.subscribe((response) => {
|
|
||||||
console.log('response :', response);
|
|
||||||
if (response.success) {
|
|
||||||
this.successRegister = 'Votre compte a été créé avec succès.';
|
|
||||||
this.errorRegister = '';
|
|
||||||
} else {
|
|
||||||
this.errorRegister =
|
|
||||||
"L'inscription a échoué : un compte avec ce login existe déjà.";
|
|
||||||
this.successRegister = '';
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@ -1,3 +0,0 @@
|
|||||||
body {
|
|
||||||
margin: 0 150px 0 150px;
|
|
||||||
}
|
|
||||||
@ -1,9 +0,0 @@
|
|||||||
<div class="work-list-detail">
|
|
||||||
<h4 class="work-list-detail--title">{{ work?.title }}</h4>
|
|
||||||
<span class="work-list-detail--content">{{
|
|
||||||
work?.content | slice: 0 : 50
|
|
||||||
}}</span>
|
|
||||||
<button class="work-list-detail--btn" [routerLink]="['/work/', work?.link]">
|
|
||||||
Edit Code
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
@ -1,26 +0,0 @@
|
|||||||
.work-list-detail {
|
|
||||||
background: lightgray;
|
|
||||||
width: fit-content;
|
|
||||||
padding: 2rem;
|
|
||||||
border-radius: 1rem;
|
|
||||||
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
gap: 1rem;
|
|
||||||
|
|
||||||
&--title {
|
|
||||||
margin: 0;
|
|
||||||
font-size: 1.5rem;
|
|
||||||
font-weight: bold;
|
|
||||||
}
|
|
||||||
|
|
||||||
&--content {
|
|
||||||
}
|
|
||||||
|
|
||||||
&--btn {
|
|
||||||
width: fit-content;
|
|
||||||
padding: 0.5rem 1rem;
|
|
||||||
border: 1px solid black;
|
|
||||||
border-radius: 0.5rem;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@ -1,23 +0,0 @@
|
|||||||
import { ComponentFixture, TestBed } from '@angular/core/testing';
|
|
||||||
import { WorkListDetailComponent } from './work-list-detail.component';
|
|
||||||
import { HttpClientModule } from '@angular/common/http';
|
|
||||||
import { RouterModule } from '@angular/router';
|
|
||||||
|
|
||||||
describe('WorkListDetailComponent', () => {
|
|
||||||
let component: WorkListDetailComponent;
|
|
||||||
let fixture: ComponentFixture<WorkListDetailComponent>;
|
|
||||||
|
|
||||||
beforeEach(async () => {
|
|
||||||
await TestBed.configureTestingModule({
|
|
||||||
imports: [WorkListDetailComponent, HttpClientModule, RouterModule.forRoot([])],
|
|
||||||
}).compileComponents();
|
|
||||||
|
|
||||||
fixture = TestBed.createComponent(WorkListDetailComponent);
|
|
||||||
component = fixture.componentInstance;
|
|
||||||
fixture.detectChanges();
|
|
||||||
});
|
|
||||||
|
|
||||||
it('should create', () => {
|
|
||||||
expect(component).toBeTruthy();
|
|
||||||
});
|
|
||||||
});
|
|
||||||
@ -1,15 +0,0 @@
|
|||||||
import { Component, Input } from '@angular/core';
|
|
||||||
import { Work } from '../../models/work.model';
|
|
||||||
import { RouterLink } from '@angular/router';
|
|
||||||
import { SlicePipe } from '@angular/common';
|
|
||||||
|
|
||||||
@Component({
|
|
||||||
selector: 'app-work-list-detail',
|
|
||||||
standalone: true,
|
|
||||||
imports: [RouterLink, SlicePipe],
|
|
||||||
templateUrl: './work-list-detail.component.html',
|
|
||||||
styleUrl: './work-list-detail.component.scss',
|
|
||||||
})
|
|
||||||
export class WorkListDetailComponent {
|
|
||||||
@Input() work?: Work;
|
|
||||||
}
|
|
||||||
@ -1,15 +0,0 @@
|
|||||||
<div style="margin-left: 30px">
|
|
||||||
<h2>Works</h2>
|
|
||||||
|
|
||||||
<h3>Last Work</h3>
|
|
||||||
<div *ngFor="let work of works | slice: -1">
|
|
||||||
<app-work-list-detail [work]="work"></app-work-list-detail>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<h3>All Works</h3>
|
|
||||||
<div class="all-works">
|
|
||||||
<div *ngFor="let work of works">
|
|
||||||
<app-work-list-detail [work]="work"></app-work-list-detail>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
@ -1,5 +0,0 @@
|
|||||||
.all-works {
|
|
||||||
display: flex;
|
|
||||||
flex-wrap: wrap;
|
|
||||||
gap: 2rem;
|
|
||||||
}
|
|
||||||
@ -1,24 +0,0 @@
|
|||||||
import { ComponentFixture, TestBed } from '@angular/core/testing';
|
|
||||||
|
|
||||||
import { WorksListComponent } from './works-list.component';
|
|
||||||
import { RouterModule } from '@angular/router';
|
|
||||||
import { HttpClientModule } from '@angular/common/http';
|
|
||||||
|
|
||||||
describe('WorksListComponent', () => {
|
|
||||||
let component: WorksListComponent;
|
|
||||||
let fixture: ComponentFixture<WorksListComponent>;
|
|
||||||
|
|
||||||
beforeEach(async () => {
|
|
||||||
await TestBed.configureTestingModule({
|
|
||||||
imports: [WorksListComponent, HttpClientModule, RouterModule.forRoot([])],
|
|
||||||
}).compileComponents();
|
|
||||||
|
|
||||||
fixture = TestBed.createComponent(WorksListComponent);
|
|
||||||
component = fixture.componentInstance;
|
|
||||||
fixture.detectChanges();
|
|
||||||
});
|
|
||||||
|
|
||||||
it('should create', () => {
|
|
||||||
expect(component).toBeTruthy();
|
|
||||||
});
|
|
||||||
});
|
|
||||||
@ -1,36 +0,0 @@
|
|||||||
import { Component, OnInit } from '@angular/core';
|
|
||||||
import { Work } from '../../models/work.model';
|
|
||||||
import { WorkService } from '../../services/work.service';
|
|
||||||
import { NgForOf, SlicePipe } from '@angular/common';
|
|
||||||
import { FormsModule, NgForm } from '@angular/forms';
|
|
||||||
import { WorkListDetailComponent } from '../work-list-detail/work-list-detail.component';
|
|
||||||
|
|
||||||
@Component({
|
|
||||||
selector: 'app-works-list',
|
|
||||||
standalone: true,
|
|
||||||
imports: [NgForOf, FormsModule, SlicePipe, WorkListDetailComponent],
|
|
||||||
templateUrl: './works-list.component.html',
|
|
||||||
styleUrl: './works-list.component.scss',
|
|
||||||
})
|
|
||||||
export class WorksListComponent implements OnInit {
|
|
||||||
works: Work[] = [];
|
|
||||||
|
|
||||||
// TODO - REMOVE WHEN USER MANAGEMENT DONE
|
|
||||||
FAKE_USER_ID = 1;
|
|
||||||
|
|
||||||
constructor(protected workService: WorkService) {}
|
|
||||||
|
|
||||||
ngOnInit() {
|
|
||||||
this.workService.getWorks().then((works: Work[]) => {
|
|
||||||
works.map((work: Work) => {
|
|
||||||
if (work.user_id === this.FAKE_USER_ID) {
|
|
||||||
this.works.push(work);
|
|
||||||
}
|
|
||||||
});
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
onSubmit(form: NgForm) {
|
|
||||||
this.workService.saveWork(form);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@ -1,6 +0,0 @@
|
|||||||
export interface User {
|
|
||||||
id_user: number;
|
|
||||||
login: string;
|
|
||||||
password: string;
|
|
||||||
permissions: number;
|
|
||||||
}
|
|
||||||
@ -1,8 +0,0 @@
|
|||||||
export interface Work {
|
|
||||||
id_work: number;
|
|
||||||
link: string;
|
|
||||||
user_id: number;
|
|
||||||
language: string;
|
|
||||||
title: string;
|
|
||||||
content: string;
|
|
||||||
}
|
|
||||||
@ -1,52 +0,0 @@
|
|||||||
import { Injectable } from '@angular/core';
|
|
||||||
import { HttpClient } from '@angular/common/http';
|
|
||||||
import { Observable } from 'rxjs';
|
|
||||||
import { environment } from '../../environments/environment';
|
|
||||||
|
|
||||||
@Injectable({
|
|
||||||
providedIn: 'root',
|
|
||||||
})
|
|
||||||
export class UserService {
|
|
||||||
constructor(private http: HttpClient) {}
|
|
||||||
|
|
||||||
postUser(
|
|
||||||
email: string,
|
|
||||||
login: string,
|
|
||||||
password: string
|
|
||||||
): Observable<Response> {
|
|
||||||
const body = {
|
|
||||||
email: email,
|
|
||||||
login: login,
|
|
||||||
password: password,
|
|
||||||
permissions: 0,
|
|
||||||
};
|
|
||||||
|
|
||||||
return this.http.post<Response>(`${environment.apiUrl}/users`, body);
|
|
||||||
}
|
|
||||||
|
|
||||||
loginUser(login: string, password: string): Promise<Response> {
|
|
||||||
const body = {
|
|
||||||
login: login,
|
|
||||||
password: password,
|
|
||||||
};
|
|
||||||
|
|
||||||
return fetch(`${environment.apiUrl}/users/login`, {
|
|
||||||
method: 'POST',
|
|
||||||
headers: {
|
|
||||||
'Content-Type': 'application/json',
|
|
||||||
},
|
|
||||||
body: JSON.stringify(body),
|
|
||||||
credentials: 'include',
|
|
||||||
}).then((response) => response.json());
|
|
||||||
}
|
|
||||||
|
|
||||||
logoutUser(): Observable<Response> {
|
|
||||||
return this.http.post<Response>(`${environment.apiUrl}/users/logout`, {
|
|
||||||
withCredentials: true,
|
|
||||||
});
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
type Response = {
|
|
||||||
success: boolean;
|
|
||||||
};
|
|
||||||
@ -1,19 +0,0 @@
|
|||||||
import { TestBed } from '@angular/core/testing';
|
|
||||||
|
|
||||||
import { WorkService } from './work.service';
|
|
||||||
import { HttpClientModule } from '@angular/common/http';
|
|
||||||
|
|
||||||
describe('WorkService', () => {
|
|
||||||
let service: WorkService;
|
|
||||||
|
|
||||||
beforeEach(() => {
|
|
||||||
TestBed.configureTestingModule({
|
|
||||||
imports: [HttpClientModule]
|
|
||||||
});
|
|
||||||
service = TestBed.inject(WorkService);
|
|
||||||
});
|
|
||||||
|
|
||||||
it('should be created', () => {
|
|
||||||
expect(service).toBeTruthy();
|
|
||||||
});
|
|
||||||
});
|
|
||||||
@ -1,48 +0,0 @@
|
|||||||
import { Injectable } from '@angular/core';
|
|
||||||
import { Work } from '../models/work.model';
|
|
||||||
import { HttpClient } from '@angular/common/http';
|
|
||||||
import { map, Observable } from 'rxjs';
|
|
||||||
import { NgForm } from '@angular/forms';
|
|
||||||
import { environment } from '../../environments/environment';
|
|
||||||
|
|
||||||
@Injectable({
|
|
||||||
providedIn: 'root',
|
|
||||||
})
|
|
||||||
export class WorkService {
|
|
||||||
constructor(private http: HttpClient) {}
|
|
||||||
|
|
||||||
getWorks(): Promise<Work[]> {
|
|
||||||
return fetch(`${environment.apiUrl}/works`, {
|
|
||||||
method: 'GET',
|
|
||||||
credentials: 'include',
|
|
||||||
}).then((response) => response.json());
|
|
||||||
}
|
|
||||||
|
|
||||||
getWorkByLink(link: string): Observable<Work | null> {
|
|
||||||
return this.http.get<Work>(`${environment.apiUrl}/works/${link}`);
|
|
||||||
}
|
|
||||||
|
|
||||||
saveWork(form: NgForm): void {
|
|
||||||
const code = form.value.content;
|
|
||||||
|
|
||||||
this.http.post(`${environment.apiUrl}/works/save`, code, { withCredentials: true });
|
|
||||||
}
|
|
||||||
|
|
||||||
postWork(code: string, language: string): Observable<string> {
|
|
||||||
const body = {
|
|
||||||
language,
|
|
||||||
title: `Basic ${language}`,
|
|
||||||
code,
|
|
||||||
};
|
|
||||||
|
|
||||||
return this.http.post<Work>(`${environment.apiUrl}/works`, body).pipe(map((work) => work.link));
|
|
||||||
}
|
|
||||||
|
|
||||||
updateWork(id: string, code: string, language: string): void {
|
|
||||||
const body = {
|
|
||||||
newContent: code,
|
|
||||||
language: language,
|
|
||||||
};
|
|
||||||
this.http.put(`${environment.apiUrl}/works/${id}/content`, body, { withCredentials: true });
|
|
||||||
}
|
|
||||||
}
|
|
||||||
Loading…
Reference in new issue