renderView:
  - type: div
    formDataPath: bundleFormRoot
    content:
      type: DataFilter
      context: global
      filters:
        - subjectsWithProperty: deployment-item
          andConditions:
            # Text search condition.
            - orConditions:
                - when: ~~._quickFilters.search
                  isEmpty:
                - whenFilterableData: deployment-item.compiledSearchContent
                  contains: ~~._quickFilters.search

            # Last generation date condition.
            - orConditions:
                - when: ~~._quickFilters.since
                  isEmpty:
                - whenFilterableData: deployment-item.lastModificationDate
                  ">=": ~~._quickFilters.since
                  compareAsDates: true

            # Selection status conditions.
            - orConditions:
                - when: ~~._quickFilters.selectionStatus
                  isNot: selected_only
                - whenFilterableData: deployment-item.isSelected
                  is: true
            - orConditions:
                - when: ~~._quickFilters.selectionStatus
                  isNot: unselected_only
                - whenFilterableData: deployment-item.isSelected
                  is: false

            # Importability conditions.
            - orConditions:
                - when: ~~._quickFilters.importabilityInConflict
                  isNot: true
                - whenFilterableData: deployment-item.importability.isInConflict
                  is: true
            - orConditions:
                - when: ~~._quickFilters.importabilityMerged
                  isNot: true
                - whenFilterableData: deployment-item.importability.isMerged
                  is: true
            - orConditions:
                - when: ~~._quickFilters.importabilityModified
                  isNot: true
                - whenFilterableData: deployment-item.importability.isModified
                  is: true
            - orConditions:
                - when: ~~._quickFilters.importabilityNew
                  isNot: true
                - whenFilterableData: deployment-item.importability.isNew
                  is: true
            - orConditions:
                - when: ~~._quickFilters.importabilityTrackerConfigMismatch
                  isNot: true
                - whenFilterableData: deployment-item.importability.isTrackerConfigMismatch
                  is: true

            # Post type filter.
            - orConditions:
                - whenFilterableData: deployment-item.contentType
                  isEmpty:
                - when: ~~.__state.displayedPostType
                  isEmpty:
                - whenFilterableData: deployment-item.contentType
                  is: ~~.__state.displayedPostType

      content:
        load: deploy-sync-content--form-bundle
    #      customDataLocation: ~~._bundleForm
    actions:
      - what: redirect
        to: ~~._redirect
        when: ~~._redirect
        isEmpty: not

