Question: I am using `app.useStaticAssets(ui);` in NestJS app, to server my SPA. The application is running on a browser in kiosk mode. 

New kiosk hardware have 2 screens, front, back. It would be easiest if we could create another SPA and serve it on the same NestJS app.

I've looked at the NestJS docs, tried to inspect the source code and searched for related issues, have founds only hints, using res.sendFile (not sure about the assets) or using express under NestJS.

Is there a way to do this in straight NestJS?

Answer: 
I was able to add more than one product, the parts of the code that I had to modify are the following:

```
//ProductItem.js     
    const {location} = this.props      
    function addProductToCart() {
        const oldproduct = localStorage.getItem('products') ? localStorage.getItem('products') : "[]";
        const arrayproduct =  JSON.parse(oldproduct);  
        let productsString = data.products;
        let products = location.state

        arrayproduct.push(products);
        if(productsString){
            products = JSON.parse(productsString)
        }

        localStorage.setItem('products', JSON.stringify(arrayproduct));                   
    }  

```

I also had to involve the main component that contained CartProduct:

```
//Shopping.js
export default class Shopping extends Component{ 
componentDidMount(){
    const products =  JSON.parse(localStorage.getItem('products'));
    this.setState({products});    
}
render(){
    const products =  JSON.parse(localStorage.getItem('products'));        
    return(                       
          {products.map((product, key) =>
             <CartProduct key={key} data={product}/> 
            )}   
    )
}

//CartProduct.js
class CartProduct extends React.Component{    
render(){  
    return(
    (localStorage.getItem('products') !== null) ? (                   
        <> 
        <Row>
            <Col>
                <img src={this.props.data.img}/>
            </Col>
            <Col>
                <h4>{this.props.data.name}</h4>
                <span>{this.props.data.description}</span>
                <h4>${this.props.data.price}</h4>
            </Col>
        </>
        ):(
            <span/>
        )
    )
}}export default withRouter(CartProduct);

```
```
const addToCart = (data) => {
    var dataCart = JSON.parse(localStorage.getItem('cart'))
    var product = data
    product['amount'] = 1

    if (dataCart.length === 0 || !dataCart.find((p) => p.name === product.name)) {
      dataCart.push(product)
      localStorage.setItem('cart', JSON.stringify(dataCart))
    } else if (dataCart.find((p) => p.name === product.name)) {
      product['amount'] += dataCart.find((p) => p.name === product.name).amount
      dataCart.splice(
        dataCart.findIndex((p) => p.name === product.name),
        1,
        product
      )
      localStorage.setItem('cart', JSON.stringify(dataCart))
    }
  }

```