Packages

phoenix_kit

1.7.21
1.7.208 1.7.207 1.7.206 1.7.205 1.7.204 1.7.203 1.7.202 1.7.201 1.7.200 1.7.199 1.7.198 1.7.197 1.7.196 1.7.194 1.7.193 1.7.192 1.7.191 1.7.190 1.7.189 1.7.187 1.7.186 1.7.185 1.7.184 1.7.183 1.7.182 1.7.181 1.7.180 1.7.179 1.7.178 1.7.177 1.7.176 1.7.175 1.7.174 1.7.173 1.7.172 1.7.171 1.7.170 1.7.169 1.7.168 1.7.167 1.7.166 1.7.165 1.7.164 1.7.162 1.7.161 1.7.160 1.7.159 1.7.157 1.7.156 1.7.155 1.7.154 1.7.153 1.7.152 1.7.151 1.7.150 1.7.149 1.7.146 1.7.145 1.7.144 1.7.143 1.7.138 1.7.133 1.7.132 1.7.131 1.7.130 1.7.128 1.7.126 1.7.125 1.7.121 1.7.120 1.7.119 1.7.118 1.7.117 1.7.116 1.7.115 1.7.114 1.7.113 1.7.112 1.7.111 1.7.110 1.7.109 1.7.108 1.7.107 1.7.106 1.7.105 1.7.104 1.7.103 1.7.102 1.7.101 1.7.100 1.7.99 1.7.98 1.7.97 1.7.96 1.7.95 1.7.94 1.7.93 1.7.92 1.7.91 1.7.90 1.7.89 1.7.88 1.7.87 1.7.86 1.7.85 1.7.84 1.7.83 1.7.82 1.7.81 1.7.80 1.7.79 1.7.78 1.7.77 1.7.76 1.7.75 1.7.74 1.7.71 1.7.70 1.7.69 1.7.66 1.7.65 1.7.64 1.7.63 1.7.62 1.7.61 1.7.59 1.7.58 1.7.57 1.7.56 1.7.55 1.7.54 1.7.53 1.7.52 1.7.51 1.7.49 1.7.44 1.7.43 1.7.42 1.7.41 1.7.39 1.7.38 1.7.37 1.7.36 1.7.34 1.7.33 1.7.31 1.7.30 1.7.29 1.7.28 1.7.27 1.7.26 1.7.25 1.7.24 1.7.23 1.7.22 1.7.21 1.7.20 1.7.19 1.7.18 1.7.17 1.7.16 1.7.15 1.7.14 1.7.13 1.7.12 1.7.11 1.7.10 1.7.9 1.7.8 1.7.7 1.7.6 1.7.5 1.7.4 1.7.3 1.7.2 1.7.1 1.7.0 1.6.20 1.6.19 1.6.18 1.6.17 1.6.16 1.6.15 1.6.14 1.6.13 1.6.12 1.6.11 1.6.10 1.6.9 1.6.8 1.6.7 1.6.6 1.6.5 1.6.4 1.6.3 1.5.2 1.5.1 1.5.0 1.4.9 1.4.8 1.4.7 1.4.6 1.4.5 1.4.4 1.4.3 1.4.2 1.4.1 1.4.0 1.3.2 1.3.1 1.3.0 1.2.10 1.2.9 1.2.8 1.2.7 1.2.5 1.2.4 1.2.2 1.2.1 1.2.0 1.1.0 1.0.0

A foundation for building Elixir Phoenix apps — SaaS, social networks, ERP systems, marketplaces, and more

HexDocs

Current section

Files

Jump to
Readme
222 Versions
37 Dependencies
Dependants
Files
Activity
phoenix_kit lib phoenix_kit_web live dashboard.html.heex
Raw

lib/phoenix_kit_web/live/dashboard.html.heex 

<PhoenixKitWeb.Components.LayoutWrapper.app_layout

  flash={@flash}

  phoenix_kit_current_scope={assigns[:phoenix_kit_current_scope]}

  page_title="{@project_title} Dashboard"

  current_path={@url_path}

  project_title={@project_title}

  current_locale={@current_locale}