templates:

  deploy-sync-content--form-bundle-tracker:
    type: AccordionItem
    header:
      type: div
      attributes:
        class: row
        style:
          width: 100%
      content:
        - type: div
          attributes:
            class: col-lg-auto col-12
          content: ~.trackerName
        - type: div
          attributes:
            class: col-lg-auto col-12 mt-2 mt-xl-0
          content:
          # Commented due to performance drop.
    #            - type: span
    #              attributes:
    #                class: text-success
    #              content:
    #                - type: Count
    #                  context: root
    #                  jsonPathPattern:
    #                    - $._bundleTrackers[?(@ && @["bundleTracker"] && @["bundleTracker"].trackerId == "$token")].bundleTracker..[?(@ && @["deployment-item"] && @["deployment-item"].isSelected)]
    #                    - ~.trackerId
    #                - " selected"
    #            - type: span
    #              attributes:
    #                class: ms-2 text-danger
    #              content:
    #                - type: Count
    #                  context: root
    #                  jsonPathPattern:
    #                    - $._bundleTrackers[?(@ && @["bundleTracker"] && @["bundleTracker"].trackerId == "$token")].bundleTracker..[?(@ && @["deployment-item"] && @["deployment-item"].isSelected != true)]
    #                    - ~.trackerId
    #                - " unselected"
    body:
      type: div
      attributes:
        class: row
      content:
        bundled:
          type: div
          content:
            - type: div
              attributes:
                class: d-flex wrapper-link
              content:
                - type: BsButton
                  attributes:
                    size: sm
                    variant: link
                    class: link-select p-0
                  content: Select all
                  actions:
                    - what: postMessage
                      on: click
                      message:
                        actor: select_all_tracker_items
                        bundledStatus: true
                        trackerId: ~.trackerId
                - type: BsButton
                  attributes:
                    size: sm
                    variant: link
                    class: link-unselect p-0
                  content: Unselect all
                  actions:
                    - what: postMessage
                      on: click
                      message:
                        actor: unselect_all_tracker_items
                        bundledStatus: true
                        trackerId: ~.trackerId
            - type: Switch
              cardinality: -1
              content: ~.bundled
              paginated: true
              paginationProps:
                maxPageButtonsCount: 5
                pageMaxItemCount: 7
              options:
                deployment-item:
                  load: deploy-sync-content--form-bundle-tracker-deployment-item
              after:
                type: div
                attributes:
                  class: d-flex justify-content-center
                content:
                  type: PageControls
            # Will receive events such as select all.
            # This is needed because we want the items on the other pages to react to messages.
            - type: Switch
              cardinality: -1
              content: ~.bundled
              options:
                deployment-item:
                  load: deploy-sync-content--form-bundle-tracker-deployment-item-phantom

  deploy-sync-content--form-bundle:
    - type: div
      attributes:
        class: row d-flex flex-column flex-sm-row align-items-start align-items-sm-center mb-4
      content:
        - load: deploy-sync-content--header
          attributes:
            class: col
          content: Synchronize
        - type: div
          attributes:
            class: col col-auto text-end
          content:
            - type: div
              attributes:
                class: mx-1
              content: ~~._bundleLastGenerationDateAgo
        # Submit when no conflict.
        - type: div
          attributes:
            class: col col-auto
          content:
            - type: BsButton
              content: Import
              actions:
                - what: submitData
                  on: click
                  url: ~~.submitEndpoint
              attributes:
                class: btn btn-secondary btn-rounded btn-yellow px-5 py-2 mt-2 mt-sm-0
          actions:
            - what: hide
              whenDataCountOf: $._bundleTrackers[*].bundleTracker..[?(@.isInConflict == true)]
              inContext: root
              isNot: 0
        # Opens modal for confirmation due to conflicts.
        - type: div
          attributes:
            class: col col-auto
          content:
            - type: BsButton
              attributes:
                variant: success
              content: Import all
              actions:
                - what: setData
                  on: click
                  # TODO: ça doit appeler un modal
                  path: ~~._openImportConfirmModal
                  value: true
            - type: Modal
              attributes:
                style:
                  zIndex: 100000
              showBoolPath: ~~._openImportConfirmModal
              body:
                - All the conflicts have not been resolved. Forcing the import will overwrite any existing data. Continue?
                - type: hr
                - type: div
                  attributes:
                    style:
                      display: flex
                      gap: 1em
                      justify-content: end
                  content:
                    - type: BsButton
                      attributes:
                        variant: secondary
                      content: Cancel
                      actions:
                        - what: setData
                          on: click
                          path: ~~._openImportConfirmModal
                    - type: BsButton
                      attributes:
                        variant: danger
                      content: Continue
                      actions:
                        - what: submitData
                          on: click
                          # TODO: ça doit appeler un endpoint qui retourne un redirect quand l'import est lancé.
                          url: ~~.submitEndpointForceAll
          actions:
            - what: hide
              whenDataCountOf: $._bundleTrackers[*].bundleTracker..[?(@.isInConflict == true)]
              inContext: root
              is: 0
    - type: div
      attributes:
        class: row
      content:
        filterColumn:
          type: section
          attributes:
            class: col-12 col-lg-auto
          content:
            - type: div
              attributes:
                class: fw-medium mb-3 fs-5
              content: Selection status
            - type: CheckBoxField
              attributes:
                class: options-list fw-light
              controlType: radio
              dataLocation: ~~._quickFilters.selectionStatus
              defaultFieldValue: selected_unselected
              options:
                - label:
                    - All
                    # Commented due to performance drop.
                  #                    - type: span
                  #                      attributes:
                  #                        class: ms-1
                  #                      content:
                  #                        - "("
                  #                        - type: Count
                  #                          jsonPathPattern: $._bundleTrackers[*].bundleTracker..["deployment-item"]
                  #                        - ")"
                  value: selected_unselected
                - label:
                    - Selected
                    # Commented due to performance drop.
                  #                    - type: span
                  #                      attributes:
                  #                        class: ms-1
                  #                      content:
                  #                        - "("
                  #                        - type: Count
                  #                          jsonPathPattern: $._bundleTrackers[*].bundleTracker..[?(@ && @["deployment-item"] && @["deployment-item"].isSelected)]
                  #                        - ")"
                  value: selected_only
                - label:
                    - Unselected
                    # Commented due to performance drop.
                  #                    - type: span
                  #                      attributes:
                  #                        class: ms-1
                  #                      content:
                  #                        - "("
                  #                        - type: Count
                  #                          jsonPathPattern: $._bundleTrackers[*].bundleTracker..[?(@ && @["deployment-item"] && @["deployment-item"].isSelected != true)]
                  #                        - ")"
                  value: unselected_only
            - type: div
              attributes:
                class: fw-medium mb-3 fs-5
              content: Importability
            - type: div
              attributes:
                class: options-list fw-light
              content:
                - type: CheckBoxField
                  dataLocation: ~~._quickFilters.importabilityNew
                  options:
                    - label:
                        - New
                        # Commented due to performance drop.
                      #                        - type: span
                      #                          attributes:
                      #                            class: ms-1
                      #                          content:
                      #                            - "("
                      #                            - type: Count
                      #                              jsonPathPattern: $._bundleTrackers[*].bundleTracker..[?(@ && @["deployment-item"] && @["deployment-item"].importability.isNew)]
                      #                            - ")"
                      value: true
                - type: CheckBoxField
                  dataLocation: ~~._quickFilters.importabilityModified
                  options:
                    - label:
                        - Modified
                        # Commented due to performance drop.
                      #                        - type: span
                      #                          attributes:
                      #                            class: ms-1
                      #                          content:
                      #                            - "("
                      #                            - type: Count
                      #                              jsonPathPattern: $._bundleTrackers[*].bundleTracker..[?(@ && @["deployment-item"] && @["deployment-item"].importability.isModified)]
                      #                            - ")"
                      value: true
                - type: CheckBoxField
                  dataLocation: ~~._quickFilters.importabilityInConflict
                  options:
                    - label:
                        - In conflict
                        # Commented due to performance drop.
                      #                        - type: span
                      #                          attributes:
                      #                            class: ms-1
                      #                          content:
                      #                            - "("
                      #                            - type: Count
                      #                              jsonPathPattern: $._bundleTrackers[*].bundleTracker..[?(@ && @["deployment-item"] && @["deployment-item"].importability.isInConflict)]
                      #                            - ")"
                      value: true
                - type: CheckBoxField
                  dataLocation: ~~._quickFilters.importabilityMerged
                  options:
                    - label:
                        - Merged
                        # Commented due to performance drop.
                      #                        - type: span
                      #                          attributes:
                      #                            class: ms-1
                      #                          content:
                      #                            - "("
                      #                            - type: Count
                      #                              jsonPathPattern: $._bundleTrackers[*].bundleTracker..[?(@ && @["deployment-item"] && @["deployment-item"].importability.isMerged)]
                      #                            - ")"
                      value: true
                - type: CheckBoxField
                  dataLocation: ~~._quickFilters.importabilityTrackerConfigMismatch
                  options:
                    - label:
                        - Tracker config mismatch
                        # Commented due to performance drop.
                      #                        - type: span
                      #                          attributes:
                      #                            class: ms-1
                      #                          content:
                      #                            - "("
                      #                            - type: Count
                      #                              jsonPathPattern: $._bundleTrackers[*].bundleTracker..[?(@ && @["deployment-item"] && @["deployment-item"].importability.isTrackerConfigMismatch)]
                      #                            - ")"
                      value: true
        mainContent:
          type: section
          attributes:
            class: col main-content
          content:
            - type: div # Message container.
            # Bundle metadata.
            - type: div
              content:
                - type: div
                  attributes:
                    class: text-muted fs-6
                  content:
                    - type: span
                      content:
                        - 'Exported by: '
                        - ~~._exportedBy
            - type: div
              content:
                - type: div
                  attributes:
                    class: row mt-2
                  content:
                    - type: TextField
                      placeholder: Filter items
                      dataLocation: ~~._quickFilters.search
                      attributes:
                        class: col col-auto mt-2
                    - type: div
                      attributes:
                        class: col col-auto mt-2
                      content:
                        - type: DateField
                          dataLocation: ~~._quickFilters.since
                        - type: BsButton
                          attributes:
                            variant: link
                            class: link-date
                          content: Fill with the last generation date
                          actions:
                            - what: setData
                              on: click
                              path: ~~._quickFilters.since
                              value: ~~._bundleLastGenerationDate
            - type: div
              attributes:
                class: mt-3
              content:
                type: div
                attributes:
                  class: row justify-content-end
                content:
                  - type: BsButton
                    attributes:
                      class: col-auto link-collapse
                      variant: link
                    content: Collapse all
                    actions:
                      - what: triggerEvent
                        on: click
                        eventName: click
                        selectorBase: section.main-content
                        selector: .accordion-button:not(.collapsed)
                  - type: BsButton
                    attributes:
                      class: col-auto link-expand
                      variant: link
                    content: Expand all
                    actions:
                      - what: triggerEvent
                        on: click
                        eventName: click
                        selectorBase: section.main-content
                        selector: .accordion-button.collapsed


            - # Post types switch.
              type: ul
              attributes:
                class: "nav"
              content:
                type: Switch
                content: ~~.contentTypes
                singleOption:
                  load: contentTypeTab

            - type: BsAccordion
              attributes:
                alwaysOpen: true
                # defaultActiveKey is an array to support alwaysOpen.
                defaultActiveKey: ["0"]
              content:
                type: Switch
                content: ~~._bundleTrackers
                options:
                  bundleTracker:
                    load: deploy-sync-content--form-bundle-tracker

  deploy-sync-content--header:
    type: h2
    attributes:
      class: pb-2

  deploy-sync-content--depends-on-popover:
    type: div
    content:
      - type: li
        content:
          - type: BsButton
            attributes:
              variant: link
            content: ~.publicName
            actions:
              - what: setSearchedValue
                on: click
                searchContextId: "default"
                value: ~.uuid
              - what: tooltip
                content: ~.uuid

  deploy-sync-content--form-bundle-tracker-deployment-item-phantom:
    type: Phantom
    content:
      # Phantom on sub-items.
      - type: Switch
        cardinality: -1
        content: ~.subItems
        options:
          deployment-item:
            load: deploy-sync-content--form-bundle-tracker-deployment-item-phantom
    actions:
      # On message, propagate the "event" to the parent if any.
      # Only propagating "true" is needed, because we want to check the parent when the child is checked.
      - on: message
        when: ~.parentItemFullUuid
        isEmpty: not
        whenMessageIs:
          actor: item_selection_change
          changedValue: true
          itemFullUuid: ~.itemFullUuid
        what: postMessage
        message:
          actor: item_selection_change
          changedValue: true
          itemFullUuid: ~.parentItemFullUuid

      # On message asking to set to true, set the data to true.
      - on: message
        whenMessageIs:
          actor: item_selection_change
          changedValue: true
          itemFullUuid: ~.itemFullUuid
        what: setData
        path: ~.isSelected
        value: true

      # On message asking to set to false, set the data to false.
      - on: message
        whenMessageIs:
          actor: item_selection_change
          changedValue: false
          itemFullUuid: ~.itemFullUuid
        what: setData
        path: ~.isSelected
        value: false

      # On message asking the parent to set to true, set the data to true.
      - on: message
        when: ~.parentItemFullUuid
        isEmpty: not
        whenMessageIs:
          actor: item_selection_change
          changedValue: true
          itemFullUuid: ~.parentItemFullUuid
        what: postMessage
        message:
          actor: item_selection_change_propagate_down
          changedValue: true
          itemFullUuid: ~.itemFullUuid

      # On message asking the parent to set to false, set the data to false.
      - on: message
        when: ~.parentItemFullUuid
        isEmpty: not
        whenMessageIs:
          actor: item_selection_change
          changedValue: false
          itemFullUuid: ~.parentItemFullUuid
        what: postMessage
        message:
          actor: item_selection_change_propagate_down
          changedValue: false
          itemFullUuid: ~.itemFullUuid

      # On message, propagate the "event" down.
      # When parent is unchecked, uncheck this.
      - on: message
        when: ~.parentItemFullUuid
        isEmpty: not
        whenMessageIs:
          actor: item_selection_change_propagate_down
          changedValue: false
          itemFullUuid: ~.parentItemFullUuid
        what: postMessage
        message:
          actor: item_selection_change_propagate_down
          changedValue: false
          itemFullUuid: ~.itemFullUuid

      # On message, propagate the "event" down.
      # When parent is checked, check this.
      - on: message
        when: ~.parentItemFullUuid
        isEmpty: not
        whenMessageIs:
          actor: item_selection_change_propagate_down
          changedValue: true
          itemFullUuid: ~.parentItemFullUuid
        what: postMessage
        message:
          actor: item_selection_change_propagate_down
          changedValue: true
          itemFullUuid: ~.itemFullUuid

      # On message asking to set to true during down propagation, set the data to true.
      - on: message
        whenMessageIs:
          actor: item_selection_change_propagate_down
          changedValue: true
          itemFullUuid: ~.itemFullUuid
        what: setData
        path: ~.isSelected
        value: true

      # On message asking to set to false during down propagation, set the data to false.
      - on: message
        whenMessageIs:
          actor: item_selection_change_propagate_down
          changedValue: false
          itemFullUuid: ~.itemFullUuid
        what: setData
        path: ~.isSelected
        value: false

      # On tracker's "Select All" click, send a message.
      - what: postMessage
        on: message
        whenMessageIs:
          actor: select_all_tracker_items
          bundledStatus: ~.isBundled
          trackerId: ~.tracker
        message:
          actor: item_selection_change
          changedValue: true
          itemFullUuid: ~.itemFullUuid
      # On tracker's "Unselect All" click, send a message.
      - what: postMessage
        on: message
        whenMessageIs:
          actor: unselect_all_tracker_items
          bundledStatus: ~.isBundled
          trackerId: ~.tracker
        message:
          actor: item_selection_change
          changedValue: false
          itemFullUuid: ~.itemFullUuid
      # On tracker's "Unselect All" click, unselect this item.
      - what: setData
        on: message
        path: ~.isSelected
        value: false
        whenMessageIs:
          actor: unselect_all_tracker_items
          bundledStatus: ~.isBundled
          trackerId: ~.tracker

  deploy-sync-content--form-bundle-tracker-deployment-item:
    type: div
    attributes:
      class: d-flex mb-2 p-1 w-100 row-datas
      data-is-in-conflict: ~.importability.isInConflict
      data-is-modified: ~.importability.isModified
      data-is-new: ~.importability.isNew
      data-is-tracker-config-mismatch: ~.importability.isTrackerConfigMismatch
      data-item-full-uuid: ~.importability.itemFullUuid
    content:
      - type: div
        attributes:
          class: m-1
        content:
          isSelected:
            type: CheckBoxField
            options:
              - value: true
            actions:
              # On user interaction, send a message to self.
              - on: change
                what: postMessage
                includeChangedValue: true
                message:
                  actor: item_selection_change
                  itemFullUuid: ~.itemFullUuid

      - type: div
        attributes:
          class: col
        content:
          - type: div
            attributes:
              class: row g-0
            content:
              - type: div
                attributes:
                  class: col m-1
                content:
                  publicName:
                    - type: div
                      attributes:
                        class: col text-break
                      content:
                        - type: BsBadge
                          attributes:
                            bg: secondary
                            class: me-2
                            size: sm
                          content: ~.tracker
                          actions:
                            - what: hide
                              when: ~.parentItemFullUuid
                              isEmpty: yes
                        - type: span
                          content: ~.publicName
                          actions:
                            - what: tooltip
                              placement: top
                              content: ~.itemFullUuid
          #            - type: div
          #              content:
          #                type: a
          #                attributes:
          #                  href: /
          #                content: ~.subItems
          - type: div
            attributes:
              class: row g-0
            content:
              - type: div
                attributes:
                  class: col col-auto
                content:
                  - type: BsButton
                    attributes:
                      size: sm
                      variant: secondary
                    content: View sub-items
                    actions:
                      - what: setData
                        on: click
                        path: ~._viewSubItems
                        value: true
                      - what: hide
                        when: ~.subItems
                        isEmpty:
              - type: div
                attributes:
                  class: col col-auto
                content:
                  - type: BsButton
                    attributes:
                      size: sm
                      variant: link
                      class: btn-dependencies fw-lighter
                    content: View dependencies
                    actions:
                      - what: popover
                        trigger: click
                        header: "This item depends on:"
                        body:
                          - type: ul
                            attributes:
                              class: mb-0
                            content:
                              - type: Switch
                                content: ~.dependsOn
                                options:
                                  item:
                                    load: deploy-sync-content--depends-on-popover
                      - what: hide
                        orConditions:
                          - when: ~.dependsOn
                            isEmpty:
              - type: div
                attributes:
                  class: col col-auto
                content:
                  - type: BsBadge
                    content: Conflict
                    attributes:
                      bg: danger
                      class: m-1
                    actions:
                      - what: hide
                        when: ~.importability.isInConflict
                        isNot: true
                  - type: BsBadge
                    content: New
                    attributes:
                      bg: success
                      class: m-1
                    actions:
                      - what: hide
                        when: ~.importability.isNew
                        isNot: true
                  - type: BsBadge
                    content: Merged
                    attributes:
                      bg: warning
                      class: m-1
                    actions:
                      - what: hide
                        when: ~.importability.isMerged
                        isNot: true
                  - type: BsBadge
                    content: Tracker config mismatch
                    attributes:
                      bg: danger
                      class: m-1
                    actions:
                      - what: hide
                        when: ~.importability.isTrackerConfigMismatch
                        isNot: true
              - type: div
                attributes:
                  class: col col-auto ms-1
                  style:
                    display: flex
                    gap: 0.5em
                content:
                  type: Switch
                  cardinality: 3
                  content: ~.itemActions
                  options:
                    resolve:
                      type: div
                      content:
                        type: BsButton
                        attributes:
                          size: sm
                          variant: link
                        content: Resolve
                        actions:
                          - what: setData
                            on: click
                            path: ~._openResolveModal
                            value: true
                          - what: setData
                            on: message
                            whenMessageIs: closeResolveModal
                            path: ~._openResolveModal
                    seeChanges:
                      type: div
                      content:
                        type: BsButton
                        attributes:
                          size: sm
                          variant: link
                        content: See changes
                        actions:
                          - what: setData
                            on: click
                            path: ~._openDiffModal
                            value: true
                          - what: setData
                            on: message
                            whenMessageIs: closeDiffModal
                            path: ~._openDiffModal
              - type: Modal
                actions:
                  - what: hide
                    when: ~.mergeIframeUrl
                    isEmpty: yes
                attributes:
                  fullscreen: true
                  style:
                    zIndex: 100000
                closeButton: true
                body:
                  type: iframe
                  attributes:
                    src: ~.mergeIframeUrl
                    style:
                      height: 100%
                      width: 100%
                headerTitle:
                  - "Resolve the conflicts of "
                  - type: span
                    attributes:
                      class: fst-italic
                    content: ~.publicName
                showBoolPath: ~._openResolveModal
              - type: Modal
                actions:
                  - what: hide
                    when: ~.diffIframeUrl
                    isEmpty: yes
                attributes:
                  fullscreen: true
                  style:
                    zIndex: 100000
                closeButton: true
                body:
                  type: iframe
                  attributes:
                    src: ~.diffIframeUrl
                    style:
                      height: 100%
                      width: 100%
                headerTitle:
                  - "See changes of "
                  - type: span
                    attributes:
                      class: fst-italic
                    content: ~.publicName
                showBoolPath: ~._openDiffModal
          # Old system with a visually hidden item. Replaced by the Phantom component.
          # Remove this if confirmed working.
          #          # Sub items.
          #          - type: Switch
          #            cardinality: -1
          #            content: ~.subItems
          #            options:
          #              deployment-item:
          #                load: deploy-sync-content--form-bundle-tracker-deployment-item
          #            actions:
          #              # When the modal is shown, it will take over the event interception.
          #              - what: hide
          #                when: ~._viewSubItems
          #                is: true
          #              # When the modal is closed, always visually hide.
          #              # We keep this for event interception even when the Modal is closed.
          #              # This is not efficient, but it works.
          #              - what: visuallyHide
          ##                when: ~._viewSubItems
          ##                isNot: true
          - type: Modal
            attributes:
              style:
                zIndex: 100000
              size: lg
            closeButton: true
            body:
              type: Switch
              cardinality: -1
              content: ~.subItems
              options:
                deployment-item:
                  load: deploy-sync-content--form-bundle-tracker-deployment-item
            headerTitle:
              - "Sub-items of "
              - type: em
                content: ~.publicName
            showBoolPath: ~._viewSubItems

  contentTypeTab:
    type: li
    attributes:
      class: nav-item
    content:
      - type: button
        attributes:
          class: nav-link
          style:
            color: "var(--primary-color)"
        content:
          - ~.label
        actions:
          - what: hide
            when: ~~.__state.displayedPostType
            is: ~.type
          - what: setData
            on: click
            path: ~~.__state.displayedPostType
            value: ~.type
      - type: button
        attributes:
          class: nav-link
          style:
            backgroundColor: "var(--primary-color)"
            color: white
        content:
          - ~.label
        actions:
          - what: hide
            when: ~~.__state.displayedPostType
            isNot: ~.type
          - what: setData
            on: click
            path: ~~.__state.displayedPostType
            value: ~.type