lib/plausible_web/templates/stats/stats.html.heex

<div class={stats_container_class(@conn)} data-site-domain={@site.domain}>
  <PlausibleWeb.Components.FirstDashboardLaunchBanner.render site={@site} />

  <%= if Plausible.Teams.locked?(@site.team) do %>
    <div
      class="w-full px-4 py-4 text-sm font-bold text-center text-yellow-800 bg-yellow-100 rounded-sm transition"
      style="top: 91px"
      role="alert"
    >
      <p>This dashboard is actually locked. You are viewing it with super-admin access</p>
    </div>
  <% end %>

  <div
    id="stats-react-container"
    style="overflow-anchor: none;"
    data-domain={@site.domain}
    data-offset={Plausible.Site.tz_offset(@site)}
    data-has-goals={to_string(@has_goals)}
    data-conversions-opted-out={to_string(Plausible.Billing.Feature.Goals.opted_out?(@site))}
    data-funnels-opted-out={to_string(Plausible.Billing.Feature.Funnels.opted_out?(@site))}
    data-props-opted-out={to_string(Plausible.Billing.Feature.Props.opted_out?(@site))}
    data-funnels-available={
      to_string(Plausible.Billing.Feature.Funnels.check_availability(@site.team) == :ok)
    }
    data-props-available={
      to_string(Plausible.Billing.Feature.Props.check_availability(@site.team) == :ok)
    }
    data-site-segments-available={to_string(Plausible.Segments.site_segments_available?(@site))}
    data-site-annotations-available={
      to_string(Plausible.Annotations.site_annotations_available?(@site))
    }
    data-revenue-goals={Jason.encode!(@revenue_goals)}
    data-funnels={Jason.encode!(@funnels)}
    data-has-props={to_string(@has_props)}
    data-logged-in={to_string(!!@conn.assigns[:current_user])}
    data-stats-begin={@stats_start_date}
    data-native-stats-begin={@native_stats_start_date}
    data-shared-link-auth={assigns[:shared_link_auth]}
    data-embedded={to_string(@conn.assigns[:embedded])}
    data-background={@conn.assigns[:background]}
    data-is-dbip={to_string(@dbip?)}
    data-current-user-role={@site_role}
    data-current-user-id={
      if user = @conn.assigns[:current_user], do: user.id, else: Jason.encode!(nil)
    }
    data-flags={Jason.encode!(@flags)}
    data-segments={Jason.encode!(@segments)}
    data-is-consolidated-view={Jason.encode!(@consolidated_view?)}
    data-consolidated-view-available={Jason.encode!(@consolidated_view_available?)}
    data-exploration-available={
      to_string(Plausible.Billing.Feature.Funnels.check_availability(@site.team) == :ok)
    }
    data-exploration-journey-end-event={@exploration_journey_end_event}
    data-exploration-max-journey-steps={@exploration_max_journey_steps}
    data-team-identifier={@team_identifier}
    data-limited-to-segment-id={Jason.encode!(@limited_to_segment_id)}
  >
  </div>
  <div id="modal_root"></div>
  <%= if ee?() && !@conn.assigns[:current_user] && @conn.assigns[:demo] do %>
    <div class="py-12 lg:py-16 lg:flex lg:items-center lg:justify-between">
      <h2 class="text-3xl font-extrabold tracking-tight text-gray-900 leading-9 sm:text-4xl sm:leading-10 dark:text-gray-100">
        You just saw how Plausible tracks plausible.io <br />
        <span class="text-indigo-600">No cookies, no personal data, no Google</span>
      </h2>
      <div class="flex mt-8 lg:shrink-0 lg:mt-0">
        <div class="inline-flex shadow-sm rounded-md">
          <a
            href="/register"
            onclick="plausible('CTA Click', {props: {position: 'Bottom', type: 'Live demo', button: 'Start free trial'}})"
            class="inline-flex items-center justify-center px-5 py-3 text-base font-medium text-white bg-indigo-600 border border-transparent leading-6 rounded-md hover:bg-indigo-500 focus:outline-hidden focus:ring transition duration-150 ease-in-out"
          >
            Start free trial
          </a>
        </div>
        <div class="inline-flex ml-3 shadow-xs rounded-md">
          <a
            href="/#pricing"
            onclick="plausible('CTA Click', {props: {position: 'Bottom', type: 'Live demo', button: 'See pricing'}})"
            class="inline-flex items-center justify-center px-5 py-3 text-base font-medium text-indigo-600 bg-white border border-transparent leading-6 rounded-md dark:text-gray-100 dark:bg-gray-800 hover:text-indigo-500 dark:hover:text-indigo-500 focus:outline-hidden focus:ring transition duration-150 ease-in-out"
          >
            See pricing
          </a>
        </div>
      </div>
    </div>
  <% end %>
</div>