{%- set rendered_chunks = [] -%}
{%- set css_links = [] -%}
{%- set js_scripts = [] -%}
{%- macro collect_assets(chunk_name, level=0) -%}
    {% if chunk_name not in rendered_chunks %}
        {% set _ = rendered_chunks.append(chunk_name) %}
        {% set chunk = manifest[chunk_name] %}
        {% if chunk.css %}
            {% for css_file in chunk.css %}
                {% if css_file not in css_links %}
                    {% set _ = css_links.append((basename, css_file)) %}
                {% endif %}
            {% endfor %}
        {% endif %}
        {% if chunk.imports %}
            {% for import in chunk.imports %}
                {% set _ = collect_assets(import, level + 1) %}
            {% endfor %}
        {% endif %}
        {% if chunk.file.endswith('.js') %}
            {% if chunk.file not in js_scripts %}
                {% set _ = js_scripts.append((basename, chunk.file, level == 0)) %}
            {% endif %}
        {% elif chunk.file.endswith('.css') %}
            {% if chunk.file not in css_links %}
                {% set _ = css_links.append((basename, chunk.file)) %}
            {% endif %}
        {% endif %}
    {% endif %}
{%- endmacro -%}
{%- macro render_css() -%}
  {%- for basename, css_file in css_links -%}
    <link rel="stylesheet" href="{{ basename }}/{{ css_file }}">
  {% endfor -%}
{%- endmacro -%}
{%- macro render_js() -%}
  {%- for basename, js_file, is_entry in js_scripts -%}
    {%- if is_entry -%}
      <script type="module" src="{{ basename }}/{{ js_file }}"></script>
    {% else -%}
      <link rel="modulepreload" href="{{ basename }}/{{ js_file }}">
    {% endif -%}
  {%- endfor -%}
{%- endmacro -%}
<!DOCTYPE html>
<html>
  <head>
    <title>Phoenix</title>
    <link rel="icon" href="{{basename}}/favicon.ico" type="image/x-icon"></link>
    <meta charset="UTF-8" />
    <meta name="title" content="Arize Phoenix" />
    <meta name="description" content="AI Observability & Evaluation" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <meta property="og:title" content="Arize Phoenix" />
    <meta property="og:description" content="AI Observability & Evaluation" />
    <meta property="og:image" content="https://raw.githubusercontent.com/Arize-ai/phoenix-assets/main/images/socal/social-preview-horizontal.jpg" />
    <meta name="theme-color" content="#0e0e0e" />
    <script>
      // Apply the page background and theme-color before the app's CSS loads so
      // the first paint matches the user's saved theme (avoids a flash of the
      // wrong color). This mirrors the theme resolution in
      // app/src/contexts/ThemeContext.tsx and the gray-75 background tokens in
      // app/src/GlobalStyles.tsx; keep the values below in sync with those.
      (function () {
        try {
          var STORAGE_KEY = "arize-phoenix-theme";
          var DEFAULT_THEME = "dark";
          var BACKGROUND = { dark: "#0e0e0e", light: "#fdfdfd" };

          var saved = localStorage.getItem(STORAGE_KEY);
          var mode =
            saved === "light" || saved === "dark" || saved === "system"
              ? saved
              : DEFAULT_THEME;
          var theme =
            mode === "system"
              ? window.matchMedia("(prefers-color-scheme: dark)").matches
                ? "dark"
                : "light"
              : mode;

          var color = BACKGROUND[theme];
          document.documentElement.style.backgroundColor = color;
          var meta = document.querySelector('meta[name="theme-color"]');
          if (meta) meta.content = color;
        } catch (e) {
          // localStorage/matchMedia can throw in sandboxed iframes or when
          // site data is blocked; fall back to the static dark theme-color.
        }
      })();
    </script>
    {% if allow_external_resources %}
    <link rel="preconnect" href="https://fonts.googleapis.com">
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    <link href="https://fonts.googleapis.com/css2?family=Geist:wght@100..900&family=Geist+Mono:wght@100..900&display=swap" rel="stylesheet">
    {% endif %}
    {% if not is_development -%}
      {% set _ = collect_assets('index.tsx') -%}
      {{- render_css() -}}
    {%- endif -%}
    <script src="{{basename}}/modernizr.js"></script>
    {% if fullstory_org -%}
    <script>
      window['_fs_host'] = 'fullstory.com';
      window['_fs_script'] = 'edge.fullstory.com/s/fs.js';
      window['_fs_org'] = '{{ fullstory_org }}';
      window['_fs_namespace'] = 'FS';
      !function(m,n,e,t,l,o,g,y){var s,f,a=function(h){
      return!(h in m)||(m.console&&m.console.log&&m.console.log('FullStory namespace conflict. Please set window["_fs_namespace"].'),!1)}(e)
      ;function p(b){var h,d=[];function j(){h&&(d.forEach((function(b){var d;try{d=b[h[0]]&&b[h[0]](h[1])}catch(h){return void(b[3]&&b[3](h))}
      d&&d.then?d.then(b[2],b[3]):b[2]&&b[2](d)})),d.length=0)}function r(b){return function(d){h||(h=[b,d],j())}}return b(r(0),r(1)),{
      then:function(b,h){return p((function(r,i){d.push([b,h,r,i]),j()}))}}}a&&(g=m[e]=function(){var b=function(b,d,j,r){function i(i,c){
      h(b,d,j,i,c,r)}r=r||2;var c,u=/Async$/;return u.test(b)?(b=b.replace(u,""),"function"==typeof Promise?new Promise(i):p(i)):h(b,d,j,c,c,r)}
      ;function h(h,d,j,r,i,c){return b._api?b._api(h,d,j,r,i,c):(b.q&&b.q.push([h,d,j,r,i,c]),null)}return b.q=[],b}(),y=function(b){function h(h){
      "function"==typeof h[4]&&h[4](new Error(b))}var d=g.q;if(d){for(var j=0;j<d.length;j++)h(d[j]);d.length=0,d.push=h}},function(){
      (o=n.createElement(t)).async=!0,o.crossOrigin="anonymous",o.src="https://"+l,o.onerror=function(){y("Error loading "+l)}
      ;var b=n.getElementsByTagName(t)[0];b&&b.parentNode?b.parentNode.insertBefore(o,b):n.head.appendChild(o)}(),function(){function b(){}
      function h(b,h,d){g(b,h,d,1)}function d(b,d,j){h("setProperties",{type:b,properties:d},j)}function j(b,h){d("user",b,h)}function r(b,h,d){j({
      uid:b},d),h&&j(h,d)}g.identify=r,g.setUserVars=j,g.identifyAccount=b,g.clearUserCookie=b,g.setVars=d,g.event=function(b,d,j){h("trackEvent",{
      name:b,properties:d},j)},g.anonymize=function(){r(!1)},g.shutdown=function(){h("shutdown")},g.restart=function(){h("restart")},
      g.log=function(b,d){h("log",{level:b,msg:d})},g.consent=function(b){h("setIdentity",{consent:!arguments.length||b})}}(),s="fetch",
      f="XMLHttpRequest",g._w={},g._w[f]=m[f],g._w[s]=m[s],m[s]&&(m[s]=function(){return g._w[s].apply(this,arguments)}),g._v="2.0.0")
      }(window,document,window._fs_namespace,"script",window._fs_script);
      </script>
    {%- endif %}
  </head>
  <body>
    <div id="root"></div>
    <script>(function() {
      Object.defineProperty(window, "Config", {
          // Place any server-side injected config here
          // injected into the client before React runs
          value: Object.freeze({
              basename: "{{basename}}",
              platformVersion: "{{platform_version}}",
              authenticationEnabled: Boolean("{{authentication_enabled}}" == "True"),
              oAuth2Idps: {{ oauth2_idps | tojson }},
              basicAuthDisabled: Boolean("{{basic_auth_disabled}}" == "True"),
              ldapEnabled: Boolean("{{ldap_enabled}}" == "True"),
              ldapManualUserCreationEnabled: Boolean("{{ldap_manual_user_creation_enabled}}" == "True"),
              managementUrl: {{management_url | tojson}},
              supportEmail: {{support_email | tojson}},
              hasDbThreshold: Boolean("{{has_db_threshold}}" == "True"),
              allowExternalResources: Boolean("{{allow_external_resources}}" == "True"),
              agentAssistantDisabled: Boolean("{{agent_assistant_disabled}}" == "True"),
              agentBashDisabled: Boolean("{{agent_bash_disabled}}" == "True"),
              mcpServerEnabled: Boolean("{{mcp_server_enabled}}" == "True"),
              mcpCodeModeEnabled: Boolean("{{mcp_code_mode_enabled}}" == "True"),
              authErrorMessages: {{auth_error_messages | tojson}},
          }),
          writable: false
      });
  })()</script>
    {% if scarf_sh_pixel_id -%}
      <img referrerpolicy="no-referrer-when-downgrade" src="https://static.scarf.sh/a.png?x-pxid={{scarf_sh_pixel_id}}" style="position:absolute;width:0;height:0" />
    {%- endif %}
    {% if is_development -%}
      <script type="module">
        import RefreshRuntime from 'http://localhost:{{ vite_port }}/@react-refresh'
        RefreshRuntime.injectIntoGlobalHook(window)
        window.$RefreshReg$ = () => {}
        window.$RefreshSig$ = () => (type) => type
        window.__vite_plugin_react_preamble_installed__ = true
      </script>
      <script type="module" src="http://localhost:{{ vite_port }}/@vite/client"></script>
      <script type="module" src="http://localhost:{{ vite_port }}/index.tsx"></script>
    {%- else -%}
      {{- render_js() -}}
    {%- endif -%}
   </body>
</html>
