feat: Used frontend-toolkit in galactic-sovereign-frontend #240
Conversation
| return fail(HttpStatus.UNPROCESSABLE_ENTITY, { | ||
| message: 'Please select an action' | ||
| }); |
There was a problem hiding this comment.
Used the recommended approach to handle validation errors (see documentation). The old approach was not really relevant anymore as none of the success or missing properties were used. It's already arguable if the message is useful here as the 'form' we have to create a building action is not reacting to it.
| @@ -13,7 +13,7 @@ | |||
| "format": "prettier --write ." | |||
| }, | |||
| "dependencies": { | |||
| "@totocorpsoftwareinc/frontend-toolkit": "^0.0.18" | |||
| "@totocorpsoftwareinc/frontend-toolkit": "^0.0.22" | |||
There was a problem hiding this comment.
Used the latest version of the frontend-toolkit project.
|
|
||
| export const backToLobby = async ({ cookies }: RequestEvent) => { | ||
| resetGameCookies(cookies); | ||
| redirect(303, '/lobby'); | ||
| redirect(HttpStatus.SEE_OTHER, '/lobby'); |
There was a problem hiding this comment.
Replaced the raw HTTP codes with constants coming from the frontend-toolkit.
| readonly key: string = '00000000-0000-0000-0000-000000000000'; | ||
| readonly validUntil: Date = new Date(); | ||
|
|
||
| constructor(data: object) { |
There was a problem hiding this comment.
This is an example of how we extracted DTOs from the implementation file. It is much easier to know what is where than before. Additionally we also correctly provided default values that are meaningful compared to what is returned by the backend.
| building: UiBuilding; | ||
| availableResources: UiResource[]; | ||
| building: PlanetBuildingUiDto; | ||
| availableResources: PlanetResourceUiDto[]; |
There was a problem hiding this comment.
The new types are just drop-in replacements from the old ones. This is by design.
| export function buildingActionResponseDtoToBuildingActionUiDto( | ||
| apiDto: BuildingActionResponseDto, | ||
| buildingDto: BuildingResponseDto | undefined | ||
| ): BuildingActionUiDto { |
There was a problem hiding this comment.
The logic to convert from the XYResponseDto (coming from the API) to the XYUiDto (used in the frontend) is now extracted in a separate package: this helps with code structure.
| @@ -1,83 +0,0 @@ | |||
| import { error, redirect } from '@sveltejs/kit'; | |||
|
|
|||
| export class ResponseEnvelope { | |||
There was a problem hiding this comment.
This is provided by the frontend-toolkit package.
| @@ -0,0 +1,3 @@ | |||
| export function computeCostForLevel(cost: number, progress: number, level: number): number { | |||
There was a problem hiding this comment.
The game package is now composed of only the game logic: the actions and interaction with the API are moved to dedicated packages.
| const universesResponse = await getUniverses(sessionCookies.apiKey); | ||
| analayzeResponseEnvelopAndRedirectIfNeeded(universesResponse); | ||
| const universes = responseToUniverseArray(universesResponse); | ||
| let apiResponse = await getUniverses(sessionCookies.apiKey); | ||
| redirectToLoginIfNeeded(apiResponse); | ||
| handleApiError(apiResponse); | ||
|
|
||
| const universes = parseApiResponseAsArray(apiResponse, UniverseResponseDto); | ||
| if (universes.length === 0) { | ||
| error(HttpStatus.INTERNAL_SERVER_ERROR, 'Failed to get server data'); | ||
| } |
There was a problem hiding this comment.
Restructured the +page.server.ts files to use the new logic: it is slightly cleaner but more importantly it is also using the same approach as provided in the user-dashboard. This is nice to validate that the logic works essentially the same way: we can now more confidently try to extract the core logic into the template-frontend repository.
Knoblauchpilze
deleted the
feature/use-frontend-toolkit-in-galactic-sovereign-frontend
branch
Work
Building on what we did in #226 for the
user-dashboard, this PR uses the new types and elements defined in the frontend-toolkit in thegalactic-sovereign-frontendproject. The goal is similar to what we achieved in theuser-dashboard: make sure that we have a consistent way to access and interpret the information coming from our API. Additionally, it is a good opportunity to improve a bit the structure of the project by tidying up the logic in the$libfolder.What we did in this PR focuses on:
frontend-toolkitas a base.Tests
General testing
As for the
user-dashboardproject we don't have tests of any kind for this project. The testing was done manually by inspecting all the pages of the website.The improved error handling can be seen for example when the user fails to login due to invalid credentials. This is how it looks like in production before this PR:
And this is how it looks like now:
Wrong interpretation of the level of a building
During this process, we noticed that we wrongly interpret the level of buildings and this leads to inconsistencies in the
buildingsview. Take this example from the production website:With a fresh account without any building, the displayed production for the metal mine is 33 with a gain of 3 for level 1. This is wrong: the first level is producing 30, which is a gain of 30 compared to not having a metal mine at all. We fixed it in this PR and it now shows as follows:
As shown, with a level 1 mine we now correctly indicate that the next level (so level 2) will produce 33 metal which represents a gain of 3 compared to the current production. The crystal mine is at level 0 and shows a gain of 20 with the level 1: this is consistent with what we expect.
Future work
As mentioned in #226, we already started to extract the various services from this repository into their own dedicated repositories. This is essentially breaking down the monorepo we had to move towards a micro-service architecture. This needs to be worked on in another PR.
Update:
user-dashboardwas removed from this repository in chore: Removed user-dashboard code #246: it is now available over at user-dashboard.galactic-sovereign-frontendwas removed from this repository in chore: Removed galactic-sovereign-frontend code #250: it is now available over at galactic-sovereign-frontend.