>

  <div class="container flex-col mx-auto px-4 py-8">

    <div class="mb-8">

      <h1 class="text-3xl font-bold text-base-content mb-2">

        {@project_title} {gettext("Dashboard")}

      </h1>

      <p class="text-base-content/70">

        {gettext("Welcome to the %{project_title} administration panel",

          project_title: @project_title

        )}

      </p>

    </div>



    <%!-- Admin Menu Actions --%>

    <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-6 gap-6 mb-8">

      <.link

        navigate={PhoenixKit.Utils.Routes.path("/admin/users")}

        class="card bg-secondary text-secondary-content hover:shadow-lg transition-all"

      >

        <div class="card-body">

          <div class="flex items-center">

            <.icon name="hero-users" class="w-8 h-8 mr-3" />

            <div>

              <h3 class="card-title text-lg">{gettext("Users")}</h3>

              <p class="text-sm opacity-75">{gettext("User management")}</p>

            </div>

          </div>

        </div>

      </.link>



      <.link

        navigate={PhoenixKit.Utils.Routes.path("/admin/users/roles")}

        class="card bg-info text-info-content hover:shadow-lg transition-all"

      >

        <div class="card-body">

          <div class="flex items-center">

            <.icon name="hero-shield-check" class="w-8 h-8 mr-3" />

            <div>

              <h3 class="card-title text-lg">{gettext("Roles")}</h3>

              <p class="text-sm opacity-75">{gettext("Role management")}</p>

            </div>

          </div>

        </div>

      </.link>



      <.link

        navigate={PhoenixKit.Utils.Routes.path("/admin/users/sessions")}

        class="card bg-success text-success-content hover:shadow-lg transition-all"

      >

        <div class="card-body">

          <div class="flex items-center">

            <.icon name="hero-computer-desktop" class="w-8 h-8 mr-3" />

            <div>

              <h3 class="card-title text-lg">{gettext("Sessions")}</h3>

              <p class="text-sm opacity-75">{gettext("Active sessions")}</p>

            </div>

          </div>

        </div>

      </.link>



      <.link

        navigate={PhoenixKit.Utils.Routes.path("/admin/users/live_sessions")}

        class="card bg-warning text-warning-content hover:shadow-lg transition-all"

      >

        <div class="card-body">

          <div class="flex items-center">

            <.icon name="hero-eye" class="w-8 h-8 mr-3" />

            <div>

              <h3 class="card-title text-lg">{gettext("Live Activity")}</h3>

              <p class="text-sm opacity-75">{gettext("Real-time visitors")}</p>

            </div>

          </div>

        </div>

      </.link>



      <.link

        navigate={PhoenixKit.Utils.Routes.path("/admin/users/new")}

        class="card bg-primary text-primary-content hover:shadow-lg transition-all"

      >

        <div class="card-body">

          <div class="flex items-center">

            <.icon name="hero-user-plus" class="w-8 h-8 mr-3" />

            <div>

              <h3 class="card-title text-lg">{gettext("Add User")}</h3>

              <p class="text-sm opacity-75">{gettext("Create new account")}</p>

            </div>

          </div>

        </div>

      </.link>



      <%= if PhoenixKit.Modules.Emails.enabled?() do %>

        <.link

          navigate={PhoenixKit.Utils.Routes.path("/admin/emails")}

          class="card bg-purple-500 text-white hover:shadow-lg transition-all"

        >

          <div class="card-body">

            <div class="flex items-center">

              <.icon name="hero-envelope" class="w-8 h-8 mr-3" />

              <div>

                <h3 class="card-title text-lg">{gettext("Email")}</h3>

                <p class="text-sm opacity-75">{gettext("Email logs & analytics")}</p>

              </div>

            </div>

          </div>

        </.link>

      <% end %>



      <button

        phx-click="refresh_stats"

        class="card bg-accent text-accent-content hover:shadow-lg transition-all cursor-pointer"

      >

        <div class="card-body">

          <div class="flex items-center">

            <.icon name="hero-arrow-path" class="w-8 h-8 mr-3" />

            <div>

              <h3 class="card-title text-lg">{gettext("Refresh")}</h3>

              <p class="text-sm opacity-75">{gettext("Update statistics")}</p>

            </div>

          </div>

        </div>

      </button>

    </div>



    <%!-- Platform Statistics --%>

    <div class="mb-12">

      <h2 class="text-2xl font-bold text-base-content mb-8">

        {gettext("Platform Statistics")}

      </h2>



      <%!-- Main Statistics Cards --%>

      <div class="grid grid-cols-1 md:grid-cols-3 gap-8 mb-12">

        <%!-- System Owners Card --%>

        <PhoenixKitWeb.Components.Core.HeroStatCard.hero_stat_card

          value={@stats.owner_count}

          title={gettext("System Owners")}

          subtitle={gettext("Complete system authority")}

        >

          <:icon>

            <.icon name="hero-shield-check" class="w-6 h-6" />

          </:icon>

        </PhoenixKitWeb.Components.Core.HeroStatCard.hero_stat_card>



        <%!-- Administrators Card --%>

        <PhoenixKitWeb.Components.Core.HeroStatCard.hero_stat_card

          value={@stats.admin_count}

          title={gettext("Administrators")}

          subtitle={gettext("Management privileges")}

        >

          <:icon>

            <.icon name="hero-star" class="w-6 h-6" />

          </:icon>

        </PhoenixKitWeb.Components.Core.HeroStatCard.hero_stat_card>



        <%!-- Total Users Card --%>

        <PhoenixKitWeb.Components.Core.HeroStatCard.hero_stat_card

          value={@stats.total_users}

          title={gettext("Total Users")}

          subtitle={gettext("Registered accounts")}

        >

          <:icon>

            <.icon name="hero-users" class="w-6 h-6" />

          </:icon>

        </PhoenixKitWeb.Components.Core.HeroStatCard.hero_stat_card>

      </div>



      <%!-- Sessions Statistics --%>

      <div class="mb-8">

        <h3 class="text-xl font-bold text-base-content mb-4">{gettext("Active Sessions")}</h3>

        <div class="grid grid-cols-1 md:grid-cols-4 gap-4">

          <%!-- Total Active Sessions --%>

          <PhoenixKitWeb.Components.Core.StatCard.stat_card

            value={@session_stats.total_active}

            title={gettext("Active Sessions")}

            subtitle={gettext("Currently logged in")}

          >

            <:icon>

              <.icon name="hero-bolt" class="w-6 h-6" />

            </:icon>

          </PhoenixKitWeb.Components.Core.StatCard.stat_card>



          <%!-- Unique Users --%>

          <PhoenixKitWeb.Components.Core.StatCard.stat_card

            value={@session_stats.unique_users}

            title={gettext("Unique Users")}

            subtitle={gettext("With active sessions")}

          >

            <:icon>

              <.icon name="hero-user" class="w-6 h-6" />

            </:icon>

          </PhoenixKitWeb.Components.Core.StatCard.stat_card>



          <%!-- Today's Sessions --%>

          <PhoenixKitWeb.Components.Core.StatCard.stat_card

            value={@session_stats.sessions_today}

            title={gettext("Today's Sessions")}

            subtitle={gettext("New login activity")}

          >

            <:icon>

              <.icon name="hero-clock" class="w-6 h-6" />

            </:icon>

          </PhoenixKitWeb.Components.Core.StatCard.stat_card>



          <%!-- Expired Sessions --%>

          <PhoenixKitWeb.Components.Core.StatCard.stat_card

            value={@session_stats.expired_sessions}

            title={gettext("Expired Sessions")}

            subtitle={gettext("Need cleanup")}

          >

            <:icon>

              <.icon name="hero-no-symbol" class="w-6 h-6" />

            </:icon>

          </PhoenixKitWeb.Components.Core.StatCard.stat_card>

        </div>

      </div>



      <%!-- Real-Time Presence Statistics --%>

      <div class="mb-8">

        <h3 class="text-xl font-bold text-base-content mb-4">{gettext("Real-Time Activity")}</h3>

        <div class="grid grid-cols-1 md:grid-cols-4 gap-4">

          <%!-- Total Active Visitors --%>

          <PhoenixKitWeb.Components.Core.StatCard.stat_card

            value={@presence_stats.total_sessions}

            title={gettext("Active Visitors")}

            subtitle={gettext("Real-time connections")}

          >

            <:icon>

              <.icon name="hero-user-circle" class="w-6 h-6" />

            </:icon>

          </PhoenixKitWeb.Components.Core.StatCard.stat_card>



          <%!-- Anonymous Visitors --%>

          <PhoenixKitWeb.Components.Core.StatCard.stat_card

            value={@presence_stats.anonymous_sessions}

            title={gettext("Anonymous")}

            subtitle={gettext("Unregistered visitors")}

          >

            <:icon>

              <.icon name="hero-user" class="w-6 h-6" />

            </:icon>

          </PhoenixKitWeb.Components.Core.StatCard.stat_card>



          <%!-- Authenticated Users --%>

          <PhoenixKitWeb.Components.Core.StatCard.stat_card

            value={@presence_stats.authenticated_sessions}

            title={gettext("Authenticated")}

            subtitle={gettext("Logged in users")}

          >

            <:icon>

              <.icon name="hero-check-circle" class="w-6 h-6" />

            </:icon>

          </PhoenixKitWeb.Components.Core.StatCard.stat_card>



          <%!-- Unique Visitors --%>

          <PhoenixKitWeb.Components.Core.StatCard.stat_card

            value={

              @presence_stats.unique_anonymous_visitors +

                @presence_stats.active_authenticated_users

            }

            title={gettext("Unique Visitors")}

            subtitle={gettext("Individual connections")}

          >

            <:icon>

              <.icon name="hero-user-group" class="w-6 h-6" />

            </:icon>

          </PhoenixKitWeb.Components.Core.StatCard.stat_card>

        </div>

      </div>



      <%!-- Secondary Statistics - Gradient Cards --%>

      <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-5 gap-4">

        <%!-- Active Users --%>

        <PhoenixKitWeb.Components.Core.StatCard.stat_card

          rounded="2xl"

          value={@stats.active_users}

          title={gettext("Active Users")}

          subtitle={gettext("Currently online")}

        >

          <:icon>

            <.icon name="hero-check-circle-solid" class="w-6 h-6" />

          </:icon>

        </PhoenixKitWeb.Components.Core.StatCard.stat_card>



        <%!-- Inactive Users --%>

        <PhoenixKitWeb.Components.Core.StatCard.stat_card

          rounded="2xl"

          value={@stats.inactive_users}

          title={gettext("Inactive Users")}

          subtitle={gettext("Disabled accounts")}

        >

          <:icon>

            <.icon name="hero-x-circle-solid" class="w-6 h-6" />

          </:icon>

        </PhoenixKitWeb.Components.Core.StatCard.stat_card>



        <%!-- Email Confirmed --%>

        <PhoenixKitWeb.Components.Core.StatCard.stat_card

          rounded="2xl"

          value={@stats.confirmed_users}

          title={gettext("Email Confirmed")}

          subtitle={gettext("Verified emails")}

        >

          <:icon>

            <.icon name="hero-envelope" class="w-6 h-6" />

          </:icon>

        </PhoenixKitWeb.Components.Core.StatCard.stat_card>



        <%!-- Pending Email --%>

        <PhoenixKitWeb.Components.Core.StatCard.stat_card

          rounded="2xl"

          value={@stats.pending_users}

          title={gettext("Pending Email")}

          subtitle={gettext("Awaiting confirmation")}

        >

          <:icon>

            <.icon name="hero-information-circle-solid" class="w-6 h-6" />

          </:icon>

        </PhoenixKitWeb.Components.Core.StatCard.stat_card>



        <%!-- Regular Users --%>

        <PhoenixKitWeb.Components.Core.StatCard.stat_card

          rounded="2xl"

          value={@stats.user_count}

          title={gettext("Regular Users")}

          subtitle={gettext("Standard access level")}

        >

          <:icon>

            <.icon name="hero-user" class="w-6 h-6" />

          </:icon>

        </PhoenixKitWeb.Components.Core.StatCard.stat_card>

      </div>

    </div>



    <%!-- System Information --%>

    <div class="mb-8">

      <h2 class="text-2xl font-bold text-base-content mb-6">

        {gettext("System Information")}

      </h2>



      <div class="card bg-base-100 shadow-xl">

        <div class="card-body">

          <div class="grid grid-cols-1 md:grid-cols-4 gap-6">

            <div class="text-center">

              <div class="text-2xl font-bold text-primary mb-2">{@phoenix_kit_version}</div>

              <div class="text-sm text-base-content/70">{gettext("PhoenixKit Version")}</div>

            </div>

            <div class="text-center">

              <div class="text-2xl font-bold mb-2">

                <span class={

                  if @migration_db == @migration_current, do: "text-success", else: "text-warning"

                }>

                  V{@migration_db}

                </span>

                <span class="text-base-content/50">/</span>

                <span class="text-base-content/70">V{@migration_current}</span>

              </div>

              <div class="text-sm text-base-content/70">{gettext("DB / Latest Migration")}</div>

            </div>

            <div class="text-center">

              <div class="badge badge-success badge-lg mb-2">{gettext("Active")}</div>

              <div class="text-sm text-base-content/70">{gettext("Role System")}</div>

            </div>

            <div class="text-center">

              <div class="badge badge-success badge-lg mb-2">{gettext("Enabled")}</div>

              <div class="text-sm text-base-content/70">{gettext("Authentication")}</div>

            </div>

          </div>

        </div>

      </div>

    </div>

  </div>

</PhoenixKitWeb.Components.LayoutWrapper.app_layout>