Begin converting backend to GraphQL

backend/package.json

@@ -50,16 +50,17 @@
     "!*/__tests__"
   ],
   "dependencies": {
-    "@loopback/authentication": "^7.3.4",
-    "@loopback/authentication-jwt": "^0.9.4",
-    "@loopback/boot": "^3.4.4",
-    "@loopback/core": "^2.18.0",
-    "@loopback/repository": "^3.7.3",
-    "@loopback/rest": "^10.1.0",
-    "@loopback/rest-explorer": "^3.3.4",
-    "@loopback/service-proxy": "^3.2.4",
+    "@loopback/authentication": "^8.1.1",
+    "@loopback/authentication-jwt": "^0.11.1",
+    "@loopback/boot": "^4.1.1",
+    "@loopback/core": "^3.1.1",
+    "@loopback/graphql": "^0.7.1",
+    "@loopback/repository": "^4.1.1",
+    "@loopback/rest": "^11.1.1",
+    "@loopback/rest-explorer": "^4.1.1",
+    "@loopback/service-proxy": "^4.1.1",
     "faker": "^5.5.3",
-    "loopback-connector-mysql": "^5.4.4",
+    "loopback-connector-mysql": "^6.1.0",
     "tslib": "^2.0.0"
   },
   "devDependencies": {

backend/src/__tests__/acceptance/home-page.acceptance.ts

@@ -1,4 +1,4 @@
-import {Client} from '@loopback/testlab';
+/*import {Client} from '@loopback/testlab';
 import {SzakdolgozatBackendApplication} from '../..';
 import {setupApplication} from './test-helper';
 
@@ -29,3 +29,4 @@ describe('HomePage', () => {
       .expect(/<title>LoopBack API Explorer/);
   });
 });
+*/

backend/src/__tests__/acceptance/ping.controller.acceptance.ts

@@ -1,4 +1,4 @@
-import {Client, expect} from '@loopback/testlab';
+/*import {Client, expect} from '@loopback/testlab';
 import {SzakdolgozatBackendApplication} from '../..';
 import {setupApplication} from './test-helper';
 
@@ -19,3 +19,4 @@ describe('PingController', () => {
     expect(res.body).to.containEql({greeting: 'Hello from LoopBack'});
   });
 });
+*/

backend/src/__tests__/acceptance/test-helper.ts

@@ -1,4 +1,4 @@
-import {SzakdolgozatBackendApplication} from '../..';
+/*import {SzakdolgozatBackendApplication} from '../..';
 import {
   createRestAppClient,
   givenHttpServerConfig,
@@ -30,3 +30,4 @@ export interface AppWithClient {
   app: SzakdolgozatBackendApplication;
   client: Client;
 }
+*/

backend/src/application.ts

@@ -1,52 +1,31 @@
-import {BootMixin} from '@loopback/boot';
-import {ApplicationConfig} from '@loopback/core';
-import {
-  RestExplorerBindings,
-  RestExplorerComponent,
-} from '@loopback/rest-explorer';
-import {RepositoryMixin} from '@loopback/repository';
-import {RestApplication} from '@loopback/rest';
-import {ServiceMixin} from '@loopback/service-proxy';
-import path from 'path';
-import {MySequence} from './sequence';
-import {AuthenticationComponent} from '@loopback/authentication';
-import {JWTAuthenticationComponent, UserServiceBindings} from '@loopback/authentication-jwt';
-import {SzakdolgozatUserService} from './services';
+import { BootMixin } from '@loopback/boot';
+import { Application, ApplicationConfig } from '@loopback/core';
+import { RepositoryMixin } from '@loopback/repository';
+import { ServiceMixin } from '@loopback/service-proxy';
+import { AuthenticationComponent } from '@loopback/authentication';
+import { JWTAuthenticationComponent, UserServiceBindings } from '@loopback/authentication-jwt';
+import { SzakdolgozatUserService } from './services';
+import { GraphQLServer } from '@loopback/graphql';
 
-export {ApplicationConfig};
+export { ApplicationConfig };
 
 export class SzakdolgozatBackendApplication extends BootMixin(
-  ServiceMixin(RepositoryMixin(RestApplication)),
+    ServiceMixin(RepositoryMixin(Application)),
 ) {
-  constructor(options: ApplicationConfig = {}) {
-    super(options);
+    gqlServer: GraphQLServer;
 
-    // Set up the custom sequence
-    this.sequence(MySequence);
+    constructor(options: ApplicationConfig = {}) {
+        super(options);
 
-    // Set up default home page
-    this.static('/', path.join(__dirname, '../public'));
+        const server = this.server(GraphQLServer);
+        this.configure(server.key).to({host: process.env.HOST, port: process.env.PORT});
+        this.getServer(GraphQLServer).then(s => this.gqlServer = s);
 
-    // Customize @loopback/rest-explorer configuration here
-    this.configure(RestExplorerBindings.COMPONENT).to({
-      path: '/explorer',
-    });
-    this.component(RestExplorerComponent);
+        // Authentication
+        this.component(AuthenticationComponent);
+        this.component(JWTAuthenticationComponent);
+        this.service(SzakdolgozatUserService, UserServiceBindings.USER_SERVICE);
 
-    // Authentication
-    this.component(AuthenticationComponent);
-    this.component(JWTAuthenticationComponent);
-    this.service(SzakdolgozatUserService, UserServiceBindings.USER_SERVICE);
-
-    this.projectRoot = __dirname;
-    // Customize @loopback/boot Booter Conventions here
-    this.bootOptions = {
-      controllers: {
-        // Customize ControllerBooter Conventions here
-        dirs: ['controllers'],
-        extensions: ['.controller.js'],
-        nested: true,
-      },
-    };
-  }
+        this.projectRoot = __dirname;
+    }
 }

backend/src/index.ts

@@ -1,4 +1,4 @@
-import {ApplicationConfig, SzakdolgozatBackendApplication} from './application';
+import { ApplicationConfig, SzakdolgozatBackendApplication } from './application';
 
 export * from './application';
 
@@ -8,7 +8,7 @@ export async function main(options: ApplicationConfig = {}) {
   await app.migrateSchema({existingSchema: 'alter'});
   await app.start();
 
-  const url = app.restServer.url;
+  const url = app.gqlServer.httpServer?.url;
   console.log(`Server is running at ${url}`);
   console.log(`Try ${url}/ping`);
 

backend/src/openapi-spec.ts

@@ -1,23 +0,0 @@
-import {ApplicationConfig} from '@loopback/core';
-import {SzakdolgozatBackendApplication} from './application';
-
-/**
- * Export the OpenAPI spec from the application
- */
-async function exportOpenApiSpec(): Promise<void> {
-  const config: ApplicationConfig = {
-    rest: {
-      port: +(process.env.PORT ?? 3000),
-      host: process.env.HOST ?? 'localhost',
-    },
-  };
-  const outFile = process.argv[2] ?? '';
-  const app = new SzakdolgozatBackendApplication(config);
-  await app.boot();
-  await app.exportOpenApiSpec(outFile);
-}
-
-exportOpenApiSpec().catch(err => {
-  console.error('Fail to export OpenAPI spec from the application.', err);
-  process.exit(1);
-});

frontend/src/app/app.component.ts

@@ -105,7 +105,7 @@ export class AppComponent implements OnInit {
         return this.title.setTitle('Szakdolgozat');
       }
       const titleParts = routeParts.reverse().map(part => part.title);
-      if (this.activeRouteTitle) {
+      if (this.activeRouteTitle) { // TODO: Get title parts from parent components even if parent wasn't opened
         titleParts[titleParts.length - 1] = this.activeRouteTitle;
       }
       let pageTitle = titleParts.reduce((partA, partI) => `${partA} > ${partI}`);