siminia-upward.yml

# This is the UPWARD specification file for the Siminia storefront.
# It is used by an UPWARD server implementation, such as upward-js and
# upward-php, to describe how the server responds to requests.
# See: https://magento-research.github.io/pwa-studio/technologies/upward/

# The root properties of an UPWARD spec file are part of a global context
# that includes request and environment data.
# These properties are available to other properties and are ultimately
# populated with Resolvers.

# The root 'status', 'headers', and 'body' properties are required properties
# in an UPWARD spec file.
# An UPWARD server uses the resolved values of these properties to create an
# HTTP response to the client.
# In this file, these properties get their values from a top-level 
# 'response' object, which is a recommended and best practice approach.
status: response.status
headers: response.headers
body: response.body

# This is a top-level object used to set values for the root `status`,
# `headers`, and `body` properties.
# It is the first branch in an abstract decision tree, which ultimately 
# resolves to an object that contains values for its own 'status', 'headers',
# and 'body' properties.
# This object uses a ConditionalResolver to determine the object value based 
# on the URL pattern in the request object.
response:
  when:
    # This URL pattern requests a compressed version of an image from the
    # server.
    # The resolution path is directed to the top-level `imageOpt` object.
    - matches: request.url.pathname
      pattern: '^/img/resize/(\d+)'
      use: imageOpt
    # Requests to graphql/rest endpoints, the media library, and cache are
    # handled by the top-level 'proxy' object, which is a ProxyResolver
    # that passes the request through to the backing Magento server.
    - matches: request.url.pathname
      pattern: '^/(graphql|rest|media|pub)(/|$)'
      use: proxy
    # Requests to create an account are handled by the top-level 'index'
    # object, which returns a generic app shell
    - matches: request.url.pathname
      pattern: '^/create-account'
      use: index
    # Requests for static resources provided by the application project, such
    # as icons, manifests, and static images, are handled by the top-level
    # 'static' object, which defines a DirectoryResolver that serves assets
    # from the './static' folder in the project. The label 'static' is chosen
    # to match the directory, but the resolver is still manually configured to
    # use that directory by name.
    - matches: request.url.pathname
      pattern: '^/(icons/.+|favicon.ico$|manifest.json$|siminiaClosed.png|robots.txt$)'
      use: static
    - matches: request.url.pathname
      pattern: '^/simistatic/.'
      use: static
      #param contain simiforceproxy would use proxy directly to magento site
    - matches: request.url.search
      pattern: 'simiforceproxy'
      use: proxy
      #path contain simiforceproxy would use proxy directly to magento site
    - matches: request.url.pathname
      pattern: 'simiforceproxy'
      use: proxy
    # Requests with a URL key are handled by the top-level 'appShell' object.
    # The existence of a URL key is determined using the top-level 'urlKey'
    # object.
    - matches: urlKey
      pattern: '.'
      use: appShell
    # Requests to the document root, i.e. having no URL key, is also handled
    # by the top-level 'appShell' object.
    # siminia handle home page with index (no url resolver)
    - matches: request.url.pathname
      pattern: '^/$'
      use: index
    # custom routes
    - matches: request.url.pathname
      pattern: '^/(cart.html|product.html|checkout.html|account.html|login.html|logout.html|wishlist.html|orderhistory.html|orderdetails.html|profile.html|addresses.html|newsletter.html|paypal_express.html)'
      use: index
  # If the none of the tested conditions pass, the default handler for the
  # request is the top-level 'bundles' object, which is a DirectoryResolver that
  # serves the Webpack output assets from the './dist' folder.
  default: bundles

# The imageOpt object returns an HTTP redirect response (301) to Fastly, an 
# image optimization service.
#
# This is mainly used in production mode when the PWA does NOT have a
# Fastly-specific URL factory.
# This object forwards to Fastly where it is present, and drops back to the
# uncompressed image otherwise.
# If this application runs on a non-FastlyIO server, an onboard resizing service
# is highly recommended.
#
# NOTE: In dev and staging mode, the PWADevServer and Venia's server.js declare
# the image resizing middleware at `/img/` before the UpwardPlugin declares
# middleware, so a request should never get here.
#
# In production mode when USE_FASTLY is true, the Venia PWA has a
# Fastly-specific URL factory. It should also never hit this route.
imageOpt:
  inline:
    status: 301
    body:
      inline: ''
    headers:
      inline:
        Location:
          # A UrlResolver is used to generate the URL location
          baseUrl: env.MAGENTO_BACKEND_URL
          pathname: request.url.query.url
          query:
            inline:
              auto:
                inline: webp
              format:
                inline: pjpg
              width: $match.$1

