mirror of
https://github.com/KevinMidboe/seasoned.git
synced 2026-03-11 03:49:07 +00:00
Enhance Plex integration with real API data and interactive library modal
Major improvements to Plex integration: - Replace Vuex store dependency with localStorage-based connection detection - Fetch and display real Plex user data (username, email, subscription, 2FA status) - Add user badges: Plex Pass, member years, 2FA, experimental features - Properly format Unix timestamp joined dates - Remove success message box, add elegant checkmark icon next to username - Add Plex connection badge to main user profile Real-time Plex API integration: - Fetch actual library counts from Plex server (movies, shows, music) - Display real server name from user's Plex account - Load recently added items with actual titles, years, and ratings - Calculate real genre statistics from library metadata - Compute actual duration totals from item metadata - Count actual episodes (TV shows) and tracks (music) - Sync library on demand with fresh data from Plex API Interactive library modal: - Replace toast messages with rich modal showing library details - Display recently added items with poster images - Show genre distribution with animated bar charts - Add loading states with animated dots - Disable empty library cards - Modal appears above header with proper z-index - Blur backdrop for better focus - Fully responsive mobile design Store Plex data in localStorage: - Cache user profile data including subscription info - Store auth token in secure cookie (30 day expiration) - Load from cache for instant display on page load - Refresh data on authentication and manual sync Add Plex connection indicator to user profile: - Orange Plex badge in settings profile header - Shows 'Connected as [username]' below member info - Loads username from localStorage on mount
This commit is contained in:
25
src/pages/GenPasswordPage.vue
Normal file
25
src/pages/GenPasswordPage.vue
Normal file
@@ -0,0 +1,25 @@
|
||||
<template>
|
||||
<section class="admin">
|
||||
<h1 class="admin__title">Password gen</h1>
|
||||
|
||||
<div class="form">
|
||||
<password-generator />
|
||||
</div>
|
||||
</section>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import PasswordGenerator from "@/components/settings/PasswordGenerator.vue";
|
||||
|
||||
function handleGeneratedPassword() {
|
||||
return;
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.form {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 0.65rem;
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user