Compare commits
12 Commits
c7ece75e7a
...
3326b7c589
Author | SHA1 | Date | |
---|---|---|---|
3326b7c589 | |||
e20231639c | |||
a0e8506027 | |||
26abb6163f | |||
e7fc6e0802 | |||
8ac848e8f1 | |||
0bfdded52f | |||
03286c2013 | |||
cc337d22f2 | |||
bde574ccad | |||
6ac9a2f1ec | |||
6b010f66ba |
21
backend/nestjs-seshat-api/assets/config/config.json
Normal file
21
backend/nestjs-seshat-api/assets/config/config.json
Normal file
@ -0,0 +1,21 @@
|
||||
{
|
||||
"features": {
|
||||
"registration": false
|
||||
},
|
||||
"providers": {
|
||||
"default": "google",
|
||||
"google": {
|
||||
"name": "Google",
|
||||
"filters": {},
|
||||
"languages": {
|
||||
"zh": "Chinese",
|
||||
"nl": "Dutch",
|
||||
"en": "English",
|
||||
"fr": "Francais",
|
||||
"ko": "Korean",
|
||||
"ja": "Japanese",
|
||||
"es": "Spanish"
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
@ -17,6 +17,7 @@ import { ProvidersModule } from './providers/providers.module';
|
||||
import { SeriesModule } from './series/series.module';
|
||||
import { LibraryModule } from './library/library.module';
|
||||
import { BullModule } from '@nestjs/bullmq';
|
||||
import { AssetModule } from './asset/asset.module';
|
||||
|
||||
@Module({
|
||||
imports: [
|
||||
@ -74,7 +75,9 @@ import { BullModule } from '@nestjs/bullmq';
|
||||
BooksModule,
|
||||
ProvidersModule,
|
||||
SeriesModule,
|
||||
LibraryModule
|
||||
LibraryModule,
|
||||
ConfigModule,
|
||||
AssetModule,
|
||||
],
|
||||
controllers: [AppController],
|
||||
providers: [AppService, UsersService],
|
||||
|
7
backend/nestjs-seshat-api/src/asset/asset.module.ts
Normal file
7
backend/nestjs-seshat-api/src/asset/asset.module.ts
Normal file
@ -0,0 +1,7 @@
|
||||
import { Module } from '@nestjs/common';
|
||||
import { ConfigController } from './config/config.controller';
|
||||
|
||||
@Module({
|
||||
controllers: [ConfigController]
|
||||
})
|
||||
export class AssetModule {}
|
7
backend/nestjs-seshat-api/src/asset/config/app-config.ts
Normal file
7
backend/nestjs-seshat-api/src/asset/config/app-config.ts
Normal file
@ -0,0 +1,7 @@
|
||||
import * as fs from 'fs';
|
||||
import * as path from 'path';
|
||||
|
||||
const file_path = path.join(process.cwd(), './assets/config/config.json');
|
||||
const file_content = fs.readFileSync(file_path).toString();
|
||||
|
||||
export const AppConfig = JSON.parse(file_content);
|
@ -0,0 +1,18 @@
|
||||
import { Test, TestingModule } from '@nestjs/testing';
|
||||
import { ConfigController } from './config.controller';
|
||||
|
||||
describe('ConfigController', () => {
|
||||
let controller: ConfigController;
|
||||
|
||||
beforeEach(async () => {
|
||||
const module: TestingModule = await Test.createTestingModule({
|
||||
controllers: [ConfigController],
|
||||
}).compile();
|
||||
|
||||
controller = module.get<ConfigController>(ConfigController);
|
||||
});
|
||||
|
||||
it('should be defined', () => {
|
||||
expect(controller).toBeDefined();
|
||||
});
|
||||
});
|
@ -0,0 +1,15 @@
|
||||
import { Controller, Request, Get } from '@nestjs/common';
|
||||
import { AppConfig } from './app-config';
|
||||
|
||||
@Controller('asset')
|
||||
export class ConfigController {
|
||||
@Get('config')
|
||||
async config(
|
||||
@Request() req,
|
||||
) {
|
||||
return {
|
||||
success: true,
|
||||
config: AppConfig
|
||||
};
|
||||
}
|
||||
}
|
@ -4,6 +4,7 @@ import { JwtService } from '@nestjs/jwt';
|
||||
import { UserEntity } from 'src/users/entities/users.entity';
|
||||
import { ConfigService } from '@nestjs/config';
|
||||
import { PinoLogger } from 'nestjs-pino';
|
||||
import { AccessTokenDto } from './dto/access-token.dto';
|
||||
|
||||
@Injectable()
|
||||
export class AuthAccessService {
|
||||
@ -13,7 +14,7 @@ export class AuthAccessService {
|
||||
private logger: PinoLogger,
|
||||
) { }
|
||||
|
||||
async generate(user: UserEntity) {
|
||||
async generate(user: UserEntity): Promise<AccessTokenDto> {
|
||||
const now = new Date();
|
||||
const limit = parseInt(this.config.getOrThrow<string>('AUTH_JWT_ACCESS_TOKEN_EXPIRATION_MS'));
|
||||
const expiration = moment(now).add(limit, 'ms').toDate();
|
||||
@ -45,4 +46,12 @@ export class AuthAccessService {
|
||||
exp: expiration.getTime(),
|
||||
}
|
||||
}
|
||||
|
||||
async verify(token: string) {
|
||||
return await this.jwts.verifyAsync(token,
|
||||
{
|
||||
secret: this.config.getOrThrow<string>('AUTH_JWT_ACCESS_TOKEN_SECRET')
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
|
@ -1,5 +1,4 @@
|
||||
import { Controller, Request, Post, UseGuards, Body, Res, Delete, Patch } from '@nestjs/common';
|
||||
import { LoginAuthGuard } from './guards/login-auth.guard';
|
||||
import { Controller, Request, Post, UseGuards, Body, Res, Delete, Patch, UnauthorizedException } from '@nestjs/common';
|
||||
import { AuthService } from './auth.service';
|
||||
import { UsersService } from 'src/users/users.service';
|
||||
import { RegisterUserDto } from './dto/register-user.dto';
|
||||
@ -9,7 +8,10 @@ import { OfflineGuard } from './guards/offline.guard';
|
||||
import { UserEntity } from 'src/users/entities/users.entity';
|
||||
import { QueryFailedError } from 'typeorm';
|
||||
import { PinoLogger } from 'nestjs-pino';
|
||||
import { JwtAccessGuard } from './guards/jwt-access.guard';
|
||||
import { LoginDto } from './dto/login.dto';
|
||||
import { AuthenticationDto } from './dto/authentication.dto';
|
||||
import { AppConfig } from 'src/asset/config/app-config';
|
||||
import { JwtMixedGuard } from './guards/jwt-mixed.guard';
|
||||
|
||||
@Controller('auth')
|
||||
export class AuthController {
|
||||
@ -19,16 +21,17 @@ export class AuthController {
|
||||
private logger: PinoLogger,
|
||||
) { }
|
||||
|
||||
@UseGuards(LoginAuthGuard)
|
||||
@UseGuards(OfflineGuard)
|
||||
@Post('login')
|
||||
async login(
|
||||
@Request() req,
|
||||
@Res({ passthrough: true }) response: Response,
|
||||
@Body() body: LoginDto,
|
||||
) {
|
||||
let data: AuthenticationDto | null;
|
||||
try {
|
||||
data = await this.auth.login(req.user);
|
||||
if (!data.access_token || !data.refresh_token || !data.refresh_exp) {
|
||||
data = await this.auth.login(body);
|
||||
if (!data.access_token || body.remember_me && (!data.refresh_token || !data.refresh_exp)) {
|
||||
response.statusCode = 500;
|
||||
return {
|
||||
success: false,
|
||||
@ -44,6 +47,14 @@ export class AuthController {
|
||||
error: err,
|
||||
});
|
||||
|
||||
if (err instanceof UnauthorizedException) {
|
||||
response.statusCode = 401;
|
||||
return {
|
||||
success: false,
|
||||
error_message: 'Invalid credentials.',
|
||||
};
|
||||
}
|
||||
|
||||
response.statusCode = 500;
|
||||
return {
|
||||
success: false,
|
||||
@ -58,12 +69,14 @@ export class AuthController {
|
||||
sameSite: 'strict',
|
||||
});
|
||||
|
||||
if (body.remember_me) {
|
||||
response.cookie('Refresh', data.refresh_token, {
|
||||
httpOnly: true,
|
||||
secure: true,
|
||||
expires: new Date(data.refresh_exp),
|
||||
sameSite: 'strict',
|
||||
});
|
||||
}
|
||||
|
||||
this.logger.info({
|
||||
class: AuthController.name,
|
||||
@ -71,6 +84,7 @@ export class AuthController {
|
||||
user: req.user,
|
||||
access_token: data.access_token,
|
||||
refresh_token: data.refresh_token,
|
||||
remember_me: body.remember_me,
|
||||
msg: 'User logged in.',
|
||||
});
|
||||
|
||||
@ -79,7 +93,7 @@ export class AuthController {
|
||||
};
|
||||
}
|
||||
|
||||
@UseGuards(JwtAccessGuard)
|
||||
@UseGuards(JwtMixedGuard)
|
||||
@Delete('login')
|
||||
async logout(
|
||||
@Request() req,
|
||||
@ -91,19 +105,19 @@ export class AuthController {
|
||||
response.clearCookie('Authentication');
|
||||
response.clearCookie('Refresh');
|
||||
|
||||
if (!refreshToken || !await this.auth.revoke(req.user.userId, refreshToken)) {
|
||||
if (!accessToken && !refreshToken && !await this.auth.revoke(req.user.userId, refreshToken)) {
|
||||
// User has already logged off.
|
||||
this.logger.info({
|
||||
class: AuthController.name,
|
||||
method: this.login.name,
|
||||
method: this.logout.name,
|
||||
user: req.user,
|
||||
msg: 'User has already logged off via ' + (!refreshToken ? 'cookies' : 'database'),
|
||||
msg: 'User has already logged off based on ' + (!refreshToken ? 'cookies' : 'database'),
|
||||
});
|
||||
|
||||
response.statusCode = 400;
|
||||
return {
|
||||
success: false,
|
||||
error_message: 'User has already logged off.'
|
||||
error_message: 'User has already logged off.',
|
||||
};
|
||||
}
|
||||
|
||||
@ -127,14 +141,31 @@ export class AuthController {
|
||||
) {
|
||||
this.logger.info({
|
||||
class: AuthController.name,
|
||||
method: this.login.name,
|
||||
method: this.refresh.name,
|
||||
user: req.user,
|
||||
refresh_token: req.cookies.Refresh,
|
||||
msg: 'User logged in.',
|
||||
msg: 'Attempting to renew access token.',
|
||||
});
|
||||
|
||||
const refreshToken = req.cookies.Refresh;
|
||||
const data = await this.auth.renew(req.user, refreshToken);
|
||||
const results = await this.auth.verify(req.cookies.Authentication, req.cookies.Refresh);
|
||||
|
||||
if (results.validation === false) {
|
||||
this.logger.info({
|
||||
class: AuthController.name,
|
||||
method: this.refresh.name,
|
||||
user: req.user,
|
||||
refresh_token: req.cookies.Refresh,
|
||||
msg: 'Refresh token is invalid. Access token is not refreshing.',
|
||||
});
|
||||
|
||||
response.statusCode = 400;
|
||||
return {
|
||||
success: false,
|
||||
error_message: 'Refresh token is invalid.',
|
||||
};
|
||||
}
|
||||
|
||||
const data = await this.auth.renew(req.user);
|
||||
|
||||
response.cookie('Authentication', data.access_token, {
|
||||
httpOnly: true,
|
||||
@ -150,22 +181,6 @@ export class AuthController {
|
||||
msg: 'Updated Authentication cookie for access token.',
|
||||
});
|
||||
|
||||
if (data.refresh_token != refreshToken) {
|
||||
response.cookie('Refresh', data.refresh_token, {
|
||||
httpOnly: true,
|
||||
secure: true,
|
||||
expires: new Date(data.refresh_exp),
|
||||
sameSite: 'strict',
|
||||
});
|
||||
this.logger.debug({
|
||||
class: AuthController.name,
|
||||
method: this.refresh.name,
|
||||
user: req.user,
|
||||
refresh_token: data.refresh_token,
|
||||
msg: 'Updated Refresh cookie for refresh token.',
|
||||
});
|
||||
}
|
||||
|
||||
return { success: true };
|
||||
}
|
||||
|
||||
@ -176,6 +191,14 @@ export class AuthController {
|
||||
@Res({ passthrough: true }) response: Response,
|
||||
@Body() body: RegisterUserDto,
|
||||
) {
|
||||
if (!AppConfig.features.registration) {
|
||||
response.statusCode = 404;
|
||||
return {
|
||||
success: false,
|
||||
error_message: 'Registration disabled.',
|
||||
};
|
||||
}
|
||||
|
||||
let user: UserEntity | null;
|
||||
let data: AuthenticationDto | null;
|
||||
try {
|
||||
@ -220,8 +243,12 @@ export class AuthController {
|
||||
}
|
||||
|
||||
try {
|
||||
data = await this.auth.login(user);
|
||||
if (!data.access_token || !data.refresh_token || !data.refresh_exp) {
|
||||
data = await this.auth.login({
|
||||
user_login: body.user_login,
|
||||
password: body.password,
|
||||
remember_me: false,
|
||||
});
|
||||
if (!data.access_token) {
|
||||
this.logger.error({
|
||||
class: AuthController.name,
|
||||
method: this.register.name,
|
||||
@ -246,6 +273,15 @@ export class AuthController {
|
||||
error: err,
|
||||
});
|
||||
|
||||
// This should never happen...
|
||||
if (err instanceof UnauthorizedException) {
|
||||
response.statusCode = 401;
|
||||
return {
|
||||
success: false,
|
||||
error_message: 'Invalid credentials.',
|
||||
};
|
||||
}
|
||||
|
||||
response.statusCode = 500;
|
||||
return {
|
||||
success: false,
|
||||
@ -260,15 +296,31 @@ export class AuthController {
|
||||
sameSite: 'strict',
|
||||
});
|
||||
|
||||
response.cookie('Refresh', data.refresh_token, {
|
||||
httpOnly: true,
|
||||
secure: true,
|
||||
expires: new Date(data.refresh_exp),
|
||||
sameSite: 'strict',
|
||||
});
|
||||
|
||||
return {
|
||||
success: true,
|
||||
};
|
||||
}
|
||||
|
||||
@Post('validate')
|
||||
async validate(
|
||||
@Request() req,
|
||||
@Res({ passthrough: true }) response: Response,
|
||||
) {
|
||||
try {
|
||||
const accessToken = req.cookies['Authentication'];
|
||||
const refreshToken = req.cookies['Refresh'];
|
||||
const verification = await this.auth.verify(accessToken, refreshToken);
|
||||
|
||||
return {
|
||||
success: true,
|
||||
...verification,
|
||||
};
|
||||
} catch (err) {
|
||||
response.statusCode = 500;
|
||||
return {
|
||||
success: false,
|
||||
error_message: err,
|
||||
};
|
||||
}
|
||||
}
|
||||
}
|
@ -2,12 +2,11 @@ import { Module } from '@nestjs/common';
|
||||
import { AuthService } from './auth.service';
|
||||
import { UsersModule } from 'src/users/users.module';
|
||||
import { PassportModule } from '@nestjs/passport';
|
||||
import { LoginStrategy } from './strategies/login.strategy';
|
||||
import { AuthController } from './auth.controller';
|
||||
import { ConfigModule, ConfigService } from '@nestjs/config';
|
||||
import { JwtModule } from '@nestjs/jwt';
|
||||
import { JwtOptions } from './jwt.options';
|
||||
import { JwtStrategy } from './strategies/jwt.strategy';
|
||||
import { JwtAccessStrategy } from './strategies/jwt-access.strategy';
|
||||
import { AuthRefreshService } from './auth.refresh.service';
|
||||
import { TypeOrmModule } from '@nestjs/typeorm';
|
||||
import { AuthRefreshTokenEntity } from './entities/auth.refresh-token.entity';
|
||||
@ -35,9 +34,8 @@ import { JwtRefreshStrategy } from './strategies/jwt-refresh.strategy';
|
||||
AuthAccessService,
|
||||
AuthRefreshService,
|
||||
AuthService,
|
||||
JwtStrategy,
|
||||
JwtAccessStrategy,
|
||||
JwtRefreshStrategy,
|
||||
LoginStrategy,
|
||||
],
|
||||
controllers: [AuthController]
|
||||
})
|
||||
|
@ -1,6 +1,6 @@
|
||||
import * as crypto from 'crypto';
|
||||
import * as moment from "moment";
|
||||
import { Injectable, UnauthorizedException } from '@nestjs/common';
|
||||
import { Injectable } from '@nestjs/common';
|
||||
import { ConfigService } from '@nestjs/config';
|
||||
import { JwtService } from '@nestjs/jwt';
|
||||
import { InjectRepository } from '@nestjs/typeorm';
|
||||
@ -20,59 +20,11 @@ export class AuthRefreshService {
|
||||
private logger: PinoLogger,
|
||||
) { }
|
||||
|
||||
async generate(user: UserEntity, refreshToken?: string) {
|
||||
let expiration: Date | null = null;
|
||||
if (refreshToken) {
|
||||
const token = await this.get(refreshToken, user.userId);
|
||||
if (!token) {
|
||||
this.logger.warn({
|
||||
class: AuthRefreshService.name,
|
||||
method: this.generate.name,
|
||||
user,
|
||||
refresh_token: refreshToken,
|
||||
msg: 'Refresh token given is invalid.',
|
||||
});
|
||||
throw new UnauthorizedException('Invalid refresh token.');
|
||||
}
|
||||
if (token.exp.getTime() < new Date().getTime()) {
|
||||
this.logger.warn({
|
||||
class: AuthRefreshService.name,
|
||||
method: this.generate.name,
|
||||
user,
|
||||
refresh_token: refreshToken,
|
||||
exp: expiration,
|
||||
msg: 'Refresh token given has expired.',
|
||||
});
|
||||
throw new UnauthorizedException('Invalid refresh token.');
|
||||
}
|
||||
|
||||
expiration = token.exp;
|
||||
}
|
||||
|
||||
// Generate new refresh token if either:
|
||||
// - no previous token exists;
|
||||
// - token has reached expiration threshold;
|
||||
// - token has expired.
|
||||
async generate(user: UserEntity) {
|
||||
const now = new Date();
|
||||
const expirationTime = parseInt(this.config.getOrThrow<string>('AUTH_JWT_REFRESH_TOKEN_EXPIRATION_MS'));
|
||||
const threshhold = parseInt(this.config.getOrThrow<string>('AUTH_JWT_REFRESH_TOKEN_EXPIRATION_THRESHHOLD_MS'));
|
||||
if (!refreshToken || expirationTime - (expiration.getTime() - now.getTime()) > threshhold) {
|
||||
let deletionTask = null;
|
||||
if (refreshToken) {
|
||||
deletionTask = this.revoke(user.userId, refreshToken);
|
||||
|
||||
this.logger.debug({
|
||||
class: AuthRefreshService.name,
|
||||
method: this.generate.name,
|
||||
user,
|
||||
refresh_token: refreshToken,
|
||||
exp: expiration,
|
||||
msg: 'Deleted previous refresh token.',
|
||||
});
|
||||
}
|
||||
|
||||
expiration = moment(now).add(expirationTime, 'ms').toDate();
|
||||
refreshToken = await this.jwts.signAsync(
|
||||
const expiration = moment(now).add(expirationTime, 'ms').toDate();
|
||||
const refreshToken = await this.jwts.signAsync(
|
||||
{
|
||||
username: user.userLogin,
|
||||
sub: user.userId,
|
||||
@ -109,9 +61,6 @@ export class AuthRefreshService {
|
||||
msg: 'Inserted the new refresh token into the database.',
|
||||
});
|
||||
|
||||
await deletionTask;
|
||||
}
|
||||
|
||||
return {
|
||||
refresh_token: refreshToken,
|
||||
exp: expiration.getTime(),
|
||||
@ -155,4 +104,14 @@ export class AuthRefreshService {
|
||||
const refresh = await this.get(refreshToken, userId);
|
||||
return refresh && refresh.exp.getTime() > new Date().getTime();
|
||||
}
|
||||
|
||||
async verify(
|
||||
refreshToken: string
|
||||
): Promise<any> {
|
||||
return await this.jwts.verifyAsync(refreshToken,
|
||||
{
|
||||
secret: this.config.getOrThrow<string>('AUTH_JWT_REFRESH_TOKEN_SECRET'),
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
|
@ -1,9 +1,13 @@
|
||||
import { Injectable } from '@nestjs/common';
|
||||
import { Injectable, UnauthorizedException } from '@nestjs/common';
|
||||
import { UserEntity } from 'src/users/entities/users.entity';
|
||||
import { UsersService } from 'src/users/users.service';
|
||||
import { AuthRefreshService } from './auth.refresh.service';
|
||||
import { AuthAccessService } from './auth.access.service';
|
||||
import { UUID } from 'crypto';
|
||||
import { AuthenticationDto } from './dto/authentication.dto';
|
||||
import { LoginDto } from './dto/login.dto';
|
||||
import { AccessTokenDto } from './dto/access-token.dto';
|
||||
import { TokenExpiredError } from '@nestjs/jwt';
|
||||
|
||||
@Injectable()
|
||||
export class AuthService {
|
||||
@ -14,33 +18,127 @@ export class AuthService {
|
||||
) { }
|
||||
|
||||
|
||||
async login(user: UserEntity): Promise<AuthenticationDto> {
|
||||
return this.renew(user, null);
|
||||
async login(
|
||||
loginDetails: LoginDto
|
||||
): Promise<AuthenticationDto> {
|
||||
const user = await this.users.findOne(loginDetails);
|
||||
if (!user) {
|
||||
throw new UnauthorizedException();
|
||||
}
|
||||
|
||||
const access_token = await this.accessTokens.generate(user);
|
||||
|
||||
if (!loginDetails.remember_me) {
|
||||
return {
|
||||
...access_token,
|
||||
refresh_token: null,
|
||||
refresh_exp: null,
|
||||
}
|
||||
}
|
||||
|
||||
const refresh_token = await this.refreshTokens.generate(user);
|
||||
return {
|
||||
...access_token,
|
||||
refresh_token: refresh_token.refresh_token,
|
||||
refresh_exp: refresh_token.exp,
|
||||
}
|
||||
}
|
||||
|
||||
async renew(
|
||||
user: UserEntity,
|
||||
): Promise<AccessTokenDto> {
|
||||
return await this.accessTokens.generate(user);
|
||||
}
|
||||
|
||||
async validate(
|
||||
username: string,
|
||||
password: string,
|
||||
): Promise<UserEntity | null> {
|
||||
return await this.users.findOne({ username, password });
|
||||
return await this.users.findOne({ user_login: username, password, remember_me: false });
|
||||
}
|
||||
|
||||
async renew(
|
||||
user: UserEntity,
|
||||
refresh_token: string | null
|
||||
): Promise<AuthenticationDto | null> {
|
||||
const new_refresh_data = await this.refreshTokens.generate(user, refresh_token);
|
||||
const access_token = await this.accessTokens.generate(user);
|
||||
async verify(
|
||||
accessToken: string,
|
||||
refreshToken: string
|
||||
): Promise<{ validation: boolean, userId: UUID | null, username: string | null }> {
|
||||
let access: any = null;
|
||||
let refresh: any = null;
|
||||
|
||||
if (accessToken) {
|
||||
try {
|
||||
access = await this.accessTokens.verify(accessToken);
|
||||
} catch (err) {
|
||||
if (!(err instanceof TokenExpiredError)) {
|
||||
return {
|
||||
validation: false,
|
||||
userId: null,
|
||||
username: null,
|
||||
};
|
||||
}
|
||||
}
|
||||
if (access && (!access.username || !access.sub)) {
|
||||
return {
|
||||
validation: false,
|
||||
userId: null,
|
||||
username: null,
|
||||
};
|
||||
}
|
||||
}
|
||||
|
||||
if (refreshToken) {
|
||||
try {
|
||||
refresh = await this.refreshTokens.verify(refreshToken);
|
||||
} catch (err) {
|
||||
return {
|
||||
validation: false,
|
||||
userId: null,
|
||||
username: null,
|
||||
};
|
||||
}
|
||||
|
||||
if (!refresh.username || !refresh.sub) {
|
||||
return {
|
||||
validation: false,
|
||||
userId: null,
|
||||
username: null,
|
||||
};
|
||||
}
|
||||
}
|
||||
|
||||
if (!access && !refresh) {
|
||||
return {
|
||||
validation: false,
|
||||
userId: null,
|
||||
username: null,
|
||||
};
|
||||
} else if (!access && refresh) {
|
||||
return {
|
||||
validation: null,
|
||||
userId: null,
|
||||
username: null,
|
||||
};
|
||||
} else if (access && refresh) {
|
||||
if (access.username != refresh.username || access.sub != refresh.sub) {
|
||||
return {
|
||||
validation: false,
|
||||
userId: null,
|
||||
username: null,
|
||||
};
|
||||
}
|
||||
}
|
||||
|
||||
return {
|
||||
...access_token,
|
||||
refresh_token: new_refresh_data.refresh_token,
|
||||
refresh_exp: new_refresh_data.exp,
|
||||
}
|
||||
validation: true,
|
||||
userId: (access ?? refresh).sub,
|
||||
username: (access ?? refresh).username,
|
||||
};
|
||||
}
|
||||
|
||||
async revoke(userId: UUID, refreshToken: string): Promise<boolean> {
|
||||
async revoke(
|
||||
userId: UUID,
|
||||
refreshToken: string
|
||||
): Promise<boolean> {
|
||||
const res = await this.refreshTokens.revoke(userId, refreshToken);
|
||||
return res?.affected === 1
|
||||
return res?.affected === 1;
|
||||
}
|
||||
}
|
||||
|
@ -0,0 +1,4 @@
|
||||
export class AccessTokenDto {
|
||||
access_token: string;
|
||||
exp: number;
|
||||
}
|
@ -1,4 +1,4 @@
|
||||
class AuthenticationDto {
|
||||
export class AuthenticationDto {
|
||||
access_token: string;
|
||||
exp: number;
|
||||
refresh_token: string | null;
|
||||
|
19
backend/nestjs-seshat-api/src/auth/dto/login.dto.ts
Normal file
19
backend/nestjs-seshat-api/src/auth/dto/login.dto.ts
Normal file
@ -0,0 +1,19 @@
|
||||
import { IsBoolean, IsNotEmpty, IsOptional, IsString, MaxLength, MinLength } from 'class-validator';
|
||||
|
||||
export class LoginDto {
|
||||
@IsString()
|
||||
@IsNotEmpty()
|
||||
@MinLength(3)
|
||||
@MaxLength(24)
|
||||
readonly user_login: string;
|
||||
|
||||
@IsString()
|
||||
@IsNotEmpty()
|
||||
@MinLength(8)
|
||||
@MaxLength(128)
|
||||
readonly password: string;
|
||||
|
||||
@IsBoolean()
|
||||
@IsOptional()
|
||||
readonly remember_me: boolean;
|
||||
}
|
@ -5,7 +5,7 @@ import { AuthGuard } from '@nestjs/passport';
|
||||
@Injectable()
|
||||
export class JwtAccessGuard extends AuthGuard('jwt-access') {
|
||||
handleRequest(err, user, info) {
|
||||
if (err || !user || !user.isAdmin) {
|
||||
if (err || !user) {
|
||||
throw err || new UnauthorizedException();
|
||||
}
|
||||
return user;
|
||||
|
12
backend/nestjs-seshat-api/src/auth/guards/jwt-mixed.guard.ts
Normal file
12
backend/nestjs-seshat-api/src/auth/guards/jwt-mixed.guard.ts
Normal file
@ -0,0 +1,12 @@
|
||||
import { ForbiddenException, Injectable } from '@nestjs/common';
|
||||
import { AuthGuard } from '@nestjs/passport';
|
||||
|
||||
@Injectable()
|
||||
export class JwtMixedGuard extends AuthGuard(['jwt-access', 'jwt-refresh']) {
|
||||
handleRequest(err, user, info) {
|
||||
if (err || !user) {
|
||||
throw err || new ForbiddenException();
|
||||
}
|
||||
return user;
|
||||
}
|
||||
}
|
@ -1,6 +0,0 @@
|
||||
|
||||
import { Injectable } from '@nestjs/common';
|
||||
import { AuthGuard } from '@nestjs/passport';
|
||||
|
||||
@Injectable()
|
||||
export class LoginAuthGuard extends AuthGuard('login') { }
|
@ -1,13 +1,13 @@
|
||||
|
||||
import { CanActivate, ExecutionContext, Injectable } from '@nestjs/common';
|
||||
import { Observable } from 'rxjs';
|
||||
import { ForbiddenException, Injectable } from '@nestjs/common';
|
||||
import { AuthGuard } from '@nestjs/passport';
|
||||
|
||||
@Injectable()
|
||||
export class OfflineGuard implements CanActivate {
|
||||
canActivate(
|
||||
context: ExecutionContext,
|
||||
): boolean | Promise<boolean> | Observable<boolean> {
|
||||
const request = context.switchToHttp().getRequest();
|
||||
return !request.user;
|
||||
export class OfflineGuard extends AuthGuard(['jwt-access', 'jwt-refresh']) {
|
||||
handleRequest(err, user, info) {
|
||||
if (err || user) {
|
||||
throw err || new ForbiddenException();
|
||||
}
|
||||
return user;
|
||||
}
|
||||
}
|
||||
|
@ -6,12 +6,12 @@ import { ConfigService } from '@nestjs/config';
|
||||
import { UsersService } from 'src/users/users.service';
|
||||
|
||||
@Injectable()
|
||||
export class JwtStrategy extends PassportStrategy(Strategy, 'jwt-access') {
|
||||
export class JwtAccessStrategy extends PassportStrategy(Strategy, 'jwt-access') {
|
||||
constructor(private users: UsersService, private config: ConfigService) {
|
||||
super({
|
||||
jwtFromRequest: ExtractJwt.fromExtractors([
|
||||
//ExtractJwt.fromAuthHeaderAsBearerToken(),
|
||||
JwtStrategy.extract,
|
||||
JwtAccessStrategy.extract,
|
||||
]),
|
||||
ignoreExpiration: false,
|
||||
secretOrKey: config.getOrThrow<string>('AUTH_JWT_ACCESS_TOKEN_SECRET'),
|
@ -1,20 +0,0 @@
|
||||
|
||||
import { Strategy } from 'passport-local';
|
||||
import { PassportStrategy } from '@nestjs/passport';
|
||||
import { Injectable, UnauthorizedException } from '@nestjs/common';
|
||||
import { AuthService } from '../auth.service';
|
||||
|
||||
@Injectable()
|
||||
export class LoginStrategy extends PassportStrategy(Strategy, 'login') {
|
||||
constructor(private authService: AuthService) {
|
||||
super();
|
||||
}
|
||||
|
||||
async validate(username: string, password: string): Promise<any> {
|
||||
const user = await this.authService.validate(username, password);
|
||||
if (!user) {
|
||||
throw new UnauthorizedException();
|
||||
}
|
||||
return user;
|
||||
}
|
||||
}
|
@ -54,7 +54,7 @@ export class LibraryConsumer extends WorkerHost {
|
||||
const series: SeriesSubscriptionJobDto = job.data;
|
||||
const existingBooks = await this.library.findBooksFromSeries(series);
|
||||
const existingVolumes = existingBooks.map(b => b.volume);
|
||||
const lastPublishedBook = existingBooks.sort((a, b) => b.publishedAt.getTime() - a.publishedAt.getTime())[0];
|
||||
const lastPublishedBook = existingBooks.reduce((a, b) => a.publishedAt.getTime() > b.publishedAt.getTime() ? a : b);
|
||||
const books = await this.search(job, series, lastPublishedBook?.publishedAt);
|
||||
|
||||
let counter = 0;
|
||||
|
@ -21,6 +21,7 @@ export function serialize_user_long(value: UserEntity) {
|
||||
}
|
||||
|
||||
export function serialize_token(value: string) {
|
||||
if (!value) return null;
|
||||
return '...' + value.substring(Math.max(value.length - 12, value.length / 2) | 0);
|
||||
}
|
||||
|
||||
|
@ -14,6 +14,6 @@ async function bootstrap() {
|
||||
}));
|
||||
app.useLogger(app.get(Logger));
|
||||
app.useGlobalInterceptors(new LoggerErrorInterceptor());
|
||||
await app.listen(process.env.PORT ?? 3001);
|
||||
await app.listen(process.env.WEB_API_PORT ?? 3001);
|
||||
}
|
||||
bootstrap();
|
||||
|
@ -6,8 +6,8 @@ export class GoogleSearchContext extends SearchContext {
|
||||
}
|
||||
|
||||
|
||||
generateQueryParams() {
|
||||
const filterParams = ['maxResults', 'startIndex', 'orderBy'];
|
||||
generateQueryParams(): string {
|
||||
const filterParams = ['maxResults', 'startIndex', 'orderBy', 'langRestrict'];
|
||||
const searchParams = ['intitle', 'inauthor', 'inpublisher', 'subject', 'isbn'];
|
||||
|
||||
const queryParams = filterParams
|
||||
@ -120,12 +120,24 @@ export class GoogleSearchContext extends SearchContext {
|
||||
}
|
||||
}
|
||||
|
||||
next() {
|
||||
previous(pageCount: number = 1): GoogleSearchContext {
|
||||
if (pageCount > 0)
|
||||
return this.update(-pageCount);
|
||||
return this;
|
||||
}
|
||||
|
||||
next(pageCount: number = 1): GoogleSearchContext {
|
||||
if (pageCount > 0)
|
||||
return this.update(pageCount);
|
||||
return this;
|
||||
}
|
||||
|
||||
private update(pageChange: number): GoogleSearchContext {
|
||||
const resultsPerPage = this.params['maxResults'] ? parseInt(this.params['maxResults']) : 10;
|
||||
const index = this.params['startIndex'] ? parseInt(this.params['startIndex']) : 0;
|
||||
|
||||
const data = { ...this.params };
|
||||
data['startIndex'] = (index + resultsPerPage).toString();
|
||||
data['startIndex'] = Math.max(0, index + resultsPerPage * pageChange).toString();
|
||||
|
||||
return new GoogleSearchContext(this.search, data);
|
||||
}
|
||||
|
@ -9,6 +9,7 @@ export abstract class SearchContext {
|
||||
this.params = params;
|
||||
}
|
||||
|
||||
abstract generateQueryParams();
|
||||
abstract next();
|
||||
abstract generateQueryParams(): string;
|
||||
abstract previous(pageCount: number): SearchContext;
|
||||
abstract next(pageCount: number): SearchContext;
|
||||
}
|
@ -0,0 +1,23 @@
|
||||
import { GoogleSearchContext } from "./google.search.context";
|
||||
import { SearchContext } from "./search.context";
|
||||
|
||||
export class SimplifiedSearchContext {
|
||||
values: { [key: string]: string };
|
||||
|
||||
constructor(values: { [key: string]: string }) {
|
||||
this.values = values;
|
||||
}
|
||||
|
||||
toSearchContext(): SearchContext | null {
|
||||
const provider = this.values['provider']?.toString().toLowerCase();
|
||||
const search = this.values['search']?.toString();
|
||||
const valuesCopy = { ...this.values };
|
||||
delete valuesCopy['provider'];
|
||||
delete valuesCopy['search'];
|
||||
|
||||
if (provider == 'google') {
|
||||
return new GoogleSearchContext(search, valuesCopy)
|
||||
}
|
||||
return null;
|
||||
}
|
||||
}
|
@ -1,18 +1,20 @@
|
||||
import { Injectable } from '@nestjs/common';
|
||||
import { BadRequestException, HttpException, Injectable } from '@nestjs/common';
|
||||
import { BookSearchResultDto } from '../dto/book-search-result.dto';
|
||||
import { HttpService } from '@nestjs/axios';
|
||||
import { firstValueFrom, map, timeout } from 'rxjs';
|
||||
import { AxiosResponse } from 'axios';
|
||||
import { catchError, EMPTY, firstValueFrom, map, timeout } from 'rxjs';
|
||||
import { AxiosError, AxiosResponse } from 'axios';
|
||||
import { GoogleSearchContext } from '../contexts/google.search.context';
|
||||
import { PinoLogger } from 'nestjs-pino';
|
||||
|
||||
@Injectable()
|
||||
export class GoogleService {
|
||||
constructor(
|
||||
private readonly http: HttpService,
|
||||
private readonly logger: PinoLogger,
|
||||
) { }
|
||||
|
||||
async searchRaw(searchQuery: string): Promise<BookSearchResultDto[]> {
|
||||
const queryParams = 'langRestrict=en&printType=books&maxResults=10&fields=items(kind,id,volumeInfo(title,description,authors,publisher,publishedDate,industryIdentifiers,language,categories,maturityRating,imageLinks,canonicalVolumeLink,seriesInfo))&q=';
|
||||
const queryParams = 'langRestrict=en&printType=books&maxResults=20&fields=items(kind,id,volumeInfo(title,description,authors,publisher,publishedDate,industryIdentifiers,language,categories,maturityRating,imageLinks,canonicalVolumeLink,seriesInfo))&q=';
|
||||
|
||||
return await firstValueFrom(
|
||||
this.http.get('https://www.googleapis.com/books/v1/volumes?' + queryParams + searchQuery)
|
||||
@ -28,7 +30,7 @@ export class GoogleService {
|
||||
return null;
|
||||
}
|
||||
|
||||
const defaultQueryParams = 'langRestrict=en&printType=books&fields=items(kind,id,volumeInfo(title,description,authors,publisher,publishedDate,industryIdentifiers,language,categories,maturityRating,imageLinks,canonicalVolumeLink,seriesInfo))';
|
||||
const defaultQueryParams = 'printType=books&fields=items(kind,id,volumeInfo(title,description,authors,publisher,publishedDate,industryIdentifiers,language,categories,maturityRating,imageLinks,canonicalVolumeLink,seriesInfo))';
|
||||
const customQueryParams = context.generateQueryParams();
|
||||
|
||||
return await firstValueFrom(
|
||||
@ -36,6 +38,23 @@ export class GoogleService {
|
||||
.pipe(
|
||||
timeout({ first: 5000 }),
|
||||
map(value => this.transform(value)),
|
||||
catchError((err: any) => {
|
||||
if (err instanceof AxiosError) {
|
||||
if (err.status == 400) {
|
||||
throw new BadRequestException(err.response.data);
|
||||
} else if (err.status == 429) {
|
||||
throw new HttpException(err.response?.data, 429);
|
||||
}
|
||||
}
|
||||
|
||||
this.logger.error({
|
||||
class: GoogleService.name,
|
||||
method: this.search.name,
|
||||
msg: 'Unknown Google search error.',
|
||||
error: err,
|
||||
});
|
||||
return EMPTY;
|
||||
})
|
||||
)
|
||||
);
|
||||
}
|
||||
@ -46,11 +65,11 @@ export class GoogleService {
|
||||
}
|
||||
|
||||
return response.data.items
|
||||
//.filter(item => item.volumeInfo?.canonicalVolumeLink?.startsWith('https://play.google.com/store/books/details'))
|
||||
.map(item => this.extract(item));
|
||||
}
|
||||
|
||||
private extract(item: any): BookSearchResultDto {
|
||||
const secure = process.env.WEB_SECURE?.toLowerCase() == 'true';
|
||||
const result: BookSearchResultDto = {
|
||||
providerBookId: item.id,
|
||||
providerSeriesId: item.volumeInfo.seriesInfo?.volumeSeries[0].seriesId,
|
||||
@ -65,7 +84,7 @@ export class GoogleService {
|
||||
industryIdentifiers: item.volumeInfo.industryIdentifiers ? Object.assign({}, ...item.volumeInfo.industryIdentifiers.map(i => i.type == 'OTHER' ? { [i.identifier.split(':')[0]]: i.identifier.split(':')[1] } : { [i.type]: i.identifier })) : [],
|
||||
publishedAt: new Date(item.volumeInfo.publishedDate),
|
||||
language: item.volumeInfo.language,
|
||||
thumbnail: item.volumeInfo.imageLinks?.thumbnail,
|
||||
thumbnail: secure && item.volumeInfo.imageLinks?.thumbnail ? item.volumeInfo.imageLinks.thumbnail.replaceAll('http://', 'https://') : item.volumeInfo.imageLinks?.thumbnail,
|
||||
url: item.volumeInfo.canonicalVolumeLink,
|
||||
provider: 'google'
|
||||
}
|
||||
|
@ -1,7 +1,7 @@
|
||||
import { Body, Controller, Get, UseGuards } from '@nestjs/common';
|
||||
import { Controller, Get, Query, UseGuards } from '@nestjs/common';
|
||||
import { ProvidersService } from './providers.service';
|
||||
import { BookSearchInputDto } from './dto/book-search-input.dto';
|
||||
import { JwtAccessGuard } from 'src/auth/guards/jwt-access.guard';
|
||||
import { SimplifiedSearchContext } from './contexts/simplified-search-context';
|
||||
|
||||
@Controller('providers')
|
||||
export class ProvidersController {
|
||||
@ -12,8 +12,10 @@ export class ProvidersController {
|
||||
@UseGuards(JwtAccessGuard)
|
||||
@Get('search')
|
||||
async Search(
|
||||
@Body() body: BookSearchInputDto,
|
||||
@Query() context,
|
||||
) {
|
||||
return await this.providers.searchRaw(body.provider, body.query);
|
||||
const simplified = new SimplifiedSearchContext(context);
|
||||
const searchContext = simplified.toSearchContext();
|
||||
return await this.providers.search(searchContext);
|
||||
}
|
||||
}
|
||||
|
@ -1,9 +0,0 @@
|
||||
import { IsNotEmpty } from 'class-validator';
|
||||
|
||||
export class LoginUserDto {
|
||||
@IsNotEmpty()
|
||||
readonly username: string;
|
||||
|
||||
@IsNotEmpty()
|
||||
readonly password: string;
|
||||
}
|
@ -3,8 +3,8 @@ import { Injectable } from '@nestjs/common';
|
||||
import { InjectRepository } from '@nestjs/typeorm';
|
||||
import { Repository } from 'typeorm';
|
||||
import { UserEntity } from './entities/users.entity';
|
||||
import { LoginUserDto } from './dto/login-user.dto';
|
||||
import { UUID } from 'crypto';
|
||||
import { LoginDto } from 'src/auth/dto/login.dto';
|
||||
|
||||
class UserDto {
|
||||
userId: UUID;
|
||||
@ -32,15 +32,15 @@ export class UsersService {
|
||||
}));
|
||||
}
|
||||
|
||||
async findOne({ username, password }: LoginUserDto): Promise<UserEntity> {
|
||||
const user = await this.userRepository.findOneBy({ userLogin: username });
|
||||
async findOne(loginDetails: LoginDto): Promise<UserEntity> {
|
||||
const user = await this.userRepository.findOneBy({ userLogin: loginDetails.user_login });
|
||||
if (!user) {
|
||||
// TODO: force an argon2.verify() to occur here.
|
||||
return null;
|
||||
}
|
||||
|
||||
const buffer = Buffer.concat([
|
||||
Buffer.from(password, 'utf8'),
|
||||
Buffer.from(loginDetails.password, 'utf8'),
|
||||
Buffer.from(user.salt.toString(16), 'hex'),
|
||||
]);
|
||||
|
||||
|
16
frontend/angular-seshat/.editorconfig
Normal file
16
frontend/angular-seshat/.editorconfig
Normal file
@ -0,0 +1,16 @@
|
||||
# Editor configuration, see https://editorconfig.org
|
||||
root = true
|
||||
|
||||
[*]
|
||||
charset = utf-8
|
||||
indent_style = space
|
||||
indent_size = 2
|
||||
insert_final_newline = true
|
||||
trim_trailing_whitespace = true
|
||||
|
||||
[*.ts]
|
||||
quote_type = single
|
||||
|
||||
[*.md]
|
||||
max_line_length = off
|
||||
trim_trailing_whitespace = false
|
42
frontend/angular-seshat/.gitignore
vendored
Normal file
42
frontend/angular-seshat/.gitignore
vendored
Normal file
@ -0,0 +1,42 @@
|
||||
# See https://docs.github.com/get-started/getting-started-with-git/ignoring-files for more about ignoring files.
|
||||
|
||||
# Compiled output
|
||||
/dist
|
||||
/tmp
|
||||
/out-tsc
|
||||
/bazel-out
|
||||
|
||||
# Node
|
||||
/node_modules
|
||||
npm-debug.log
|
||||
yarn-error.log
|
||||
|
||||
# IDEs and editors
|
||||
.idea/
|
||||
.project
|
||||
.classpath
|
||||
.c9/
|
||||
*.launch
|
||||
.settings/
|
||||
*.sublime-workspace
|
||||
|
||||
# Visual Studio Code
|
||||
.vscode/*
|
||||
!.vscode/settings.json
|
||||
!.vscode/tasks.json
|
||||
!.vscode/launch.json
|
||||
!.vscode/extensions.json
|
||||
.history/*
|
||||
|
||||
# Miscellaneous
|
||||
/.angular/cache
|
||||
.sass-cache/
|
||||
/connect.lock
|
||||
/coverage
|
||||
/libpeerconnection.log
|
||||
testem.log
|
||||
/typings
|
||||
|
||||
# System files
|
||||
.DS_Store
|
||||
Thumbs.db
|
4
frontend/angular-seshat/.vscode/extensions.json
vendored
Normal file
4
frontend/angular-seshat/.vscode/extensions.json
vendored
Normal file
@ -0,0 +1,4 @@
|
||||
{
|
||||
// For more information, visit: https://go.microsoft.com/fwlink/?linkid=827846
|
||||
"recommendations": ["angular.ng-template"]
|
||||
}
|
20
frontend/angular-seshat/.vscode/launch.json
vendored
Normal file
20
frontend/angular-seshat/.vscode/launch.json
vendored
Normal file
@ -0,0 +1,20 @@
|
||||
{
|
||||
// For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
|
||||
"version": "0.2.0",
|
||||
"configurations": [
|
||||
{
|
||||
"name": "ng serve",
|
||||
"type": "chrome",
|
||||
"request": "launch",
|
||||
"preLaunchTask": "npm: start",
|
||||
"url": "http://localhost:4200/"
|
||||
},
|
||||
{
|
||||
"name": "ng test",
|
||||
"type": "chrome",
|
||||
"request": "launch",
|
||||
"preLaunchTask": "npm: test",
|
||||
"url": "http://localhost:9876/debug.html"
|
||||
}
|
||||
]
|
||||
}
|
42
frontend/angular-seshat/.vscode/tasks.json
vendored
Normal file
42
frontend/angular-seshat/.vscode/tasks.json
vendored
Normal file
@ -0,0 +1,42 @@
|
||||
{
|
||||
// For more information, visit: https://go.microsoft.com/fwlink/?LinkId=733558
|
||||
"version": "2.0.0",
|
||||
"tasks": [
|
||||
{
|
||||
"type": "npm",
|
||||
"script": "start",
|
||||
"isBackground": true,
|
||||
"problemMatcher": {
|
||||
"owner": "typescript",
|
||||
"pattern": "$tsc",
|
||||
"background": {
|
||||
"activeOnStart": true,
|
||||
"beginsPattern": {
|
||||
"regexp": "(.*?)"
|
||||
},
|
||||
"endsPattern": {
|
||||
"regexp": "bundle generation complete"
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
"type": "npm",
|
||||
"script": "test",
|
||||
"isBackground": true,
|
||||
"problemMatcher": {
|
||||
"owner": "typescript",
|
||||
"pattern": "$tsc",
|
||||
"background": {
|
||||
"activeOnStart": true,
|
||||
"beginsPattern": {
|
||||
"regexp": "(.*?)"
|
||||
},
|
||||
"endsPattern": {
|
||||
"regexp": "bundle generation complete"
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
27
frontend/angular-seshat/README.md
Normal file
27
frontend/angular-seshat/README.md
Normal file
@ -0,0 +1,27 @@
|
||||
# AngularSeshat
|
||||
|
||||
This project was generated with [Angular CLI](https://github.com/angular/angular-cli) version 18.0.5.
|
||||
|
||||
## Development server
|
||||
|
||||
Run `ng serve` for a dev server. Navigate to `http://localhost:4200/`. The application will automatically reload if you change any of the source files.
|
||||
|
||||
## Code scaffolding
|
||||
|
||||
Run `ng generate component component-name` to generate a new component. You can also use `ng generate directive|pipe|service|class|guard|interface|enum|module`.
|
||||
|
||||
## Build
|
||||
|
||||
Run `ng build` to build the project. The build artifacts will be stored in the `dist/` directory.
|
||||
|
||||
## Running unit tests
|
||||
|
||||
Run `ng test` to execute the unit tests via [Karma](https://karma-runner.github.io).
|
||||
|
||||
## Running end-to-end tests
|
||||
|
||||
Run `ng e2e` to execute the end-to-end tests via a platform of your choice. To use this command, you need to first add a package that implements end-to-end testing capabilities.
|
||||
|
||||
## Further help
|
||||
|
||||
To get more help on the Angular CLI use `ng help` or go check out the [Angular CLI Overview and Command Reference](https://angular.dev/tools/cli) page.
|
134
frontend/angular-seshat/angular.json
Normal file
134
frontend/angular-seshat/angular.json
Normal file
@ -0,0 +1,134 @@
|
||||
{
|
||||
"$schema": "./node_modules/@angular/cli/lib/config/schema.json",
|
||||
"version": 1,
|
||||
"newProjectRoot": "projects",
|
||||
"projects": {
|
||||
"angular-seshat": {
|
||||
"projectType": "application",
|
||||
"schematics": {},
|
||||
"root": "",
|
||||
"sourceRoot": "src",
|
||||
"prefix": "app",
|
||||
"architect": {
|
||||
"build": {
|
||||
"builder": "@angular-devkit/build-angular:application",
|
||||
"options": {
|
||||
"outputPath": "dist/angular-seshat",
|
||||
"index": "src/index.html",
|
||||
"browser": "src/main.ts",
|
||||
"polyfills": [
|
||||
"zone.js"
|
||||
],
|
||||
"tsConfig": "tsconfig.app.json",
|
||||
"assets": [
|
||||
{
|
||||
"glob": "**/*",
|
||||
"input": "public"
|
||||
}
|
||||
],
|
||||
"styles": [
|
||||
"src/styles.css"
|
||||
],
|
||||
"scripts": [],
|
||||
"server": "src/main.server.ts",
|
||||
"prerender": true,
|
||||
"ssr": {
|
||||
"entry": "server.ts"
|
||||
}
|
||||
},
|
||||
"configurations": {
|
||||
"production": {
|
||||
"budgets": [
|
||||
{
|
||||
"type": "initial",
|
||||
"maximumWarning": "500kB",
|
||||
"maximumError": "1MB"
|
||||
},
|
||||
{
|
||||
"type": "anyComponentStyle",
|
||||
"maximumWarning": "2kB",
|
||||
"maximumError": "4kB"
|
||||
}
|
||||
],
|
||||
"outputHashing": "all"
|
||||
},
|
||||
"development": {
|
||||
"optimization": false,
|
||||
"extractLicenses": false,
|
||||
"sourceMap": true
|
||||
}
|
||||
},
|
||||
"defaultConfiguration": "production"
|
||||
},
|
||||
"serve": {
|
||||
"builder": "@angular-devkit/build-angular:dev-server",
|
||||
"configurations": {
|
||||
"production": {
|
||||
"buildTarget": "angular-seshat:build:production"
|
||||
},
|
||||
"development": {
|
||||
"buildTarget": "angular-seshat:build:development"
|
||||
}
|
||||
},
|
||||
"defaultConfiguration": "development"
|
||||
},
|
||||
"extract-i18n": {
|
||||
"builder": "@angular-devkit/build-angular:extract-i18n"
|
||||
},
|
||||
"test": {
|
||||
"builder": "@angular-devkit/build-angular:karma",
|
||||
"options": {
|
||||
"polyfills": [
|
||||
"zone.js",
|
||||
"zone.js/testing"
|
||||
],
|
||||
"tsConfig": "tsconfig.spec.json",
|
||||
"assets": [
|
||||
{
|
||||
"glob": "**/*",
|
||||
"input": "public"
|
||||
}
|
||||
],
|
||||
"styles": [
|
||||
"src/styles.css"
|
||||
],
|
||||
"scripts": []
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
"library": {
|
||||
"projectType": "library",
|
||||
"root": "projects/library",
|
||||
"sourceRoot": "projects/library/src",
|
||||
"prefix": "lib",
|
||||
"architect": {
|
||||
"build": {
|
||||
"builder": "@angular-devkit/build-angular:ng-packagr",
|
||||
"options": {
|
||||
"project": "projects/library/ng-package.json"
|
||||
},
|
||||
"configurations": {
|
||||
"production": {
|
||||
"tsConfig": "projects/library/tsconfig.lib.prod.json"
|
||||
},
|
||||
"development": {
|
||||
"tsConfig": "projects/library/tsconfig.lib.json"
|
||||
}
|
||||
},
|
||||
"defaultConfiguration": "production"
|
||||
},
|
||||
"test": {
|
||||
"builder": "@angular-devkit/build-angular:karma",
|
||||
"options": {
|
||||
"tsConfig": "projects/library/tsconfig.spec.json",
|
||||
"polyfills": [
|
||||
"zone.js",
|
||||
"zone.js/testing"
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
14418
frontend/angular-seshat/package-lock.json
generated
Normal file
14418
frontend/angular-seshat/package-lock.json
generated
Normal file
File diff suppressed because it is too large
Load Diff
47
frontend/angular-seshat/package.json
Normal file
47
frontend/angular-seshat/package.json
Normal file
@ -0,0 +1,47 @@
|
||||
{
|
||||
"name": "angular-seshat",
|
||||
"version": "0.0.0",
|
||||
"scripts": {
|
||||
"ng": "ng",
|
||||
"start": "ng serve",
|
||||
"build": "ng build",
|
||||
"watch": "ng build --watch --configuration development",
|
||||
"test": "ng test",
|
||||
"serve:ssr:angular-seshat": "node dist/angular-seshat/server/server.mjs"
|
||||
},
|
||||
"private": true,
|
||||
"dependencies": {
|
||||
"@angular/animations": "^18.0.0",
|
||||
"@angular/common": "^18.0.0",
|
||||
"@angular/compiler": "^18.0.0",
|
||||
"@angular/core": "^18.0.0",
|
||||
"@angular/forms": "^18.0.0",
|
||||
"@angular/material": "^18.2.14",
|
||||
"@angular/platform-browser": "^18.0.0",
|
||||
"@angular/platform-browser-dynamic": "^18.0.0",
|
||||
"@angular/platform-server": "^18.0.0",
|
||||
"@angular/router": "^18.0.0",
|
||||
"@angular/ssr": "^18.0.5",
|
||||
"express": "^4.18.2",
|
||||
"ngx-cookie-service": "^18.0.0",
|
||||
"rxjs": "~7.8.0",
|
||||
"tslib": "^2.3.0",
|
||||
"zone.js": "~0.14.3"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@angular-devkit/build-angular": "^18.0.5",
|
||||
"@angular/cli": "^18.0.5",
|
||||
"@angular/compiler-cli": "^18.0.0",
|
||||
"@types/express": "^4.17.17",
|
||||
"@types/jasmine": "~5.1.0",
|
||||
"@types/node": "^18.18.0",
|
||||
"jasmine-core": "~5.1.0",
|
||||
"karma": "~6.4.0",
|
||||
"karma-chrome-launcher": "~3.2.0",
|
||||
"karma-coverage": "~2.2.0",
|
||||
"karma-jasmine": "~5.1.0",
|
||||
"karma-jasmine-html-reporter": "~2.1.0",
|
||||
"ng-packagr": "^18.2.0",
|
||||
"typescript": "~5.4.2"
|
||||
}
|
||||
}
|
BIN
frontend/angular-seshat/public/favicon.ico
Normal file
BIN
frontend/angular-seshat/public/favicon.ico
Normal file
Binary file not shown.
After Width: | Height: | Size: 15 KiB |
@ -0,0 +1 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px" fill="#e8eaed"><path d="M80-140v-320h320v320H80Zm80-80h160v-160H160v160Zm60-340 220-360 220 360H220Zm142-80h156l-78-126-78 126ZM863-42 757-148q-21 14-45.5 21t-51.5 7q-75 0-127.5-52.5T480-300q0-75 52.5-127.5T660-480q75 0 127.5 52.5T840-300q0 26-7 50.5T813-204L919-98l-56 56ZM660-200q42 0 71-29t29-71q0-42-29-71t-71-29q-42 0-71 29t-29 71q0 42 29 71t71 29ZM320-380Zm120-260Z"/></svg>
|
After Width: | Height: | Size: 472 B |
1
frontend/angular-seshat/public/icons/close_icon.svg
Normal file
1
frontend/angular-seshat/public/icons/close_icon.svg
Normal file
@ -0,0 +1 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px" fill="#e8eaed"><path d="m256-200-56-56 224-224-224-224 56-56 224 224 224-224 56 56-224 224 224 224-56 56-224-224-224 224Z"/></svg>
|
After Width: | Height: | Size: 222 B |
1
frontend/angular-seshat/public/icons/error_icon.svg
Normal file
1
frontend/angular-seshat/public/icons/error_icon.svg
Normal file
@ -0,0 +1 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px" fill="#e3e3e3"><path d="M480-280q17 0 28.5-11.5T520-320q0-17-11.5-28.5T480-360q-17 0-28.5 11.5T440-320q0 17 11.5 28.5T480-280Zm-40-160h80v-240h-80v240Zm40 360q-83 0-156-31.5T197-197q-54-54-85.5-127T80-480q0-83 31.5-156T197-763q54-54 127-85.5T480-880q83 0 156 31.5T763-763q54 54 85.5 127T880-480q0 83-31.5 156T763-197q-54 54-127 85.5T480-80Zm0-80q134 0 227-93t93-227q0-134-93-227t-227-93q-134 0-227 93t-93 227q0 134 93 227t227 93Zm0-320Z"/></svg>
|
After Width: | Height: | Size: 537 B |
1
frontend/angular-seshat/public/icons/search_icon.svg
Normal file
1
frontend/angular-seshat/public/icons/search_icon.svg
Normal file
@ -0,0 +1 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px" fill="#e8eaed"><path d="M784-120 532-372q-30 24-69 38t-83 14q-109 0-184.5-75.5T120-580q0-109 75.5-184.5T380-840q109 0 184.5 75.5T640-580q0 44-14 83t-38 69l252 252-56 56ZM380-400q75 0 127.5-52.5T560-580q0-75-52.5-127.5T380-760q-75 0-127.5 52.5T200-580q0 75 52.5 127.5T380-400Z"/></svg>
|
After Width: | Height: | Size: 376 B |
1
frontend/angular-seshat/public/icons/warning_icon.svg
Normal file
1
frontend/angular-seshat/public/icons/warning_icon.svg
Normal file
@ -0,0 +1 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px" fill="#e3e3e3"><path d="m40-120 440-760 440 760H40Zm138-80h604L480-720 178-200Zm302-40q17 0 28.5-11.5T520-280q0-17-11.5-28.5T480-320q-17 0-28.5 11.5T440-280q0 17 11.5 28.5T480-240Zm-40-120h80v-200h-80v200Zm40-100Z"/></svg>
|
After Width: | Height: | Size: 314 B |
57
frontend/angular-seshat/server.ts
Normal file
57
frontend/angular-seshat/server.ts
Normal file
@ -0,0 +1,57 @@
|
||||
import { APP_BASE_HREF } from '@angular/common';
|
||||
import { CommonEngine } from '@angular/ssr';
|
||||
import express from 'express';
|
||||
import { fileURLToPath } from 'node:url';
|
||||
import { dirname, join, resolve } from 'node:path';
|
||||
import bootstrap from './src/main.server';
|
||||
|
||||
// The Express app is exported so that it can be used by serverless Functions.
|
||||
export function app(): express.Express {
|
||||
const server = express();
|
||||
const serverDistFolder = dirname(fileURLToPath(import.meta.url));
|
||||
const browserDistFolder = resolve(serverDistFolder, '../browser');
|
||||
const indexHtml = join(serverDistFolder, 'index.server.html');
|
||||
|
||||
const commonEngine = new CommonEngine();
|
||||
|
||||
server.set('view engine', 'html');
|
||||
server.set('views', browserDistFolder);
|
||||
|
||||
// Example Express Rest API endpoints
|
||||
// server.get('/api/**', (req, res) => { });
|
||||
// Serve static files from /browser
|
||||
server.get('**', express.static(browserDistFolder, {
|
||||
maxAge: '1y',
|
||||
index: 'index.html',
|
||||
}));
|
||||
|
||||
// All regular routes use the Angular engine
|
||||
server.get('**', (req, res, next) => {
|
||||
const { protocol, originalUrl, baseUrl, headers } = req;
|
||||
|
||||
commonEngine
|
||||
.render({
|
||||
bootstrap,
|
||||
documentFilePath: indexHtml,
|
||||
url: `${protocol}://${headers.host}${originalUrl}`,
|
||||
publicPath: browserDistFolder,
|
||||
providers: [{ provide: APP_BASE_HREF, useValue: baseUrl }],
|
||||
})
|
||||
.then((html) => res.send(html))
|
||||
.catch((err) => next(err));
|
||||
});
|
||||
|
||||
return server;
|
||||
}
|
||||
|
||||
function run(): void {
|
||||
const port = process.env['PORT'] || 4000;
|
||||
|
||||
// Start up the Node server
|
||||
const server = app();
|
||||
server.listen(port, () => {
|
||||
console.log(`Node Express server listening on http://localhost:${port}`);
|
||||
});
|
||||
}
|
||||
|
||||
run();
|
10
frontend/angular-seshat/src/app/app.component.css
Normal file
10
frontend/angular-seshat/src/app/app.component.css
Normal file
@ -0,0 +1,10 @@
|
||||
.loading-container {
|
||||
display: flex;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100vw;
|
||||
height: 100vh;
|
||||
background-color: rgba(0, 0, 0, 0.7);
|
||||
z-index: 1000;
|
||||
}
|
6
frontend/angular-seshat/src/app/app.component.html
Normal file
6
frontend/angular-seshat/src/app/app.component.html
Normal file
@ -0,0 +1,6 @@
|
||||
@if (loading) {
|
||||
<div class="loading-container flex-content-center">
|
||||
<div>hello, loading world.</div>
|
||||
</div>
|
||||
}
|
||||
<router-outlet />
|
29
frontend/angular-seshat/src/app/app.component.spec.ts
Normal file
29
frontend/angular-seshat/src/app/app.component.spec.ts
Normal file
@ -0,0 +1,29 @@
|
||||
import { TestBed } from '@angular/core/testing';
|
||||
import { AppComponent } from './app.component';
|
||||
|
||||
describe('AppComponent', () => {
|
||||
beforeEach(async () => {
|
||||
await TestBed.configureTestingModule({
|
||||
imports: [AppComponent],
|
||||
}).compileComponents();
|
||||
});
|
||||
|
||||
it('should create the app', () => {
|
||||
const fixture = TestBed.createComponent(AppComponent);
|
||||
const app = fixture.componentInstance;
|
||||
expect(app).toBeTruthy();
|
||||
});
|
||||
|
||||
it(`should have the 'angular-seshat' title`, () => {
|
||||
const fixture = TestBed.createComponent(AppComponent);
|
||||
const app = fixture.componentInstance;
|
||||
expect(app.title).toEqual('angular-seshat');
|
||||
});
|
||||
|
||||
it('should render title', () => {
|
||||
const fixture = TestBed.createComponent(AppComponent);
|
||||
fixture.detectChanges();
|
||||
const compiled = fixture.nativeElement as HTMLElement;
|
||||
expect(compiled.querySelector('h1')?.textContent).toContain('Hello, angular-seshat');
|
||||
});
|
||||
});
|
53
frontend/angular-seshat/src/app/app.component.ts
Normal file
53
frontend/angular-seshat/src/app/app.component.ts
Normal file
@ -0,0 +1,53 @@
|
||||
import { Component, inject, OnDestroy, OnInit, PLATFORM_ID } from '@angular/core';
|
||||
import { RouterOutlet } from '@angular/router';
|
||||
import { AuthService } from './services/auth/auth.service';
|
||||
import { ConfigService } from './services/config.service';
|
||||
import { isPlatformBrowser } from '@angular/common';
|
||||
import { LoadingService } from './services/loading.service';
|
||||
import { Subscription } from 'rxjs';
|
||||
import { RedirectionService } from './services/redirection.service';
|
||||
|
||||
@Component({
|
||||
selector: 'app-root',
|
||||
standalone: true,
|
||||
imports: [RouterOutlet],
|
||||
templateUrl: './app.component.html',
|
||||
styleUrl: './app.component.css'
|
||||
})
|
||||
export class AppComponent implements OnInit, OnDestroy {
|
||||
private readonly _auth = inject(AuthService);
|
||||
private readonly _config = inject(ConfigService);
|
||||
private readonly _loading = inject(LoadingService);
|
||||
private readonly _platformId = inject(PLATFORM_ID);
|
||||
private readonly _redirect = inject(RedirectionService);
|
||||
private readonly _subscriptions: Subscription[] = [];
|
||||
|
||||
loading: boolean = false;
|
||||
|
||||
ngOnInit() {
|
||||
if (!isPlatformBrowser(this._platformId)) {
|
||||
return;
|
||||
}
|
||||
|
||||
this.listenToLoading();
|
||||
|
||||
this._config.fetch();
|
||||
this._auth.update();
|
||||
|
||||
this._loading.listenUntilReady()
|
||||
.subscribe(async () => {
|
||||
this._redirect.redirect(null);
|
||||
});
|
||||
}
|
||||
|
||||
ngOnDestroy(): void {
|
||||
this._subscriptions.forEach(s => s.unsubscribe());
|
||||
}
|
||||
|
||||
listenToLoading(): void {
|
||||
this._subscriptions.push(
|
||||
this._loading.listen()
|
||||
.subscribe((loading) => this.loading = loading)
|
||||
);
|
||||
}
|
||||
}
|
11
frontend/angular-seshat/src/app/app.config.server.ts
Normal file
11
frontend/angular-seshat/src/app/app.config.server.ts
Normal file
@ -0,0 +1,11 @@
|
||||
import { mergeApplicationConfig, ApplicationConfig } from '@angular/core';
|
||||
import { provideServerRendering } from '@angular/platform-server';
|
||||
import { appConfig } from './app.config';
|
||||
|
||||
const serverConfig: ApplicationConfig = {
|
||||
providers: [
|
||||
provideServerRendering()
|
||||
],
|
||||
};
|
||||
|
||||
export const config = mergeApplicationConfig(appConfig, serverConfig);
|
21
frontend/angular-seshat/src/app/app.config.ts
Normal file
21
frontend/angular-seshat/src/app/app.config.ts
Normal file
@ -0,0 +1,21 @@
|
||||
import { ApplicationConfig, provideZoneChangeDetection } from '@angular/core';
|
||||
import { provideRouter } from '@angular/router';
|
||||
import { routes } from './app.routes';
|
||||
import { provideClientHydration } from '@angular/platform-browser';
|
||||
import { provideHttpClient, withInterceptorsFromDi, withFetch, HTTP_INTERCEPTORS } from '@angular/common/http';
|
||||
import { LoadingInterceptor } from './shared/interceptors/loading.interceptor';
|
||||
import { TokenValidationInterceptor } from './shared/interceptors/token-validation.interceptor';
|
||||
|
||||
export const appConfig: ApplicationConfig = {
|
||||
providers: [
|
||||
provideZoneChangeDetection({ eventCoalescing: true }),
|
||||
provideRouter(routes),
|
||||
provideClientHydration(),
|
||||
provideHttpClient(
|
||||
withInterceptorsFromDi(),
|
||||
withFetch()
|
||||
),
|
||||
LoadingInterceptor,
|
||||
TokenValidationInterceptor,
|
||||
]
|
||||
};
|
22
frontend/angular-seshat/src/app/app.routes.ts
Normal file
22
frontend/angular-seshat/src/app/app.routes.ts
Normal file
@ -0,0 +1,22 @@
|
||||
import { Routes } from '@angular/router';
|
||||
import { LoginFormComponent } from './login/login-form/login-form.component';
|
||||
import { RegisterFormComponent } from './register/register-form/register-form.component';
|
||||
import { AddNewPageComponent } from './library/add-new-page/add-new-page.component';
|
||||
|
||||
export const routes: Routes = [
|
||||
{
|
||||
path: 'login',
|
||||
component: LoginFormComponent,
|
||||
canActivate: [],
|
||||
},
|
||||
{
|
||||
path: 'register',
|
||||
component: RegisterFormComponent,
|
||||
canActivate: [],
|
||||
},
|
||||
{
|
||||
path: 'add/new',
|
||||
component: AddNewPageComponent,
|
||||
canActivate: [],
|
||||
},
|
||||
];
|
@ -0,0 +1,43 @@
|
||||
.search-content {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
height: 100vh;
|
||||
}
|
||||
|
||||
.results-box {
|
||||
background: #5757576c;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
flex: 1;
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
.result-item {
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
.results-error {
|
||||
text-align: center;
|
||||
font-size: 16px;
|
||||
color: red;
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
.results-end {
|
||||
text-align: center;
|
||||
font-size: 16px;
|
||||
color: #ff8c00;
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
.results-error img, .results-end img {
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.filter-error {
|
||||
filter: brightness(0) saturate(100%) invert(25%) sepia(67%) saturate(2736%) hue-rotate(340deg) brightness(110%) contrast(100%);
|
||||
}
|
||||
|
||||
.filter-warning {
|
||||
filter: brightness(0) saturate(100%) invert(52%) sepia(95%) saturate(2039%) hue-rotate(3deg) brightness(106%) contrast(102%);
|
||||
}
|
@ -0,0 +1,28 @@
|
||||
<div class="search-content">
|
||||
<search-box
|
||||
(searchOutput)="search.next($event)"
|
||||
(filtersOutput)="filters.next($event)" />
|
||||
<div class="results-box"
|
||||
(scroll)="onResultsScroll($event)">
|
||||
@for (result of results; track $index) {
|
||||
<media-search-item class="result-item"
|
||||
[media]="result" />
|
||||
}
|
||||
@if (searchError() != null) {
|
||||
<p class="results-error">
|
||||
<img src="/icons/error_icon.svg"
|
||||
alt="error icon"
|
||||
class="filter-error" />
|
||||
{{searchError()}}
|
||||
</p>
|
||||
}
|
||||
@if (endOfResults()) {
|
||||
<div class="results-end">
|
||||
<img src="/icons/warning_icon.svg"
|
||||
alt="warning icon"
|
||||
class="filter-warning" />
|
||||
No more results returned from the provider.
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
</div>
|
@ -0,0 +1,23 @@
|
||||
import { ComponentFixture, TestBed } from '@angular/core/testing';
|
||||
|
||||
import { AddNewPageComponent } from './add-new-page.component';
|
||||
|
||||
describe('AddNewPageComponent', () => {
|
||||
let component: AddNewPageComponent;
|
||||
let fixture: ComponentFixture<AddNewPageComponent>;
|
||||
|
||||
beforeEach(async () => {
|
||||
await TestBed.configureTestingModule({
|
||||
imports: [AddNewPageComponent]
|
||||
})
|
||||
.compileComponents();
|
||||
|
||||
fixture = TestBed.createComponent(AddNewPageComponent);
|
||||
component = fixture.componentInstance;
|
||||
fixture.detectChanges();
|
||||
});
|
||||
|
||||
it('should create', () => {
|
||||
expect(component).toBeTruthy();
|
||||
});
|
||||
});
|
@ -0,0 +1,139 @@
|
||||
import { Component, inject, NgZone, OnDestroy, signal } from '@angular/core';
|
||||
import { AuthService } from '../../services/auth/auth.service';
|
||||
import { ReactiveFormsModule } from '@angular/forms';
|
||||
import { BehaviorSubject, combineLatest, distinctUntilChanged, filter, scan, Subscription, tap, throttleTime } from 'rxjs';
|
||||
import { HttpClient, HttpErrorResponse } from '@angular/common/http';
|
||||
import { RedirectionService } from '../../services/redirection.service';
|
||||
import { BookSearchResultDto } from '../../shared/dto/book-search-result.dto';
|
||||
import { MediaSearchItemComponent } from '../media-search-item/media-search-item.component';
|
||||
import { SearchBoxComponent } from "../search-box/search-box.component";
|
||||
import { SearchContextDto } from '../../shared/dto/search-context.dto';
|
||||
|
||||
@Component({
|
||||
selector: 'add-new-page',
|
||||
standalone: true,
|
||||
imports: [
|
||||
MediaSearchItemComponent,
|
||||
ReactiveFormsModule,
|
||||
SearchBoxComponent
|
||||
],
|
||||
templateUrl: './add-new-page.component.html',
|
||||
styleUrl: './add-new-page.component.css'
|
||||
})
|
||||
export class AddNewPageComponent implements OnDestroy {
|
||||
private readonly _auth = inject(AuthService);
|
||||
private readonly _http = inject(HttpClient);
|
||||
private readonly _redirect = inject(RedirectionService);
|
||||
private readonly _subscriptions: Subscription[] = [];
|
||||
private readonly _zone = inject(NgZone);
|
||||
|
||||
search = new BehaviorSubject<string>('');
|
||||
filters = new BehaviorSubject<SearchContextDto>(new SearchContextDto());
|
||||
page = new BehaviorSubject<number>(0);
|
||||
results: BookSearchResultDto[] = [];
|
||||
resultsPerPage = signal<number>(10);
|
||||
endOfResults = signal<boolean>(false);
|
||||
searchError = signal<string | null>(null);
|
||||
|
||||
constructor() {
|
||||
this._zone.runOutsideAngular(() =>
|
||||
// Subscription for the search bar.
|
||||
this._subscriptions.push(
|
||||
combineLatest({
|
||||
search: this.search.pipe(
|
||||
filter(value => value != null),
|
||||
),
|
||||
filters: this.filters,
|
||||
page: this.page.pipe(
|
||||
throttleTime(1500, undefined, { leading: true, trailing: true }),
|
||||
),
|
||||
}).pipe(
|
||||
filter(entry => entry.search!.length > 1),
|
||||
throttleTime(1000, undefined, { leading: false, trailing: true }),
|
||||
scan((acc, next) => {
|
||||
// New searches means resetting to page 0.
|
||||
if (acc.search != next.search) {
|
||||
this.results = [];
|
||||
return {
|
||||
...next,
|
||||
page: 0,
|
||||
};
|
||||
}
|
||||
|
||||
// Keep searching the same page until error stops.
|
||||
if (this.searchError() != null) {
|
||||
return acc;
|
||||
}
|
||||
|
||||
// Ignore further searching on the same search term.
|
||||
if (this.endOfResults()) {
|
||||
return {
|
||||
...next,
|
||||
page: -1,
|
||||
};
|
||||
}
|
||||
|
||||
// Next page.
|
||||
return {
|
||||
...next,
|
||||
page: Math.min(acc.page + 1, next.page),
|
||||
};
|
||||
}),
|
||||
distinctUntilChanged(),
|
||||
filter(entry => entry.page >= 0),
|
||||
tap(_ => this.endOfResults.set(false)),
|
||||
).subscribe((entry) => {
|
||||
this._http.get('/api/providers/search',
|
||||
{
|
||||
params: {
|
||||
...this.filters.value.values,
|
||||
provider: 'google',
|
||||
search: entry.search!,
|
||||
startIndex: entry.page * this.resultsPerPage(),
|
||||
}
|
||||
}
|
||||
).subscribe({
|
||||
next: (results: any) => {
|
||||
[].push.apply(this.results, results);
|
||||
|
||||
if (results.length < this.resultsPerPage()) {
|
||||
this.endOfResults.set(true);
|
||||
}
|
||||
},
|
||||
error: (err) => {
|
||||
if (err instanceof HttpErrorResponse) {
|
||||
if (err.status == 400) {
|
||||
this.searchError.set('Something went wrong when Google received the request.');
|
||||
} else if (err.status == 401) {
|
||||
this.searchError.set('Unauthorized. Refresh the page to login again.');
|
||||
} else if (err.status == 429) {
|
||||
this.searchError.set('Too many requests. Try again in a minute.');
|
||||
} else {
|
||||
this.searchError.set(err.name + ': ' + err.message);
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
})
|
||||
)
|
||||
);
|
||||
}
|
||||
|
||||
ngOnDestroy(): void {
|
||||
this._subscriptions.forEach(s => s.unsubscribe());
|
||||
}
|
||||
|
||||
onResultsScroll(event: any): void {
|
||||
const scroll = event.target;
|
||||
const limit = scroll.scrollHeight - scroll.clientHeight;
|
||||
|
||||
// Prevent page changes when:
|
||||
// - new search is happening (emptying results);
|
||||
// - still scrolling through current content.
|
||||
if (scroll.scrollTop == 0 || scroll.scrollTop < limit - 25) {
|
||||
return;
|
||||
}
|
||||
|
||||
this.page.next(this.page.getValue() + 1);
|
||||
}
|
||||
}
|
12
frontend/angular-seshat/src/app/library/library.module.ts
Normal file
12
frontend/angular-seshat/src/app/library/library.module.ts
Normal file
@ -0,0 +1,12 @@
|
||||
import { NgModule } from '@angular/core';
|
||||
import { CommonModule } from '@angular/common';
|
||||
|
||||
|
||||
|
||||
@NgModule({
|
||||
declarations: [],
|
||||
imports: [
|
||||
CommonModule
|
||||
]
|
||||
})
|
||||
export class LibraryModule { }
|
@ -0,0 +1,43 @@
|
||||
.result-item {
|
||||
background-color: #EEE;
|
||||
padding: 10px;
|
||||
border-radius: 15px;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
}
|
||||
|
||||
.result-info {
|
||||
margin-left: 10px;
|
||||
}
|
||||
|
||||
.title {
|
||||
display: inline;
|
||||
}
|
||||
|
||||
.volume {
|
||||
background-color: hsl(0, 0%, 84%);
|
||||
display: inline;
|
||||
margin-left: 10px;
|
||||
padding: 3px;
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
.tags {
|
||||
display: inline-flex;
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
|
||||
.tag {
|
||||
padding: 0 5px;
|
||||
margin: 0 3px;
|
||||
background-color: rgb(199, 199, 199);
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
.body {
|
||||
margin: 5px 10px;
|
||||
}
|
||||
|
||||
.footer {
|
||||
text-align: right;
|
||||
}
|
@ -0,0 +1,18 @@
|
||||
<div class="result-item">
|
||||
<img class="result-image" [src]="media().thumbnail" />
|
||||
<div class="result-info">
|
||||
<div class="header">
|
||||
<h2 class="title">{{media().title}}</h2>
|
||||
@if (media().volume != null) {
|
||||
<label class="volume">volume {{media().volume}}</label>
|
||||
}
|
||||
</div>
|
||||
<div class="subheader tags">
|
||||
@for (tag of tags(); track $index) {
|
||||
<label class="tag">{{tag}}</label>
|
||||
}
|
||||
</div>
|
||||
<p class="body description">{{media().desc}}</p>
|
||||
<p class="footer">Metadata provided by {{provider()}}</p>
|
||||
</div>
|
||||
</div>
|
@ -0,0 +1,23 @@
|
||||
import { ComponentFixture, TestBed } from '@angular/core/testing';
|
||||
|
||||
import { MediaSearchItemComponent } from './media-search-item.component';
|
||||
|
||||
describe('MediaSearchItemComponent', () => {
|
||||
let component: MediaSearchItemComponent;
|
||||
let fixture: ComponentFixture<MediaSearchItemComponent>;
|
||||
|
||||
beforeEach(async () => {
|
||||
await TestBed.configureTestingModule({
|
||||
imports: [MediaSearchItemComponent]
|
||||
})
|
||||
.compileComponents();
|
||||
|
||||
fixture = TestBed.createComponent(MediaSearchItemComponent);
|
||||
component = fixture.componentInstance;
|
||||
fixture.detectChanges();
|
||||
});
|
||||
|
||||
it('should create', () => {
|
||||
expect(component).toBeTruthy();
|
||||
});
|
||||
});
|
@ -0,0 +1,39 @@
|
||||
import { Component, computed, input } from '@angular/core';
|
||||
import { BookSearchResultDto } from '../../shared/dto/book-search-result.dto';
|
||||
|
||||
@Component({
|
||||
selector: 'media-search-item',
|
||||
standalone: true,
|
||||
imports: [],
|
||||
templateUrl: './media-search-item.component.html',
|
||||
styleUrl: './media-search-item.component.css'
|
||||
})
|
||||
export class MediaSearchItemComponent {
|
||||
media = input.required<BookSearchResultDto>();
|
||||
|
||||
tags = computed(() => {
|
||||
const tags = [];
|
||||
if (this.media().language)
|
||||
tags.push(this.media().language);
|
||||
if (this.media().publisher)
|
||||
tags.push(this.media().publisher);
|
||||
if (this.media().categories)
|
||||
tags.push.apply(tags, this.media().categories);
|
||||
if (this.media().maturityRating.replaceAll('_', ' '))
|
||||
tags.push(this.media().maturityRating);
|
||||
if (this.media().publishedAt) {
|
||||
tags.push(new Date(this.media().publishedAt).getFullYear());
|
||||
}
|
||||
return tags;
|
||||
});
|
||||
|
||||
provider = computed(() => {
|
||||
const value = this.media().provider;
|
||||
return value.split(' ')
|
||||
.map(s => s[0].toUpperCase() + s.substring(1))
|
||||
.join(' ')
|
||||
.split('-')
|
||||
.map(s => s[0].toUpperCase() + s.substring(1))
|
||||
.join('-');
|
||||
});
|
||||
}
|
@ -0,0 +1,102 @@
|
||||
.search-content {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
height: 100vh;
|
||||
}
|
||||
|
||||
.search-bar {
|
||||
display: flex;
|
||||
padding: 20px;
|
||||
flex-direction: row;
|
||||
width: calc(100% - 40px);
|
||||
}
|
||||
|
||||
.left-side,
|
||||
.center-side,
|
||||
.right-side {
|
||||
align-content: center;
|
||||
height: 40px;
|
||||
border-top: 1px;
|
||||
border-bottom: 1px;
|
||||
border: 1px gray solid;
|
||||
}
|
||||
|
||||
.icon-wrapper {
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
}
|
||||
|
||||
.left-side {
|
||||
border: 1px gray solid;
|
||||
border-right: 0;
|
||||
border-radius: 3px 0 0 3px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.center-side {
|
||||
flex-grow: 1;
|
||||
}
|
||||
|
||||
.right-side {
|
||||
border: 1px gray solid;
|
||||
border-left: 0;
|
||||
border-radius: 0 3px 3px 0;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.search-box {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
input {
|
||||
flex-grow: 1;
|
||||
outline: none;
|
||||
font-size: 20px;
|
||||
border: 0;
|
||||
padding: 0 15px;
|
||||
}
|
||||
|
||||
input:focus {
|
||||
box-sizing: border-box;
|
||||
box-shadow: 0 0 4px 3px rgba(31, 128, 255, 0.5);
|
||||
}
|
||||
|
||||
.icon-button:hover {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.icon-enabled {
|
||||
background-color: rgb(185, 185, 185);
|
||||
}
|
||||
|
||||
.collapsed {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.filters-box {
|
||||
margin: 0 60px 10px;
|
||||
font-size: 15px;
|
||||
}
|
||||
|
||||
.checkbox-wrapper, .select-wrapper, .text-wrapper {
|
||||
display: inline-flex;
|
||||
height: 20px;
|
||||
align-items: center;
|
||||
margin: 10px;
|
||||
}
|
||||
|
||||
.checkbox-wrapper input, .select-wrapper select, .text-wrapper input {
|
||||
display: inline;
|
||||
height: 20px;
|
||||
margin: 5px;
|
||||
}
|
||||
|
||||
.text-wrapper input {
|
||||
font-size: 13px;
|
||||
outline: 1px solid;
|
||||
}
|
||||
|
||||
.checkbox-wrapper label, .select-wrapper label, .text-wrapper label {
|
||||
display: inline;
|
||||
white-space: nowrap;
|
||||
}
|
@ -0,0 +1,59 @@
|
||||
<div class="search-bar">
|
||||
<div class="icon-wrapper left-side">
|
||||
<img src="/icons/search_icon.svg"
|
||||
alt="search icon" />
|
||||
</div>
|
||||
<div class="icon-wrapper icon-button left-side"
|
||||
[class.icon-enabled]="filtersEnabled.value">
|
||||
<img src="/icons/category_search_icon.svg"
|
||||
alt="advanced search icon"
|
||||
(click)="filtersEnabled.setValue(!filtersEnabled.value)" />
|
||||
</div>
|
||||
<div class="search-box center-side">
|
||||
<input type="text"
|
||||
placeholder="eg. Lord of the Rings"
|
||||
[formControl]="search" />
|
||||
</div>
|
||||
<div class="icon-wrapper icon-button right-side">
|
||||
<img src="/icons/close_icon.svg"
|
||||
alt="clear text button"
|
||||
(click)="search.setValue('')" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="filters-box"
|
||||
[class.collapsed]="!filtersEnabled.value">
|
||||
<div class="select-wrapper">
|
||||
<label for="languageSelect">Language</label>
|
||||
<select name="languageSelect"
|
||||
(change)="updateFilters('langRestrict', $event.target)">
|
||||
<option value="">All</option>
|
||||
@for (language of provider.languages | keyvalue; track language.key) {
|
||||
<option [value]="language.key">{{language.value}}</option>
|
||||
}
|
||||
</select>
|
||||
</div>
|
||||
<div class="select-wrapper">
|
||||
<label for="orderBySelect">Order By</label>
|
||||
<select name="orderBySelect"
|
||||
(change)="updateFilters('orderBy', $event.target)">
|
||||
<option value="relevance">Relevance</option>
|
||||
<option value="newest">Newest</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="select-wrapper">
|
||||
<label for="resultsSizeSelect">Results Size</label>
|
||||
<select name="resultsSizeSelect"
|
||||
(change)="updateFilters('maxResults', $event.target)">
|
||||
<option value="10">10</option>
|
||||
<option value="20">20</option>
|
||||
<option value="30">30</option>
|
||||
<option value="40">40</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="text-wrapper">
|
||||
<label for="resultsSizeSelect">ISBN</label>
|
||||
<input type="text"
|
||||
placeholder="ISBN-10 or ISBN-13"
|
||||
[formControl]="isbn" />
|
||||
</div>
|
||||
</div>
|
@ -0,0 +1,23 @@
|
||||
import { ComponentFixture, TestBed } from '@angular/core/testing';
|
||||
|
||||
import { SearchBoxComponent } from './search-box.component';
|
||||
|
||||
describe('SearchBoxComponent', () => {
|
||||
let component: SearchBoxComponent;
|
||||
let fixture: ComponentFixture<SearchBoxComponent>;
|
||||
|
||||
beforeEach(async () => {
|
||||
await TestBed.configureTestingModule({
|
||||
imports: [SearchBoxComponent]
|
||||
})
|
||||
.compileComponents();
|
||||
|
||||
fixture = TestBed.createComponent(SearchBoxComponent);
|
||||
component = fixture.componentInstance;
|
||||
fixture.detectChanges();
|
||||
});
|
||||
|
||||
it('should create', () => {
|
||||
expect(component).toBeTruthy();
|
||||
});
|
||||
});
|
@ -0,0 +1,65 @@
|
||||
import { Component, inject, NgZone, OnDestroy, output } from '@angular/core';
|
||||
import { FormControl, ReactiveFormsModule } from '@angular/forms';
|
||||
import { SearchContextDto } from '../../shared/dto/search-context.dto';
|
||||
import { filter, Subscription } from 'rxjs';
|
||||
import { ConfigService } from '../../services/config.service';
|
||||
import { CommonModule } from '@angular/common';
|
||||
|
||||
@Component({
|
||||
selector: 'search-box',
|
||||
standalone: true,
|
||||
imports: [
|
||||
CommonModule,
|
||||
ReactiveFormsModule,
|
||||
],
|
||||
templateUrl: './search-box.component.html',
|
||||
styleUrl: './search-box.component.css'
|
||||
})
|
||||
export class SearchBoxComponent implements OnDestroy {
|
||||
private readonly _subscriptions: Subscription[] = [];
|
||||
private readonly _zone = inject(NgZone);
|
||||
|
||||
config = inject(ConfigService).config;
|
||||
filtersEnabled = new FormControl<boolean>(false);
|
||||
search = new FormControl<string>('');
|
||||
searchOutput = output<string>();
|
||||
filters = new SearchContextDto();
|
||||
filtersOutput = output<SearchContextDto>();
|
||||
isbn = new FormControl<string>('');
|
||||
|
||||
constructor() {
|
||||
this._zone.runOutsideAngular(() => {
|
||||
this._subscriptions.push(
|
||||
this.search.valueChanges.pipe(
|
||||
filter(value => value != null),
|
||||
).subscribe((value) => this.searchOutput.emit(value!))
|
||||
);
|
||||
|
||||
this._subscriptions.push(
|
||||
this.isbn.valueChanges.pipe(
|
||||
filter(value => value != null),
|
||||
).subscribe((value) => this.updateFilters('isbn', { value: value }))
|
||||
)
|
||||
});
|
||||
}
|
||||
|
||||
get provider() {
|
||||
switch (this.config.providers.default) {
|
||||
case 'google': return this.config.providers.google;
|
||||
default: return this.config.providers.google;
|
||||
}
|
||||
}
|
||||
|
||||
updateFilters(key: string, value: any) {
|
||||
if (key == 'langRestrict' && value == '') {
|
||||
delete this.filters.values[key];
|
||||
} else {
|
||||
this.filters.values[key] = value.value;
|
||||
}
|
||||
this.filtersOutput.emit(this.filters);
|
||||
}
|
||||
|
||||
ngOnDestroy(): void {
|
||||
this._subscriptions.forEach(s => s.unsubscribe());
|
||||
}
|
||||
}
|
@ -0,0 +1,111 @@
|
||||
* {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.form {
|
||||
width: 500px;
|
||||
height: 100%;
|
||||
border: black solid 2px;
|
||||
border-radius: 15px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
text-align: center;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
h1 {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.messages {
|
||||
width: 100%;
|
||||
display: block;
|
||||
text-align: center;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
input {
|
||||
border: none;
|
||||
background-color: transparent;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
input:focus {
|
||||
outline: none;
|
||||
}
|
||||
|
||||
.input-wrapper {
|
||||
margin: 20px;
|
||||
padding: 5px;
|
||||
border: gray solid 1px;
|
||||
border-radius: 15px;
|
||||
background-color: white;
|
||||
display: block;
|
||||
width: 400px;
|
||||
height: 50px;
|
||||
}
|
||||
|
||||
.input-wrapper:focus {
|
||||
outline: 5px solid blue;
|
||||
}
|
||||
|
||||
.checkbox-wrapper {
|
||||
display: inline-flex;
|
||||
height: 20px;
|
||||
align-items: center;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.checkbox-wrapper input {
|
||||
display: inline;
|
||||
height: 20px;
|
||||
padding: 5px;
|
||||
margin: 5px;
|
||||
}
|
||||
|
||||
.checkbox-wrapper label {
|
||||
display: inline;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.actions {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
button {
|
||||
width: calc(100% - 30px);
|
||||
height: 50px;
|
||||
margin: 10px auto;
|
||||
border: 1px gray solid;
|
||||
border-radius: 15px;
|
||||
display: block;
|
||||
background-color: white;
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
button:hover {
|
||||
background-color: #FAFAFA;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
button:disabled {
|
||||
background-color: white;
|
||||
cursor: auto;
|
||||
}
|
||||
|
||||
.register-link {
|
||||
margin: 10px 0;
|
||||
}
|
||||
|
||||
.register-link a {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.register-link a:hover {
|
||||
text-decoration: underline;
|
||||
}
|
@ -0,0 +1,38 @@
|
||||
<div class="form">
|
||||
<h1>Login</h1>
|
||||
<div class="messages">
|
||||
<notice [message]="errorMessage"
|
||||
[level]="'error'"
|
||||
[visible]="errorMessage.length > 0" />
|
||||
</div>
|
||||
<div class="fields">
|
||||
<div class="input-wrapper">
|
||||
<input type="text"
|
||||
placeholder="Username"
|
||||
[formControl]="username" />
|
||||
</div>
|
||||
<div class="input-wrapper">
|
||||
<input type="password"
|
||||
placeholder="Password"
|
||||
[formControl]="password" />
|
||||
</div>
|
||||
<div class="checkbox-wrapper">
|
||||
<input type="checkbox"
|
||||
id="rememberme"
|
||||
[formControl]="rememberMe">
|
||||
<label for="rememberme">Remember me?</label>
|
||||
</div>
|
||||
</div>
|
||||
<div class="actions">
|
||||
<button type="submit"
|
||||
(click)="login()"
|
||||
[disabled]="!forms.valid || waitForResponse">Login</button>
|
||||
</div>
|
||||
@if (config.features.registration) {
|
||||
<div class="register-link">
|
||||
Don't have an account?
|
||||
<a href="/register"
|
||||
(click)="register($event)">Register here.</a>
|
||||
</div>
|
||||
}
|
||||
</div>
|
@ -0,0 +1,23 @@
|
||||
import { ComponentFixture, TestBed } from '@angular/core/testing';
|
||||
|
||||
import { LoginFormComponent } from './login-form.component';
|
||||
|
||||
describe('LoginFormComponent', () => {
|
||||
let component: LoginFormComponent;
|
||||
let fixture: ComponentFixture<LoginFormComponent>;
|
||||
|
||||
beforeEach(async () => {
|
||||
await TestBed.configureTestingModule({
|
||||
imports: [LoginFormComponent]
|
||||
})
|
||||
.compileComponents();
|
||||
|
||||
fixture = TestBed.createComponent(LoginFormComponent);
|
||||
component = fixture.componentInstance;
|
||||
fixture.detectChanges();
|
||||
});
|
||||
|
||||
it('should create', () => {
|
||||
expect(component).toBeTruthy();
|
||||
});
|
||||
});
|
@ -0,0 +1,81 @@
|
||||
import { HttpClient } from '@angular/common/http';
|
||||
import { Component, inject } from '@angular/core';
|
||||
import { FormControl, FormGroup, ReactiveFormsModule, Validators } from '@angular/forms';
|
||||
import { NoticeComponent } from "../../shared/notice/notice.component";
|
||||
import { Router } from '@angular/router';
|
||||
import { ConfigService } from '../../services/config.service';
|
||||
import { AuthService } from '../../services/auth/auth.service';
|
||||
import { LoadingService } from '../../services/loading.service';
|
||||
import { RedirectionService } from '../../services/redirection.service';
|
||||
|
||||
@Component({
|
||||
selector: 'login-form',
|
||||
standalone: true,
|
||||
imports: [
|
||||
ReactiveFormsModule,
|
||||
NoticeComponent
|
||||
],
|
||||
templateUrl: './login-form.component.html',
|
||||
styleUrl: './login-form.component.css'
|
||||
})
|
||||
export class LoginFormComponent {
|
||||
private readonly _auth = inject(AuthService);
|
||||
private readonly _loading = inject(LoadingService);
|
||||
private readonly _http = inject(HttpClient);
|
||||
private readonly _redirect = inject(RedirectionService);
|
||||
private readonly _router = inject(Router);
|
||||
readonly config = inject(ConfigService).config;
|
||||
|
||||
readonly username = new FormControl('', [Validators.required]);
|
||||
readonly password = new FormControl('', [Validators.required]);
|
||||
readonly rememberMe = new FormControl(false);
|
||||
readonly forms = new FormGroup({
|
||||
username: this.username,
|
||||
password: this.password,
|
||||
});
|
||||
|
||||
waitForResponse: boolean = false;
|
||||
errorMessage: string = '';
|
||||
|
||||
login() {
|
||||
if (this.waitForResponse) {
|
||||
return;
|
||||
}
|
||||
|
||||
this.waitForResponse = true;
|
||||
this.errorMessage = '';
|
||||
if (!this.forms.valid) {
|
||||
this.waitForResponse = false;
|
||||
return;
|
||||
}
|
||||
|
||||
this._http.post('/api/auth/login', {
|
||||
user_login: this.username.value,
|
||||
password: this.password.value,
|
||||
remember_me: this.rememberMe.value,
|
||||
}).subscribe({
|
||||
next: async (response: any) => {
|
||||
this._auth.update(true)
|
||||
.subscribe(async () => await this._redirect.redirect(null));
|
||||
},
|
||||
error: (err) => this.handleLoginErrors(err),
|
||||
complete: () => this.waitForResponse = false
|
||||
});
|
||||
}
|
||||
|
||||
handleLoginErrors(err: any) {
|
||||
if (err.status == 400 || err.status == 401) {
|
||||
this.errorMessage = 'Invalid credentials.';
|
||||
} else if (err.status == 403) {
|
||||
this.errorMessage = 'Something went wrong.';
|
||||
} else {
|
||||
this.errorMessage = 'Something went wrong: ' + err.error.statusCode + ' ' + err.error.message;
|
||||
}
|
||||
this.waitForResponse = false;
|
||||
}
|
||||
|
||||
async register(event: any) {
|
||||
event.preventDefault();
|
||||
await this._router.navigate(['register']);
|
||||
}
|
||||
}
|
10
frontend/angular-seshat/src/app/login/login.module.ts
Normal file
10
frontend/angular-seshat/src/app/login/login.module.ts
Normal file
@ -0,0 +1,10 @@
|
||||
import { NgModule } from '@angular/core';
|
||||
|
||||
|
||||
@NgModule({
|
||||
declarations: [],
|
||||
imports: [
|
||||
],
|
||||
providers: []
|
||||
})
|
||||
export class LoginModule { }
|
@ -0,0 +1,101 @@
|
||||
* {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.form {
|
||||
width: 500px;
|
||||
height: 100%;
|
||||
border: black solid 2px;
|
||||
border-radius: 15px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
text-align: center;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
h1 {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.messages {
|
||||
width: 100%;
|
||||
display: block;
|
||||
text-align: center;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
input {
|
||||
border: none;
|
||||
background-color: transparent;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
input:focus {
|
||||
outline: none;
|
||||
}
|
||||
|
||||
.input-wrapper {
|
||||
margin: 20px;
|
||||
padding: 5px;
|
||||
border: gray solid 1px;
|
||||
border-radius: 15px;
|
||||
background-color: white;
|
||||
display: block;
|
||||
width: 400px;
|
||||
height: 50px;
|
||||
}
|
||||
|
||||
.input-wrapper:focus {
|
||||
outline: 5px solid blue;
|
||||
}
|
||||
|
||||
.actions {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
button {
|
||||
width: calc(100% - 30px);
|
||||
height: 50px;
|
||||
margin: 10px auto;
|
||||
border: 1px gray solid;
|
||||
border-radius: 15px;
|
||||
display: block;
|
||||
background-color: white;
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
button:hover {
|
||||
background-color: #FAFAFA;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
button:disabled {
|
||||
background-color: white;
|
||||
cursor: auto;
|
||||
}
|
||||
|
||||
.register-link {
|
||||
margin: 10px 0;
|
||||
}
|
||||
|
||||
.register-link a {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.register-link a:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
.disabled {
|
||||
color: red;
|
||||
}
|
||||
|
||||
.center {
|
||||
font-size: 16;
|
||||
text-align: center;
|
||||
}
|
@ -0,0 +1,45 @@
|
||||
@if (config.features.registration) {
|
||||
<div class="form">
|
||||
<h1>Register</h1>
|
||||
<div class="messages">
|
||||
<notice [message]="errorMessage"
|
||||
[level]="'error'"
|
||||
[visible]="errorMessage.length > 0" />
|
||||
</div>
|
||||
<div class="fields">
|
||||
<div class="input-wrapper">
|
||||
<input type="text"
|
||||
placeholder="Name"
|
||||
[formControl]="name" />
|
||||
</div>
|
||||
<div class="input-wrapper">
|
||||
<input type="text"
|
||||
placeholder="Username"
|
||||
[formControl]="username" />
|
||||
</div>
|
||||
<div class="input-wrapper">
|
||||
<input type="password"
|
||||
placeholder="Password"
|
||||
[formControl]="password" />
|
||||
</div>
|
||||
<div class="input-wrapper">
|
||||
<input type="password"
|
||||
placeholder="Password Confirm"
|
||||
[formControl]="passwordConfirmation" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="actions">
|
||||
<button type="submit"
|
||||
(click)="register()"
|
||||
[disabled]="!forms.valid || waitForResponse">Register</button>
|
||||
</div>
|
||||
<div class="register-link">
|
||||
Already have an account?
|
||||
<a href="/login"
|
||||
(click)="login($event)">Login here.</a>
|
||||
</div>
|
||||
</div>
|
||||
} @else {
|
||||
<p class="center disabled">Registrations have been disabled.</p>
|
||||
<p class="center">You will be redirected to login in 3 seconds.</p>
|
||||
}
|
@ -0,0 +1,23 @@
|
||||
import { ComponentFixture, TestBed } from '@angular/core/testing';
|
||||
|
||||
import { RegisterFormComponent } from './register-form.component';
|
||||
|
||||
describe('RegisterFormComponent', () => {
|
||||
let component: RegisterFormComponent;
|
||||
let fixture: ComponentFixture<RegisterFormComponent>;
|
||||
|
||||
beforeEach(async () => {
|
||||
await TestBed.configureTestingModule({
|
||||
imports: [RegisterFormComponent]
|
||||
})
|
||||
.compileComponents();
|
||||
|
||||
fixture = TestBed.createComponent(RegisterFormComponent);
|
||||
component = fixture.componentInstance;
|
||||
fixture.detectChanges();
|
||||
});
|
||||
|
||||
it('should create', () => {
|
||||
expect(component).toBeTruthy();
|
||||
});
|
||||
});
|
@ -0,0 +1,92 @@
|
||||
import { HttpClient } from '@angular/common/http';
|
||||
import { Component, inject, OnInit } from '@angular/core';
|
||||
import { FormControl, FormGroup, ReactiveFormsModule, Validators } from '@angular/forms';
|
||||
import { NoticeComponent } from "../../shared/notice/notice.component";
|
||||
import { Router } from '@angular/router';
|
||||
import { ConfigService } from '../../services/config.service';
|
||||
import { AuthService } from '../../services/auth/auth.service';
|
||||
import { LoadingService } from '../../services/loading.service';
|
||||
import { RedirectionService } from '../../services/redirection.service';
|
||||
|
||||
@Component({
|
||||
selector: 'register-form',
|
||||
standalone: true,
|
||||
imports: [
|
||||
NoticeComponent,
|
||||
ReactiveFormsModule,
|
||||
],
|
||||
templateUrl: './register-form.component.html',
|
||||
styleUrl: './register-form.component.css'
|
||||
})
|
||||
export class RegisterFormComponent implements OnInit {
|
||||
private readonly _auth = inject(AuthService);
|
||||
private readonly _loading = inject(LoadingService);
|
||||
private readonly _http = inject(HttpClient);
|
||||
private readonly _redirect = inject(RedirectionService);
|
||||
private readonly _router = inject(Router);
|
||||
readonly config = inject(ConfigService).config;
|
||||
|
||||
readonly name = new FormControl('', [Validators.required]);
|
||||
readonly username = new FormControl('', [Validators.required]);
|
||||
readonly password = new FormControl('', [Validators.required]);
|
||||
readonly passwordConfirmation = new FormControl('', [Validators.required]);
|
||||
readonly forms = new FormGroup({
|
||||
name: this.name,
|
||||
username: this.username,
|
||||
password: this.password,
|
||||
passwordConfirmation: this.passwordConfirmation
|
||||
});
|
||||
|
||||
waitForResponse: boolean = false;
|
||||
errorMessage: string = '';
|
||||
|
||||
ngOnInit(): void {
|
||||
}
|
||||
|
||||
register() {
|
||||
if (this.waitForResponse) {
|
||||
return;
|
||||
}
|
||||
|
||||
this.waitForResponse = true;
|
||||
this.errorMessage = '';
|
||||
if (!this.forms.valid) {
|
||||
this.waitForResponse = false;
|
||||
return;
|
||||
}
|
||||
|
||||
if (this.password.value != this.passwordConfirmation.value) {
|
||||
this.errorMessage = 'Password confirmation does not match original password.';
|
||||
return;
|
||||
}
|
||||
|
||||
this._http.post('/api/auth/register', {
|
||||
user_login: this.name.value,
|
||||
user_name: this.username.value,
|
||||
password: this.password.value,
|
||||
}).subscribe({
|
||||
next: async (response: any) => {
|
||||
this._auth.update(true)
|
||||
.subscribe(async () => await this._redirect.redirect(null));
|
||||
},
|
||||
error: (err) => this.handleRegistrationErrors(err),
|
||||
complete: () => this.waitForResponse = false
|
||||
});
|
||||
}
|
||||
|
||||
handleRegistrationErrors(err: any) {
|
||||
if (err.status == 401) {
|
||||
this.errorMessage = 'Invalid credentials.';
|
||||
} else if (err.status == 400 || err.status == 403) {
|
||||
this.errorMessage = 'Something went wrong.';
|
||||
} else {
|
||||
this.errorMessage = 'Something went wrong: ' + err.error.statusCode + ' ' + err.error.message;
|
||||
}
|
||||
this.waitForResponse = false;
|
||||
}
|
||||
|
||||
async login(event: any) {
|
||||
event.preventDefault();
|
||||
await this._router.navigate(['login']);
|
||||
}
|
||||
}
|
12
frontend/angular-seshat/src/app/register/register.module.ts
Normal file
12
frontend/angular-seshat/src/app/register/register.module.ts
Normal file
@ -0,0 +1,12 @@
|
||||
import { NgModule } from '@angular/core';
|
||||
import { CommonModule } from '@angular/common';
|
||||
|
||||
|
||||
|
||||
@NgModule({
|
||||
declarations: [],
|
||||
imports: [
|
||||
CommonModule
|
||||
]
|
||||
})
|
||||
export class RegisterModule { }
|
@ -0,0 +1,16 @@
|
||||
import { TestBed } from '@angular/core/testing';
|
||||
|
||||
import { AuthService } from './auth.service';
|
||||
|
||||
describe('AuthService', () => {
|
||||
let service: AuthService;
|
||||
|
||||
beforeEach(() => {
|
||||
TestBed.configureTestingModule({});
|
||||
service = TestBed.inject(AuthService);
|
||||
});
|
||||
|
||||
it('should be created', () => {
|
||||
expect(service).toBeTruthy();
|
||||
});
|
||||
});
|
@ -0,0 +1,70 @@
|
||||
import { HttpClient } from '@angular/common/http';
|
||||
import { inject, Injectable } from '@angular/core';
|
||||
import { of } from 'rxjs';
|
||||
|
||||
@Injectable({
|
||||
providedIn: 'root'
|
||||
})
|
||||
export class AuthService {
|
||||
private readonly _http = inject(HttpClient);
|
||||
|
||||
private authenticated = false;
|
||||
private userId: string | null = null;
|
||||
private username: string | null = null;
|
||||
private lastValidationCheck: number = 0;
|
||||
|
||||
|
||||
getUserId() {
|
||||
return this.userId;
|
||||
}
|
||||
|
||||
getUsername() {
|
||||
return this.username;
|
||||
}
|
||||
|
||||
isLoggedIn() {
|
||||
return this.authenticated;
|
||||
}
|
||||
|
||||
renew() {
|
||||
return this._http.patch('/api/auth/login', {});
|
||||
}
|
||||
|
||||
update(force: boolean = false) {
|
||||
if (!force && this.lastValidationCheck && this.lastValidationCheck + 90000 < Date.now()) {
|
||||
return of(this.authenticated);
|
||||
}
|
||||
|
||||
this.lastValidationCheck = Date.now();
|
||||
const observable = this._http.post('/api/auth/validate', {})
|
||||
observable.subscribe({
|
||||
next: (response: any) => {
|
||||
if (response.validation === null) {
|
||||
this.renew().subscribe({
|
||||
next: (res: any) => {
|
||||
this.authenticated = true;
|
||||
this.userId = res.userId;
|
||||
this.username = res.username;
|
||||
},
|
||||
error: (err) => {
|
||||
this.authenticated = false;
|
||||
this.userId = null;
|
||||
this.username = null;
|
||||
}
|
||||
});
|
||||
return;
|
||||
}
|
||||
|
||||
this.authenticated = response.validation;
|
||||
this.userId = response.userId;
|
||||
this.username = response.username;
|
||||
},
|
||||
error: (err) => {
|
||||
this.authenticated = false;
|
||||
this.userId = null;
|
||||
this.username = null;
|
||||
}
|
||||
});
|
||||
return observable;
|
||||
}
|
||||
}
|
@ -0,0 +1,16 @@
|
||||
import { TestBed } from '@angular/core/testing';
|
||||
|
||||
import { ConfigService } from './config.service';
|
||||
|
||||
describe('ConfigService', () => {
|
||||
let service: ConfigService;
|
||||
|
||||
beforeEach(() => {
|
||||
TestBed.configureTestingModule({});
|
||||
service = TestBed.inject(ConfigService);
|
||||
});
|
||||
|
||||
it('should be created', () => {
|
||||
expect(service).toBeTruthy();
|
||||
});
|
||||
});
|
36
frontend/angular-seshat/src/app/services/config.service.ts
Normal file
36
frontend/angular-seshat/src/app/services/config.service.ts
Normal file
@ -0,0 +1,36 @@
|
||||
import { HttpClient } from '@angular/common/http';
|
||||
import { inject, Injectable } from '@angular/core';
|
||||
import { AppConfig } from '../shared/dto/config.dto';
|
||||
import { map, Observable, of } from 'rxjs';
|
||||
|
||||
@Injectable({
|
||||
providedIn: 'root'
|
||||
})
|
||||
export class ConfigService {
|
||||
private readonly _http = inject(HttpClient);
|
||||
|
||||
config: AppConfig = new AppConfig();
|
||||
loaded = false;
|
||||
|
||||
constructor() { }
|
||||
|
||||
fetch(): Observable<any> {
|
||||
if (this.loaded) {
|
||||
return of(this.config);
|
||||
}
|
||||
|
||||
const $ = this._http.get('/api/asset/config').pipe(map((response: any) => response.config));
|
||||
$.subscribe({
|
||||
next: (config: any) => {
|
||||
if (!config) {
|
||||
console.log('Something went wrong with fetching app configuration. Using defaults.');
|
||||
return;
|
||||
}
|
||||
this.config = config;
|
||||
this.loaded = true;
|
||||
},
|
||||
error: (err) => { this.loaded = true; console.log('Something went wrong with fetching app configuration. Using defaults.', err); }
|
||||
});
|
||||
return $;
|
||||
}
|
||||
}
|
@ -0,0 +1,16 @@
|
||||
import { TestBed } from '@angular/core/testing';
|
||||
|
||||
import { LoadingService } from './loading.service';
|
||||
|
||||
describe('LoadingService', () => {
|
||||
let service: LoadingService;
|
||||
|
||||
beforeEach(() => {
|
||||
TestBed.configureTestingModule({});
|
||||
service = TestBed.inject(LoadingService);
|
||||
});
|
||||
|
||||
it('should be created', () => {
|
||||
expect(service).toBeTruthy();
|
||||
});
|
||||
});
|
47
frontend/angular-seshat/src/app/services/loading.service.ts
Normal file
47
frontend/angular-seshat/src/app/services/loading.service.ts
Normal file
@ -0,0 +1,47 @@
|
||||
import { Injectable } from '@angular/core';
|
||||
import { BehaviorSubject, delay, filter, first } from 'rxjs';
|
||||
|
||||
@Injectable({
|
||||
providedIn: 'root'
|
||||
})
|
||||
export class LoadingService {
|
||||
private readonly _subject: BehaviorSubject<boolean> = new BehaviorSubject<boolean>(false);
|
||||
private readonly _status = this._subject.asObservable().pipe(delay(0));
|
||||
private readonly _set: Set<string> = new Set<string>();
|
||||
|
||||
|
||||
listen() {
|
||||
return this._status;
|
||||
}
|
||||
|
||||
listenUntilReady() {
|
||||
return this._status.pipe(
|
||||
filter(status => !status),
|
||||
first(),
|
||||
);
|
||||
}
|
||||
|
||||
/**
|
||||
* Updates the subject based on the following:
|
||||
* - If loading is true, add url to the set & update subject value to true.
|
||||
* - If loading is false, remove url entry and update subject to false if set is empty.
|
||||
* This supports multiple requests awaiting completion.
|
||||
*
|
||||
* @param loading {boolean}
|
||||
* @param url {string}
|
||||
*/
|
||||
set(loading: boolean, url: string): void {
|
||||
if (!url) {
|
||||
throw new Error('URL must be provided.');
|
||||
}
|
||||
if (loading) {
|
||||
this._set.add(url);
|
||||
this._subject.next(true);
|
||||
} else if (this._set.has(url)) {
|
||||
this._set.delete(url);
|
||||
if (this._set.size === 0) {
|
||||
this._subject.next(false);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
@ -0,0 +1,16 @@
|
||||
import { TestBed } from '@angular/core/testing';
|
||||
|
||||
import { RedirectionService } from './redirection.service';
|
||||
|
||||
describe('RedirectionService', () => {
|
||||
let service: RedirectionService;
|
||||
|
||||
beforeEach(() => {
|
||||
TestBed.configureTestingModule({});
|
||||
service = TestBed.inject(RedirectionService);
|
||||
});
|
||||
|
||||
it('should be created', () => {
|
||||
expect(service).toBeTruthy();
|
||||
});
|
||||
});
|
@ -0,0 +1,55 @@
|
||||
import { inject, Injectable } from '@angular/core';
|
||||
import { AuthService } from './auth/auth.service';
|
||||
import { Router } from '@angular/router';
|
||||
|
||||
@Injectable({
|
||||
providedIn: 'root'
|
||||
})
|
||||
export class RedirectionService {
|
||||
private readonly _auth = inject(AuthService);
|
||||
private readonly _router = inject(Router);
|
||||
|
||||
constructor() { }
|
||||
|
||||
async redirect(destination: string | string[] | null) {
|
||||
let uri = this._router.url;
|
||||
if (!this._router.url.startsWith('/') && !this._router.url.startsWith('http')) {
|
||||
uri = '/' + this._router.url;
|
||||
}
|
||||
|
||||
if (await this.handleSpecialCases(uri)) {
|
||||
return;
|
||||
}
|
||||
|
||||
const queryParams = this._router.parseUrl(uri).queryParams;
|
||||
const redirect = queryParams['rd'];
|
||||
if (redirect) {
|
||||
if (!(await this.handleSpecialCases(redirect))) {
|
||||
await this._router.navigateByUrl(redirect);
|
||||
}
|
||||
} else if (typeof destination === 'string') {
|
||||
await this._router.navigateByUrl(destination);
|
||||
} else if (destination !== null) {
|
||||
await this._router.navigate(destination);
|
||||
}
|
||||
}
|
||||
|
||||
private async handleSpecialCases(uri: string): Promise<boolean> {
|
||||
if (this._auth.isLoggedIn()) {
|
||||
if (uri.startsWith('/login') || uri.startsWith('/register')) {
|
||||
await this._router.navigate(['add', 'new']);
|
||||
return true;
|
||||
}
|
||||
} else if (!uri.startsWith('/login') && !uri.startsWith('/register')) {
|
||||
await this._router.navigate(['login'],
|
||||
{
|
||||
queryParams: {
|
||||
rd: uri,
|
||||
}
|
||||
});
|
||||
return true;
|
||||
}
|
||||
|
||||
return false;
|
||||
}
|
||||
}
|
@ -0,0 +1,18 @@
|
||||
export class BookSearchResultDto {
|
||||
providerBookId: string = '';
|
||||
providerSeriesId: string = '';
|
||||
title: string = '';
|
||||
desc: string = '';
|
||||
volume: number|null = null;
|
||||
publisher: string = '';
|
||||
authors: string[] = [];
|
||||
industryIdentifiers: { [key: string]: string } = {};
|
||||
provider: string = '';
|
||||
publishedAt: string = '';
|
||||
language: string = '';
|
||||
mediaType: string | null = null;
|
||||
categories: string[] = [];
|
||||
maturityRating: string = '';
|
||||
thumbnail: string = '';
|
||||
url: string = '';
|
||||
}
|
35
frontend/angular-seshat/src/app/shared/dto/config.dto.ts
Normal file
35
frontend/angular-seshat/src/app/shared/dto/config.dto.ts
Normal file
@ -0,0 +1,35 @@
|
||||
export class AppConfig {
|
||||
features = new FeaturesConfig();
|
||||
providers = new ProvidersConfig();
|
||||
}
|
||||
|
||||
class FeaturesConfig {
|
||||
registration: boolean = false;
|
||||
}
|
||||
|
||||
class ProvidersConfig {
|
||||
default: string = 'google';
|
||||
|
||||
google: GoogleProviderConfig = new GoogleProviderConfig();
|
||||
}
|
||||
|
||||
class GenericProviderConfig {
|
||||
name: string = '';
|
||||
filters: { [key: string]: any } = {};
|
||||
}
|
||||
|
||||
class GoogleProviderConfig extends GenericProviderConfig {
|
||||
override name: string = 'Google';
|
||||
|
||||
// Key represents the language's ISO-639-1 code.
|
||||
// Value is the name of the language.
|
||||
languages: { [key: string]: any } = {
|
||||
'zh': 'Chinese',
|
||||
'nl': 'Dutch',
|
||||
'en': 'English',
|
||||
'fr': 'Francais',
|
||||
'ko': 'Korean',
|
||||
'ja': 'Japanese',
|
||||
'es': 'Spanish',
|
||||
};
|
||||
}
|
@ -0,0 +1,3 @@
|
||||
export class SearchContextDto {
|
||||
values: { [key: string]: string } = {};
|
||||
}
|
@ -0,0 +1,59 @@
|
||||
import { HTTP_INTERCEPTORS, HttpEvent, HttpHandler, HttpInterceptor, HttpRequest, HttpResponse } from "@angular/common/http";
|
||||
import { inject, Injectable } from "@angular/core";
|
||||
import { catchError, map, Observable } from "rxjs";
|
||||
import { LoadingService } from "../../services/loading.service";
|
||||
|
||||
@Injectable()
|
||||
class LoadingHttpInterceptor implements HttpInterceptor {
|
||||
private readonly _loading = inject(LoadingService);
|
||||
private readonly _filters = [
|
||||
{
|
||||
url: '/api/auth/validate',
|
||||
methods: null,
|
||||
},
|
||||
{
|
||||
url: '/api/asset/config',
|
||||
methods: null,
|
||||
},
|
||||
{
|
||||
url: '/api/auth/login',
|
||||
methods: ['PATCH'],
|
||||
}
|
||||
];
|
||||
|
||||
|
||||
intercept(request: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
|
||||
let uri = request.url;
|
||||
if (!request.url.startsWith('/') && !request.url.startsWith('http')) {
|
||||
uri = '/' + request.url;
|
||||
}
|
||||
|
||||
const method = request.method.toUpperCase();
|
||||
if (!this._filters.some(item => uri.startsWith(item.url) && (!item.methods || item.methods.includes(method)))) {
|
||||
return next.handle(request);
|
||||
}
|
||||
|
||||
this._loading.set(true, request.url);
|
||||
return next.handle(request)
|
||||
.pipe(
|
||||
catchError((err) => {
|
||||
this._loading.set(false, request.url);
|
||||
return err;
|
||||
}),
|
||||
map((evt: any) => {
|
||||
if (evt instanceof HttpResponse) {
|
||||
this._loading.set(false, request.url);
|
||||
}
|
||||
return evt;
|
||||
}),
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
export const LoadingInterceptor = [
|
||||
{
|
||||
provide: HTTP_INTERCEPTORS,
|
||||
useClass: LoadingHttpInterceptor,
|
||||
multi: true,
|
||||
}
|
||||
];
|
@ -0,0 +1,86 @@
|
||||
import { HTTP_INTERCEPTORS, HttpErrorResponse, HttpEvent, HttpHandler, HttpInterceptor, HttpRequest } from "@angular/common/http";
|
||||
import { inject, Injectable } from "@angular/core";
|
||||
import { BehaviorSubject, catchError, filter, Observable, switchMap, take, throwError } from "rxjs";
|
||||
import { AuthService } from "../../services/auth/auth.service";
|
||||
|
||||
@Injectable()
|
||||
class TokenValidationHttpInterceptor implements HttpInterceptor {
|
||||
private readonly _auth = inject(AuthService);
|
||||
private readonly _filters: { url: string, methods: string[] | null }[] = [
|
||||
{
|
||||
url: '/api/auth/validate',
|
||||
methods: null,
|
||||
},
|
||||
{
|
||||
url: '/api/asset/config',
|
||||
methods: null,
|
||||
},
|
||||
{
|
||||
url: '/api/auth/login',
|
||||
methods: null,
|
||||
},
|
||||
{
|
||||
url: '/api/auth/register',
|
||||
methods: null,
|
||||
},
|
||||
];
|
||||
|
||||
private _isRefreshing = false;
|
||||
private _refreshSubject = new BehaviorSubject<boolean>(false);
|
||||
|
||||
|
||||
intercept(request: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
|
||||
let uri = request.url;
|
||||
if (!request.url.startsWith('/') && !request.url.startsWith('http')) {
|
||||
uri = '/' + request.url;
|
||||
}
|
||||
|
||||
const method = request.method.toUpperCase();
|
||||
if (this._filters.some(item => uri.startsWith(item.url) && (!item.methods || item.methods.includes(method)))) {
|
||||
return next.handle(request);
|
||||
}
|
||||
|
||||
return next.handle(request)
|
||||
.pipe(
|
||||
catchError((err) => {
|
||||
if (err instanceof HttpErrorResponse && err.status == 401) {
|
||||
return this.handleTokenRenewal(request, next);
|
||||
}
|
||||
return throwError(() => err);
|
||||
}),
|
||||
);
|
||||
}
|
||||
|
||||
private handleTokenRenewal(request: HttpRequest<any>, next: HttpHandler) {
|
||||
if (!this._isRefreshing) {
|
||||
this._isRefreshing = true;
|
||||
this._refreshSubject.next(false);
|
||||
|
||||
return this._auth.renew()
|
||||
.pipe(
|
||||
take(1),
|
||||
switchMap((token: any) => {
|
||||
this._isRefreshing = false;
|
||||
this._refreshSubject.next(true);
|
||||
return next.handle(request.clone())
|
||||
})
|
||||
);
|
||||
}
|
||||
|
||||
return this._refreshSubject.pipe(
|
||||
filter(token => token != null),
|
||||
take(1),
|
||||
switchMap(_ => {
|
||||
return next.handle(request.clone());
|
||||
})
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
export const TokenValidationInterceptor = [
|
||||
{
|
||||
provide: HTTP_INTERCEPTORS,
|
||||
useClass: TokenValidationHttpInterceptor,
|
||||
multi: true,
|
||||
}
|
||||
];
|
@ -0,0 +1,18 @@
|
||||
.info {
|
||||
background-color: #ADD8E6;
|
||||
}
|
||||
|
||||
.warning {
|
||||
background-color: #FFD580;
|
||||
}
|
||||
|
||||
.error {
|
||||
background-color: #FF474C;
|
||||
}
|
||||
|
||||
p {
|
||||
width: 80%;
|
||||
padding: 10px;
|
||||
border-radius: 10px;
|
||||
margin: 10px auto;
|
||||
}
|
@ -0,0 +1,5 @@
|
||||
@if (this.visible()) {
|
||||
<p [class.info]="level() == 'info'"
|
||||
[class.warning]="level() == 'warning'"
|
||||
[class.error]="level() == 'error'">{{this.message()}}</p>
|
||||
}
|
@ -0,0 +1,23 @@
|
||||
import { ComponentFixture, TestBed } from '@angular/core/testing';
|
||||
|
||||
import { NoticeComponent } from './notice.component';
|
||||
|
||||
describe('NoticeComponent', () => {
|
||||
let component: NoticeComponent;
|
||||
let fixture: ComponentFixture<NoticeComponent>;
|
||||
|
||||
beforeEach(async () => {
|
||||
await TestBed.configureTestingModule({
|
||||
imports: [NoticeComponent]
|
||||
})
|
||||
.compileComponents();
|
||||
|
||||
fixture = TestBed.createComponent(NoticeComponent);
|
||||
component = fixture.componentInstance;
|
||||
fixture.detectChanges();
|
||||
});
|
||||
|
||||
it('should create', () => {
|
||||
expect(component).toBeTruthy();
|
||||
});
|
||||
});
|
@ -0,0 +1,14 @@
|
||||
import { Component, input } from '@angular/core';
|
||||
|
||||
@Component({
|
||||
selector: 'notice',
|
||||
standalone: true,
|
||||
imports: [],
|
||||
templateUrl: './notice.component.html',
|
||||
styleUrl: './notice.component.css'
|
||||
})
|
||||
export class NoticeComponent {
|
||||
message = input<string>('');
|
||||
level = input<'info' | 'warning' | 'error'>('info');
|
||||
visible = input<boolean>(this.message.length > 0);
|
||||
}
|
13
frontend/angular-seshat/src/index.html
Normal file
13
frontend/angular-seshat/src/index.html
Normal file
@ -0,0 +1,13 @@
|
||||
<!doctype html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>Seshat</title>
|
||||
<base href="/">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<link rel="icon" type="image/x-icon" href="favicon.ico">
|
||||
</head>
|
||||
<body>
|
||||
<app-root></app-root>
|
||||
</body>
|
||||
</html>
|
7
frontend/angular-seshat/src/main.server.ts
Normal file
7
frontend/angular-seshat/src/main.server.ts
Normal file
@ -0,0 +1,7 @@
|
||||
import { bootstrapApplication } from '@angular/platform-browser';
|
||||
import { AppComponent } from './app/app.component';
|
||||
import { config } from './app/app.config.server';
|
||||
|
||||
const bootstrap = () => bootstrapApplication(AppComponent, config);
|
||||
|
||||
export default bootstrap;
|
6
frontend/angular-seshat/src/main.ts
Normal file
6
frontend/angular-seshat/src/main.ts
Normal file
@ -0,0 +1,6 @@
|
||||
import { bootstrapApplication } from '@angular/platform-browser';
|
||||
import { appConfig } from './app/app.config';
|
||||
import { AppComponent } from './app/app.component';
|
||||
|
||||
bootstrapApplication(AppComponent, appConfig)
|
||||
.catch((err) => console.error(err));
|
8
frontend/angular-seshat/src/proxy.conf.json
Normal file
8
frontend/angular-seshat/src/proxy.conf.json
Normal file
@ -0,0 +1,8 @@
|
||||
{
|
||||
"/api/**": {
|
||||
"target": "http://192.168.2.63:3001",
|
||||
"protocol": "http",
|
||||
"secure": false,
|
||||
"changeOrigin": true
|
||||
}
|
||||
}
|
5
frontend/angular-seshat/src/styles.css
Normal file
5
frontend/angular-seshat/src/styles.css
Normal file
@ -0,0 +1,5 @@
|
||||
/* You can add global styles to this file, and also import other style files */
|
||||
|
||||
body {
|
||||
margin: 0;
|
||||
}
|
19
frontend/angular-seshat/tsconfig.app.json
Normal file
19
frontend/angular-seshat/tsconfig.app.json
Normal file
@ -0,0 +1,19 @@
|
||||
/* To learn more about Typescript configuration file: https://www.typescriptlang.org/docs/handbook/tsconfig-json.html. */
|
||||
/* To learn more about Angular compiler options: https://angular.dev/reference/configs/angular-compiler-options. */
|
||||
{
|
||||
"extends": "./tsconfig.json",
|
||||
"compilerOptions": {
|
||||
"outDir": "./out-tsc/app",
|
||||
"types": [
|
||||
"node"
|
||||
]
|
||||
},
|
||||
"files": [
|
||||
"src/main.ts",
|
||||
"src/main.server.ts",
|
||||
"server.ts"
|
||||
],
|
||||
"include": [
|
||||
"src/**/*.d.ts"
|
||||
]
|
||||
}
|
38
frontend/angular-seshat/tsconfig.json
Normal file
38
frontend/angular-seshat/tsconfig.json
Normal file
@ -0,0 +1,38 @@
|
||||
/* To learn more about Typescript configuration file: https://www.typescriptlang.org/docs/handbook/tsconfig-json.html. */
|
||||
/* To learn more about Angular compiler options: https://angular.dev/reference/configs/angular-compiler-options. */
|
||||
{
|
||||
"compileOnSave": false,
|
||||
"compilerOptions": {
|
||||
"outDir": "./dist/out-tsc",
|
||||
"strict": true,
|
||||
"noImplicitOverride": true,
|
||||
"noPropertyAccessFromIndexSignature": true,
|
||||
"noImplicitReturns": true,
|
||||
"paths": {
|
||||
"library": [
|
||||
"./dist/library"
|
||||
]
|
||||
},
|
||||
"noFallthroughCasesInSwitch": true,
|
||||
"skipLibCheck": true,
|
||||
"esModuleInterop": true,
|
||||
"sourceMap": true,
|
||||
"declaration": false,
|
||||
"experimentalDecorators": true,
|
||||
"moduleResolution": "bundler",
|
||||
"importHelpers": true,
|
||||
"target": "ES2022",
|
||||
"module": "ES2022",
|
||||
"useDefineForClassFields": false,
|
||||
"lib": [
|
||||
"ES2022",
|
||||
"dom"
|
||||
]
|
||||
},
|
||||
"angularCompilerOptions": {
|
||||
"enableI18nLegacyMessageIdFormat": false,
|
||||
"strictInjectionParameters": true,
|
||||
"strictInputAccessModifiers": true,
|
||||
"strictTemplates": true
|
||||
}
|
||||
}
|
Some files were not shown because too many files have changed in this diff Show More
Reference in New Issue
Block a user