# An object that returns true if the NODE_ENV environment variable is set 
# to 'development'. Used as a test in other configurations in this file.
# Returns false otherwise.
isDevelopment:
  when:
    - matches: env.NODE_ENV
      pattern: 'development'
      use:
        inline: true
  default:
    inline: false

# A ProxyResolver object that passes a request to the backend Magento
# server defined in the MAGENTO_BACKEND_URL environment variable.
# An UPWARD server infers this object as a ProxyResolver due to the presence
# of the 'target' property.
proxy:
  target: env.MAGENTO_BACKEND_URL
  # A local Magento install may have SSH configured and untrusted,
  # which is not a major concern, especially if containerized.
  ignoreSSLErrors:
    inline: true

# The appShell object resolves to a response that returns server-side rendered
# HTML containing the PWA application shell.
# For SEO purposes, the appropriate meta tags in the HTML head element are also
# set based on information about the resource.
# This object uses properties in the top-level 'resource' object to return the
# appropriate response values.
appShell:
  inline:
    status:
      when:
        # To test this clause, the ConditionalResolver must evaluate the
        # top-level `resource` object. UPWARD is lazily evaluated, so if this is
        # the first time `resource` was looked up during the request, then this
        # `matches` clause will trigger `resource` to begin resolving.
        # When `resource` is resolved, it will have a model property.
        # This ConditionalResolver checks for the presence of this property.
        # If the property is not present, the requested resource could not be
        # found and a 404 HTTP status is returned.
        - matches: resource.model
          pattern: '.'
          use: 200
      default: 404
    headers:
      inline:
        # The appShell object will always resolve to a response containing 
        # 'text/html' content.
        content-type: 'text/html'
    body:
      # The body property of an appShell object is resolved using a
      # TemplateResolver.
      # When the top-level 'resource' object resolves, it will contain
      # information on which template file to use for the resource model type.
      engine: mustache
      template: resource.template
      # The TemplateResolver provides the following objects to the template
      # context during render.
      # See the definition for each of the listed top-level object for details
      # on the data each one provides.
      provide:
        model: resource.model
        bundles: assetManifest.bundles
        urlResolver: urlResolver
        env: env

# The resource object provides information about the page type and which
# template to use for a requested resource.
# It uses a ConditionalResolver on the top-level 'urlResolver' object to
# determine its 'model' and 'template' properties.
# See the definition of the 'urlResolver' object for details on how it determines
# the page type based on the request URL.
resource:
  when:
    # As with all other context values, `urlResolver` begins resolving the first
    # time its value is requested. If UPWARD has not yet queried the GraphQL
    # service before evaluating this match clause, then it does so now.
    - matches: urlResolver.type
      pattern: 'CMS_PAGE'
      use:
        inline:
          # See the top-level 'cmsPage' object for details on its resolved data
          model: cmsPage
          template: './templates/cmspage-shell.mst'
    - matches: urlResolver.type
      pattern: 'CATEGORY'
      use:
        inline:
          # See the top-level 'category' object for details on its resolved data
          model: category
          template: './templates/category-shell.mst'
    - matches: urlResolver.type
      pattern: 'PRODUCT'
      use:
        inline:
          # See the top-level 'product' object for details on its resolved data
          model: product
          template: './templates/product-shell.mst'
    # CMS_PAGE, CATEGORY, and PRODUCT are known page types with specific
    # data models and template files for each type.
    # The following condition handles the case where the urlResolver object
    # contains an unknown page type.
    # It uses the top-level 'unknownPageType' object as its resolved data and
    # a generic shell as the template file.
    - matches: urlResolver.type
      pattern: '.'
      use:
        inline:
          model: unknownPageType
          template: './templates/generic-shell.mst'
    # This entry makes '/search.html' a valid resource path.
    # It uses the top-level 'genericObject' object as its resolve data and uses
    # the generic shell as its template file.
    - matches: request.url.pathname
      pattern: '/search.html'
      use:
        inline:
          model: genericObject
          template: './templates/generic-shell.mst'
  default:
    # If none of the resolver conditions pass, no 'model' property is set and
    # this resource object sets the template property to the notfound-shell
    # template file.
    inline:
      template: './templates/notfound-shell.mst'

