Spartacus has the capability to extend or override the PageType enum within the cms.model framework

I am facing a dilemma similar to the Spartacus situation.

In brief, I am required to modify the PageType enum in cms.model by either overriding or extending it. The current enum consists of four values (content, product, category, catalog) and I must include a fifth value (order).

Answer №1

To enhance an enum, you need to do the following:

declare module '@spartacus/core' {
  enum PageType {
    CUSTOM_PAGE_TYPE = 'CustomPageType',
  }
}

(PageType as any)['CUSTOM_PAGE_TYPE'] = 'CustomPageType';

If you encounter an error stating that it is not compatible with type PageType, you can resolve it by:

PageType.CUSTOM_PAGE_TYPE as PageType

For more information, you can refer to the documentation at:

Answer №2

If you are planning to set up an Order page, consider utilizing the pre-built OOTB Order page that falls under the ContentPage category. You can find this template in the OOTB storefronts like apparel and electronics by referencing the cms-responsive-content_en.impex file. Feel free to customize and tweak this template to suit your specific needs.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Retrieve the text content of the <ul> <li> elements following a click on them

Currently, I am able to pass the .innerTXT of any item I click in my list of items. However, when I click on a nested item like statistics -> tests, I want to display the entire path and not just 'tests'. Can someone assist me in resolving thi ...

AWS lambda not properly displaying static content for an Angular application when running Node Express server

Recently, I encountered an issue while trying to deploy my Angular application on AWS Lambda. I kept receiving a 403 exception for my static content, even though I used Express.js to configure the server. You can check out the problems I'm facing at t ...

The datatable only accepts arrays and Iterable data types

While attempting to perform a CRUD operation with the datatable, I encountered an error message "Only arrays and iterables are allowed in datatable" upon clicking the submit button for creation. The console pointed out the error in the component.html file ...

Interface of TypeScript Undetermined

Currently, I am developing a Demo API Wrapper specifically for Roblox. During the development process, I have come across a certain issue that I would like to address. My aim is to send a request and then return all the data in the manner of an API wrapper ...

I am facing an issue with my ngx-translator in Ionic4 as it is unable to retrieve the current language

I am having an issue with the ngx-translator package where I am unable to set the default language in my application. Here is the code snippet from my app.module.ts: import { TranslateModule, TranslateLoader } from '@ngx-translate/core'; import ...

Having trouble sending a x-www-form-urlencoded POST request in Angular?

Despite having a functional POST and GET service with no CORS issues, I am struggling to replicate the call made in Postman (where it works). The only thing I can think of is that I may have incorrectly set the format as x-www-form-urlencoded. When searchi ...

Node.js server only supports cross-origin requests for protocol schemes when working with an Angular front end

Struggling to configure CORS on a local site hosting a Node.js server and an Angular client. Encountering the following error: Access to XMLHttpRequest at 'localhost:3000/api/v1/users' from origin 'http://localhost:4200' has been bl ...

Conditional generic type in return type with Typescript

How can I condition the generic return type when a value is not present? type Foo = {}; class Bar<P extends Foo> { static make<P extends Foo>(a?: P): Bar<P> { return new Bar(); } } Bar.make() // returns Bar<Foo> ...

Guide to uploading a recorded audio file (Blob) to a server using ReactJS

I'm having trouble using the react-media-recorder library to send recorded voice as a file to my backend. The backend only supports mp3 and ogg formats. Can anyone provide guidance on how to accomplish this task? Your help would be greatly appreciated ...

Firebase Function deployment encountered an issue during the build phase, despite the predeploy process

My react.js project includes Firebase functions that are configured in a sub-folder called root/functions. These functions are written in typescript and have paths option set in tsconfig.json. In my functions/index.ts file, I import files from various loca ...

Executing a method with parameters in ngOnInit in Angular - A simple guide

Is it feasible to trigger a parametrized method in ngOnInit within the same component? I currently have an onclick(p.key) function in the html file, defined in the corresponding typescript file. However, my aim is to invoke it during ngOnInit. Is this achi ...

Setting input autofocus in a recursive Angular2 component

Currently, I am working on creating a tree view system similar to Workflowy for practice purposes. The simple version is operational; however, I am facing difficulty in setting the input focus when adding a new component. I have experimented with various ...

Exploring the possibilities of integrating jQuery into Angular 2 using Javascript

import {Component, ElementRef, OnInit} from 'angular2/core'; declare var jQuery:any; @Component({ selector: 'jquery-integration', templateUrl: './components/jquery-integration/jquery-integration.html' } ...

I am interested in using a loop in Angular to highlight my div element

Enhancing my comprehension regarding the mentioned images. If I don't select anything within the div property, the default style (css) should appear like this, at least when one div is selected. However, the issue arises when unable to select. This ...

What is the process for obtaining a Component's ElementRef in order to access the BoundingClientRect of that specific Component?

I have successfully created a tooltip using Angular 5.2.0 and ngrx. The tooltip, among other things, receives an ElementRef to the target Element when the state updates, allowing me to position it absolutely: let rect = state.tooltip.target.nativeElement. ...

Errors indicating that there is no overload matching this call have been encountered in Angular

I am facing an issue with the code snippet below: import { Injectable } from '@angular/core'; import { HttpClient, HttpHeaders, HttpResponse } from '@angular/common/http'; import { environment } from '../../../environments/environ ...

The Tools of the Trade: TypeScript Tooling

Trying out the amazing Breeze Typescript Entity Generator tool but encountering an error consistently. Error: Experiencing difficulty in locating the default implementation of the 'modelLibrary' interface. Options include 'ko', 'b ...

Typescript error: Import statement not allowed here

Recently delving into the world of TypeScript, I encountered an issue when attempting to build for production. My first step was running tsc Although this step passed without any errors, I faced import errors when trying to execute the build file with ...

Exploring Angular 2 Routing with onActivate Functionality

I'm having some trouble setting up a component to use the routerOnActivate hook. I keep encountering an error message stating that the property 'routerOnActivate' is missing in the component called 'SettingsHomeComponent', with the ...

Using Angular 2 for two-way binding with input masking

Encountering an issue with ng2 and inputmask. Here is the code snippet that's causing trouble: <div class="form-group col-sm-7"> <label class="control-label" for="sender-phone">Phone *</label> <input type="text" [(ngModel) ...