doctype html
html(lang="en")
  head
    meta(charset="UTF-8")

    title #{client.name || "My Personal Orbit"}

    meta(name="viewport", content="width=device-width, initial-scale=1.0")
    meta(http-equiv="X-UA-Compatible", content="ie=edge")

    if client.favicon
      link(rel="icon" type="image/png" href=`${client.favicon}`)
    else
      link(rel="icon" type="image/webp" href="./images/favicon.webp")

    link(rel="preconnect" href="https://fonts.gstatic.com")
    link(rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300;0,400;0,600;0,700;0,800;1,300;1,400;1,600;1,700;1,800&display=swap")

    link(rel='stylesheet', href='/styles/index.scss')

    if client.css
      link(rel='stylesheet', href=`${client.css}`)

    link(rel="manifest" href="/manifest.webmanifest")

    script(src="https://browser.sentry-cdn.com/5.25.0/bundle.tracing.min.js" defer)

    include orbit-envoy.pug

    script(src="index.js" defer)

    include orbit-dependencies.pug
    include orbit-context.pug

    //- swal2 does not work with skypack
    script(src="https://cdn.jsdelivr.net/npm/sweetalert2@10" defer)


  body.bg-color-grey

    if componentSet.has("autoLogin") || componentSet.has("registering")
      for component of components
        if component.type == "autoLogin"
          if component.parameters
            if component.parameters.authority
                sib-auth(style='display:none!important' auto-login)
                  sib-auth-provider(
                    data-authority=`${component.parameters.authority}`
                    data-id=`${component.parameters.authorityName || "authority"}`
                    data-client-name=`${client.name || "My Personal Orbit"}`
                  )
        if component.type == "registering"
          if component.parameters
            if component.parameters.authority
                sib-auth(style='display:none!important')
                  sib-auth-provider(
                    data-authority=`${component.parameters.authority}`
                    data-id=`${component.parameters.authorityName || "authority"}`
                    data-client-name=`${client.name || "My Personal Orbit"}`
                  )

    if componentSet.has("registering")
      include views/page-registering.pug

    .notLoggedIn(style='visibility:hidden;')

      nav#main__menu.scrollbar-nav.segment.bg-color-heading.text-top.quarter.text-disable-selection.jsLeftMenu
        include views/partials/menu-left.pug

      main#content.segment.three-quarter.sm-full.text-top

        header#header.segment.full.padding-left-xlarge.padding-right-medium.sm-padding-right-xsmall.sm-padding-left-small.shadow-small.text-disable-selection.bg-color-white
          include views/partials/header.pug

        include views/partials/widgets.pug

        for component of components

          if component.route
            //- Components declaration with route (no `route` attribute or `route`="something")
            div(
              id=component.route
              data-view=component.route
              hidden
            )

              //- Experimental routing
                  Codeless component loading
                  Eg.: 
                  ```
                    {
                      "type": "awesome",
                      "parameters": {
                        "dataSrc": "server://some-model/"
                      },
                      "experimental": [
                        "routing"
                      ]
                    }
                  ```
                  will generate a view vith a <solid-awesome data-src="http://server/some-model/"></solid-awesome>
              if component.experimental 
                if component.experimental.includes('routing')
                  .scrollbar-content.whitespace-normal.padding-top-xlarge.padding-right-xsmall.padding-bottom-xlarge.padding-left-xsmall.sm-padding-top-medium
                    #{"solid-"+component.type}&attributes(component.attributes)

              if component.type == "about"
                include views/page-about.pug

              if component.type == "chat"
                .whitespace-normal
                  orbit-reactivity(bind-user nested-field='inbox' target-src="store://user.contacts")
                  include views/page-messages.pug

              if component.type == "circles"
                .with-sidebar.whitespace-normal.jsMobileContentSidebarControl
                  orbit-reactivity(bind-user nested-field='inbox' target-src="store://user.circles")
                  orbit-reactivity(bind-user nested-field="circles" target-src="store://user")
                  orbit-reactivity(data-src=`${component.parameters.dataSrcJoinable}` target-src=`${component.parameters.dataSrc}`)
                  orbit-reactivity(data-src=`${component.parameters.post}` target-src=`${component.parameters.dataSrc}`)
                  orbit-reactivity(bind-user nested-field="circles" target-src=`${component.parameters.post}`)
                  orbit-reactivity(bind-user nested-field="circles" target-src=`${component.parameters.dataSrcJoinable}`)
                  orbit-reactivity(bind-user nested-field="circles" target-src=`${component.parameters.dataSrc}`)
                  include views/page-circle.pug

              if component.type == "communities"
                .scrollbar-content.whitespace-normal
                  include views/page-communities.pug

              if component.type == "events"
                .scrollbar-content.whitespace-normal.bg-color-white
                  include views/page-events.pug

              if component.type == "job-board"
                orbit-reactivity(data-src=`${component.parameters.dataSrcExpired}` target-src=`${component.parameters.dataSrc}`)
                orbit-reactivity(data-src=`${component.parameters.post}` target-src=`${component.parameters.dataSrc}`)
                orbit-reactivity(data-src=`${component.parameters.dataSrcExpired}` target-src=`${component.parameters.post}`)
                orbit-reactivity(bind-user nested-field="joboffers" target-src=`${component.parameters.dataSrc}`)
                orbit-reactivity(bind-user nested-field="joboffers" target-src=`${component.parameters.dataSrcExpired}`)
                orbit-reactivity(bind-user nested-field="joboffers" target-src=`${component.parameters.post}`)

              if component.type == "polls"
                .scrollbar-content
                  include views/page-polls.pug

              if component.type == "directory"
                orbit-reactivity(bind-user nested-field="profile" target-src="store://user")
                orbit-reactivity(bind-user nested-field="account" target-src="store://user")

              if component.type == "projects"
                .with-sidebar.whitespace-normal.jsMobileContentSidebarControl
                  orbit-reactivity(bind-user nested-field='inbox' target-src="store://user.projects")
                  orbit-reactivity(bind-user nested-field="projects" target-src="store://user")
                  orbit-reactivity(data-src=`${component.parameters.dataSrcJoinable}` target-src=`${component.parameters.dataSrc}`)
                  orbit-reactivity(data-src=`${component.parameters.dataSrcJoinable}` target-src=`${component.parameters.post}`)
                  orbit-reactivity(data-src=`${component.parameters.post}` target-src=`${component.parameters.dataSrc}`)
                  orbit-reactivity(bind-user nested-field="projects" target-src=`${component.parameters.post}`)
                  orbit-reactivity(bind-user nested-field="projects" target-src=`${component.parameters.dataSrcJoinable}`)
                  orbit-reactivity(bind-user nested-field="projects" target-src=`${component.parameters.dataSrc}`)
                  include views/page-project.pug

              if component.type == "resources"
                .scrollbar-content.bg-color-white
                  include views/page-resources.pug
          else
            //- Components declaration without any route (`route`="false") but that need some code declaration

            if component.type == "admin"
              include views/page-admin.pug

            if component.type == "analytics"
              if component.parameters
                if component.parameters.type && component.parameters.url && component.parameters.url
                  solid-analytics(
                    type=`${component.parameters.type}`
                    url=`${component.parameters.url}`
                    id=`${component.parameters.id}`
                  )

            if component.type == "notification"
              include views/partials/notifications.pug

            if component.type == "lang"
              orbit-lang(
                hidden
                lang=component.parameters.name
                file=component.parameters.file
              )

        if componentSet.has('directory')
          .scrollbar-content(
            id=`${getRoute("directory", true)}-profile`
            hidden
            data-view=`${getRoute("directory", true)}-profile`
            no-render
          )
            include views/page-profile.pug

        if componentSet.has('circles')
          div.scrollbar-content.bg-color-white(
            id=`${getComponent('circles').route}-left`
            hidden
            data-view=`${getComponent('circles').route}-left`
            no-render
          )
            include views/partials/circle/page-circle-left.pug

        if componentSet.has('projects')
          div.scrollbar-content.bg-color-white(
            id=`${getComponent('projects').route}-left`
            hidden
            data-view=`${getComponent('projects').route}-left`
            no-render
          )
            include views/partials/project/page-project-left.pug

    .loggedIn-loader.bg-color-grey.global-loader
      div
        div.loader
          div
          div
          div
          div
        div#something-goes-wrong(hidden)
          br
          span(data-trans="errors.somethingGoesWrong")
          span &nbsp;
          a(data-trans='errors.reload' href='/')

    if client.i18n
      orbit-fallback-lang(
        hidden
        lang=client.i18n.lang?client.i18n.lang:"fr"
      )&attributes({"force": client.i18n.force})

    div(
      id="swal-content-text"
      hidden
      data-trans="success")