# The assetManifest object is a FileResolver that returns JSON data from a
# file generated by Webpack. This file contains a list of all the "bundle"
# and "chunk" filenames generated by the last Webpack build. Using this data,
# the templates can render dynamic script tags based on the filenames of the
# most recent build assets.
#
# NOTE: This object uses the shorthand syntax for a FileResolver to help with 
# readability and as a convenience.
assetManifest:
  when:
    - matches: env.NODE_ENV
      pattern: 'development'
      use: ./asset-manifest.json
  default: ./dist/asset-manifest.json

# The unknownPageType object contains a single 'title' property that is used
# in the template file as the page title.
# The top-level 'resource' object uses this object as the model data for page
# types it does not support.
unknownPageType:
  inline:
    title: 'Unknown page type'

# The urlResolver object is an object containing only the relevant
# data from the top-level 'urlResolverResult' object, which is a
# ServiceResolver.
#
# NOTE: Extracting smaller objects from large or deeply nesting data objects
# is a pattern used to enhance readability and avoid long "dot lookup" strings
urlResolver: urlResolverResult.data.urlResolver

# The urlResolverResult object is a ServiceResolver that returns data from a
# GraphQL backing service, whose URL is resolved in the top-level 'magentoGQL'
# object.
#
# This object retrieves information from Magento about the request path,
# so the PWA can respect redirects and routes controlled by the admin.
#
# NOTE: The UPWARD server is able to interpret this entry as a ServiceResolver
# because of the presence of the 'query' property, which itself uses the
# shorthand syntax for a FileResolver.
urlResolverResult:
  url: magentoGQL
  query: './src/queries/urlResolver.graphql'
  variables:
    inline:
      urlKey: request.url.pathname

# The magentoGQL object is a UrlResolver that returns the URL for the
# GraphQL endpoint using the MAGENTO_BACKEND_URL environment variable.
magentoGQL:
  baseUrl: env.MAGENTO_BACKEND_URL
  pathname:
    inline: graphql

# The product object is an object containing only the relevant data from the
# top-level 'productResult' object.
product: productResult.data.productDetail.items.0

# The productResult object is a ServiceResolver that returns data from a
# GraphQL backing service, whose URL is resolved in the top-level 'magentoGQL'
# object.
#
# This object retrieves information about a specific product.
productResult:
  url: magentoGQL
  query: './src/queries/getProductDetail.graphql'
  variables:
    inline:
      onServer: true
      urlKey: urlKey
      id: urlResolver.id

# The category object is an object containing only the relevant data from the
# top-level 'categoryResult' object.
category: categoryResult.data.category

# The categoryResult object is a ServiceResolver that returns data from a
# GraphQL backing service, whose URL is resolved in the top-level 'magentoGQL'
# object.
#
# This object retrieves information about a specific category.
categoryResult:
  url: magentoGQL
  query: './src/queries/getCategory.graphql'
  variables:
    inline:
      onServer: true
      id: urlResolver.id
      pageSize:
        inline: 1
      currentPage:
        inline: 1

# The cmsPage object is an object containing only the relevant data from the
# top-level 'cmsPageResult' object.
cmsPage: cmsPageResult.data.cmsPage

# The cmsPageResult object is a ServiceResolver that returns data from a
# GraphQL backing service, whose URL is resolved in the top-level 'magentoGQL'
# object.
#
# This object retrieves information about a specific CMS page.
cmsPageResult:
  url: magentoGQL
  query: './src/queries/getCmsPage.graphql'
  variables:
    inline:
      onServer: true
      id: urlResolver.id

# The urlKey object returns the value of the URL key from the request path
urlKey:
  when:
    - matches: request.url.pathname
      pattern: '^/(?:(.*)\.html)?'
      use: $match.$1
  default:
    inline: ''

# The genericObject object is the data object used by the top-level 'appShell'
# object for the '/search.html' path
genericObject:
  inline:
    name:
      inline:
        "Hello world!"

# The bundles object is a DirectoryResolver that allows access to the bundled
# files in the project's './dist' diretory.
#
# NOTE: The UPWARD server is able to interpret this entry as a
# DirectoryResolver because of the presence of the 'directory' property.
bundles:
  directory:
    inline: './dist'

# The index object contains response data for rendering a generic app shell
index:
  inline:
    status: 200
    headers:
      inline:
        content-type:
          inline: text/html
    body:
      engine: mustache
      template: './templates/generic-shell.mst'
      provide:
        bundles: assetManifest.bundles

# The static object is a DirectoryResolver that allows access to the files
# inside the project's './static' directory.
static:
  directory:
    inline: './static'