feat: unified naming of the related objects in the api-harmonization and frontend apps

* feat: unified naming of the related objects in the api-harmonization and frontend apps - from now on, they are called `blocks` (instead od `components` in api-harmonization and `containers` in frontend)

* fix(frontend): reverted change with dynamic components as it caused them to be rendered twice on page load

Author: marcinkrasowski

.changeset/small-days-pretend.md

@@ -0,0 +1,11 @@
+---
+'@o2s/prettier-config': minor
+'@o2s/integrations.strapi-cms': minor
+'@o2s/integrations.mocked': minor
+'@o2s/api-harmonization': minor
+'@o2s/framework': minor
+'@o2s/frontend': minor
+'@o2s/docs': minor
+---
+
+unified naming of the related objects in the api-harmonization and frontend apps - from now on, they are called `blocks` (instead of `components` in api-harmonization and `containers` in frontend)

apps/api-harmonization/package.json

@@ -7,7 +7,7 @@
     "license": "MIT",
     "exports": {
         ".": "./src/index.ts",
-        "./components": "./src/components/index.ts",
+        "./blocks": "./src/blocks/index.ts",
         "./modules": "./src/modules/index.ts"
     },
     "scripts": {

apps/api-harmonization/src/app.module.ts

@@ -19,21 +19,21 @@ import {
     Users,
 } from '@o2s/framework/modules';
 
-// COMPONENT IMPORT
+// BLOCK IMPORT
 import { configuration } from '@o2s/api-harmonization/config/configuration';
 
-import { ArticleDetailsComponentModule } from '@o2s/api-harmonization/components/article-details/article-details.module';
-import { ArticleListComponentModule } from '@o2s/api-harmonization/components/article-list/article-list.module';
-import { FaqComponentModule } from '@o2s/api-harmonization/components/faq/faq.module';
-import { InvoiceListComponentModule } from '@o2s/api-harmonization/components/invoice-list/invoice-list.module';
-import { NotificationDetailsComponentModule } from '@o2s/api-harmonization/components/notification-details/notification-details.module';
-import { NotificationListComponentModule } from '@o2s/api-harmonization/components/notification-list/notification-list.module';
-import { PaymentsHistoryComponentModule } from '@o2s/api-harmonization/components/payments-history/payments-history.module';
-import { PaymentsSummaryComponentModule } from '@o2s/api-harmonization/components/payments-summary/payments-summary.module';
-import { TicketDetailsComponentModule } from '@o2s/api-harmonization/components/ticket-details/ticket-details.module';
-import { TicketListComponentModule } from '@o2s/api-harmonization/components/ticket-list/ticket-list.module';
-import { TicketRecentComponentModule } from '@o2s/api-harmonization/components/ticket-recent/ticket-recent.module';
-import { UserAccountComponentModule } from '@o2s/api-harmonization/components/user-account/user-account.module';
+import { ArticleDetailsBlockModule } from '@o2s/api-harmonization/blocks/article-details/article-details.module';
+import { ArticleListBlockModule } from '@o2s/api-harmonization/blocks/article-list/article-list.module';
+import { FaqBlockModule } from '@o2s/api-harmonization/blocks/faq/faq.module';
+import { InvoiceListBlockModule } from '@o2s/api-harmonization/blocks/invoice-list/invoice-list.module';
+import { NotificationDetailsBlockModule } from '@o2s/api-harmonization/blocks/notification-details/notification-details.module';
+import { NotificationListBlockModule } from '@o2s/api-harmonization/blocks/notification-list/notification-list.module';
+import { PaymentsHistoryBlockModule } from '@o2s/api-harmonization/blocks/payments-history/payments-history.module';
+import { PaymentsSummaryBlockModule } from '@o2s/api-harmonization/blocks/payments-summary/payments-summary.module';
+import { TicketDetailsBlockModule } from '@o2s/api-harmonization/blocks/ticket-details/ticket-details.module';
+import { TicketListBlockModule } from '@o2s/api-harmonization/blocks/ticket-list/ticket-list.module';
+import { TicketRecentBlockModule } from '@o2s/api-harmonization/blocks/ticket-recent/ticket-recent.module';
+import { UserAccountBlockModule } from '@o2s/api-harmonization/blocks/user-account/user-account.module';
 
 import { AppConfig } from './app.config';
 import { AppService } from './app.service';
@@ -71,18 +71,21 @@ import { RoutesModule } from './modules/routes/routes.module';
         LoginPageModule.register(AppConfig),
         NotFoundPageModule.register(AppConfig),
 
-        TicketListComponentModule.register(AppConfig),
-        TicketDetailsComponentModule.register(AppConfig),
-        NotificationListComponentModule.register(AppConfig),
-        NotificationDetailsComponentModule.register(AppConfig),
-        FaqComponentModule.register(AppConfig),
-        ArticleDetailsComponentModule.register(AppConfig),
-        ArticleListComponentModule.register(AppConfig),
-        InvoiceListComponentModule.register(AppConfig),
-        PaymentsSummaryComponentModule.register(AppConfig),
-        PaymentsHistoryComponentModule.register(AppConfig),
-        UserAccountComponentModule.register(AppConfig),
-        TicketRecentComponentModule.register(AppConfig),
+        TicketListBlockModule.register(AppConfig),
+        TicketDetailsBlockModule.register(AppConfig),
+        NotificationListBlockModule.register(AppConfig),
+        NotificationDetailsBlockModule.register(AppConfig),
+        FaqBlockModule.register(AppConfig),
+        Articles.Module.register(AppConfig),
+        ArticleDetailsBlockModule.register(AppConfig),
+        ArticleListBlockModule.register(AppConfig),
+        Resources.Module.register(AppConfig),
+        Invoices.Module.register(AppConfig),
+        InvoiceListBlockModule.register(AppConfig),
+        PaymentsSummaryBlockModule.register(AppConfig),
+        PaymentsHistoryBlockModule.register(AppConfig),
+        UserAccountBlockModule.register(AppConfig),
+        TicketRecentBlockModule.register(AppConfig),
         // COMPONENT REGISTER
     ],
     providers: [

apps/api-harmonization/src/components/article-details/article-details.controller.ts renamed to apps/api-harmonization/src/blocks/article-details/article-details.controller.ts

@@ -4,7 +4,7 @@ import { LoggerService } from '@o2s/utils.logger';
 import { AppHeaders } from '@o2s/api-harmonization/utils/headers';
 
 import { URL } from './';
-import { GetArticleDetailsComponentParams, GetArticleDetailsComponentQuery } from './article-details.request';
+import { GetArticleDetailsBlockParams, GetArticleDetailsBlockQuery } from './article-details.request';
 import { ArticleDetailsService } from './article-details.service';
 
 @Controller(URL)
@@ -13,11 +13,11 @@ export class ArticleDetailsController {
     constructor(protected readonly service: ArticleDetailsService) {}
 
     @Get(':id')
-    getArticleDetailsComponent(
+    getArticleDetailsBlock(
         @Headers() headers: AppHeaders,
-        @Query() query: GetArticleDetailsComponentQuery,
-        @Param() params: GetArticleDetailsComponentParams,
+        @Query() query: GetArticleDetailsBlockQuery,
+        @Param() params: GetArticleDetailsBlockParams,
     ) {
-        return this.service.getArticleDetailsComponent(query, params, headers);
+        return this.service.getArticleDetailsBlock(query, params, headers);
     }
 }

apps/api-harmonization/src/components/article-details/article-details.mapper.ts renamed to apps/api-harmonization/src/blocks/article-details/article-details.mapper.ts

@@ -2,15 +2,15 @@ import { Articles, CMS } from '@o2s/framework/modules';
 
 import { formatDateRelative } from '@o2s/api-harmonization/utils/date';
 
-import { Article, ArticleDetailsComponent, ArticleSection } from './article-details.model';
+import { Article, ArticleDetailsBlock, ArticleSection } from './article-details.model';
 
 export const mapArticleDetails = (
     article: Articles.Model.Article,
-    cms: CMS.Model.ArticleDetailsComponent.ArticleDetailsComponent,
+    cms: CMS.Model.ArticleDetailsBlock.ArticleDetailsBlock,
     locale: string,
-): ArticleDetailsComponent => {
+): ArticleDetailsBlock => {
     return {
-        __typename: 'ArticleDetailsComponent',
+        __typename: 'ArticleDetailsBlock',
         data: {
             id: article.id,
             title: article.title,
@@ -21,12 +21,12 @@ export const mapArticleDetails = (
             thumbnail: article.thumbnail,
             sections: mapSections(article.sections),
         },
-    } as ArticleDetailsComponent;
+    } as ArticleDetailsBlock;
 };
 
 export const mapArticle = (
     article: Articles.Model.Article,
-    cms: CMS.Model.ArticleDetailsComponent.ArticleDetailsComponent,
+    cms: CMS.Model.ArticleDetailsBlock.ArticleDetailsBlock,
     locale: string,
 ): Article => {
     return {

apps/api-harmonization/src/components/article-details/article-details.model.ts renamed to apps/api-harmonization/src/blocks/article-details/article-details.model.ts

@@ -1,9 +1,9 @@
 import { Articles } from '@o2s/framework/modules';
 
-import { Component } from '../../utils';
+import { Block } from '../../utils';
 
-export class ArticleDetailsComponent extends Component.Component {
-    __typename!: 'ArticleDetailsComponent';
+export class ArticleDetailsBlock extends Block.Block {
+    __typename!: 'ArticleDetailsBlock';
     data!: Article;
 }
 

apps/api-harmonization/src/components/article-details/article-details.module.ts renamed to apps/api-harmonization/src/blocks/article-details/article-details.module.ts

@@ -7,14 +7,14 @@ import { ArticleDetailsController } from './article-details.controller';
 import { ArticleDetailsService } from './article-details.service';
 
 @Module({})
-export class ArticleDetailsComponentModule {
+export class ArticleDetailsBlockModule {
     static register(config: ApiConfig): DynamicModule {
         const cmsService = config.integrations.cms.service;
         const articleService = config.integrations.articles.service;
         const searchService = config.integrations.search.service;
 
         return {
-            module: ArticleDetailsComponentModule,
+            module: ArticleDetailsBlockModule,
             providers: [
                 ArticleDetailsService,
                 {

apps/api-harmonization/src/blocks/article-details/article-details.request.ts

@@ -0,0 +1,9 @@
+import { Articles, CMS } from '@o2s/framework/modules';
+
+export class GetArticleDetailsBlockQuery implements Omit<CMS.Request.GetCmsEntryParams, 'locale'> {
+    id!: string;
+}
+
+export class GetArticleDetailsBlockParams implements Omit<Articles.Request.GetArticleParams, 'locale'> {
+    id!: string;
+}

apps/api-harmonization/src/components/article-details/article-details.service.ts renamed to apps/api-harmonization/src/blocks/article-details/article-details.service.ts

@@ -6,8 +6,8 @@ import { Articles, CMS } from '@o2s/framework/modules';
 import { AppHeaders } from '@o2s/api-harmonization/utils/headers';
 
 import { mapArticleDetails } from './article-details.mapper';
-import { ArticleDetailsComponent } from './article-details.model';
-import { GetArticleDetailsComponentParams, GetArticleDetailsComponentQuery } from './article-details.request';
+import { ArticleDetailsBlock } from './article-details.model';
+import { GetArticleDetailsBlockParams, GetArticleDetailsBlockQuery } from './article-details.request';
 
 @Injectable()
 export class ArticleDetailsService {
@@ -16,12 +16,12 @@ export class ArticleDetailsService {
         private readonly articleService: Articles.Service,
     ) {}
 
-    getArticleDetailsComponent(
-        query: GetArticleDetailsComponentQuery,
-        params: GetArticleDetailsComponentParams,
+    getArticleDetailsBlock(
+        query: GetArticleDetailsBlockQuery,
+        params: GetArticleDetailsBlockParams,
         headers: AppHeaders,
-    ): Observable<ArticleDetailsComponent> {
-        const cms = this.cmsService.getArticleDetailsComponent({ ...query, locale: headers['x-locale'] });
+    ): Observable<ArticleDetailsBlock> {
+        const cms = this.cmsService.getArticleDetailsBlock({ ...query, locale: headers['x-locale'] });
         const article = this.articleService.getArticle({ ...params, locale: headers['x-locale'] });
 
         return forkJoin([article, cms]).pipe(

apps/api-harmonization/src/components/article-details/index.ts renamed to apps/api-harmonization/src/blocks/article-details/index.ts

@@ -1,4 +1,4 @@
-export const URL = '/components/article-details';
+export const URL = '/blocks/article-details';
 
 export * as Model from './article-details.model';
 export * as Request from './article-details.request';