6

frontend/src/menuAside.ts

@@ -4,7 +4,7 @@ import { MenuAsideItem } from './interfaces'
 const menuAside: MenuAsideItem[] = [
   {
     href: '/studio',
-    label: 'AI Music Generator Creator',
+    label: 'Music Studio',
     icon: icon.mdiMusicNotePlus,
   },
   {
@@ -133,6 +133,14 @@ const menuAside: MenuAsideItem[] = [
     icon: 'mdiLock' in icon ? icon['mdiLock' as keyof typeof icon] : icon.mdiTable ?? icon.mdiTable,
     permissions: 'READ_SYSTEM_SETTINGS'
   },
+  {
+    href: '/admin_access_keys/admin_access_keys-list',
+    label: 'Admin access keys',
+    // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+    // @ts-ignore
+    icon: 'mdiKey' in icon ? icon['mdiKey' as keyof typeof icon] : icon.mdiTable ?? icon.mdiTable,
+    permissions: 'READ_ADMIN_ACCESS_KEYS'
+  },
   {
     href: '/profile',
     label: 'Profile',

frontend/src/pages/dashboard.tsx

@@ -41,6 +41,7 @@ const Dashboard = () => {
     const [media_assets, setMedia_assets] = React.useState(loadingMessage);
     const [playback_sessions, setPlayback_sessions] = React.useState(loadingMessage);
     const [system_settings, setSystem_settings] = React.useState(loadingMessage);
+    const [admin_access_keys, setAdmin_access_keys] = React.useState(loadingMessage);
 
     
     const [widgetsRole, setWidgetsRole] = React.useState({
@@ -53,8 +54,8 @@ const Dashboard = () => {
     
     
     async function loadData() {
-        const entities = ['users','roles','permissions','languages','music_styles','eras','ai_voices','lyric_templates','songs','song_voice_tracks','lyric_sync_segments','generation_jobs','media_assets','playback_sessions','system_settings',];
+        const entities = ['users','roles','permissions','languages','music_styles','eras','ai_voices','lyric_templates','songs','song_voice_tracks','lyric_sync_segments','generation_jobs','media_assets','playback_sessions','system_settings','admin_access_keys',];
-        const fns = [setUsers,setRoles,setPermissions,setLanguages,setMusic_styles,setEras,setAi_voices,setLyric_templates,setSongs,setSong_voice_tracks,setLyric_sync_segments,setGeneration_jobs,setMedia_assets,setPlayback_sessions,setSystem_settings,];
+        const fns = [setUsers,setRoles,setPermissions,setLanguages,setMusic_styles,setEras,setAi_voices,setLyric_templates,setSongs,setSong_voice_tracks,setLyric_sync_segments,setGeneration_jobs,setMedia_assets,setPlayback_sessions,setSystem_settings,setAdmin_access_keys,];
 
         const requests = entities.map((entity, index) => {
           
@@ -106,7 +107,7 @@ const Dashboard = () => {
             main>
           <BaseButton
             href="/studio"
-            label="Open AI Music Generator"
+            label="Open Music Studio"
             icon={icon.mdiMusicNotePlus}
             color="info"
           />
@@ -575,6 +576,34 @@ const Dashboard = () => {
                     </div>
                 </div>
             </Link>}
+
+            {hasPermission(currentUser, 'READ_ADMIN_ACCESS_KEYS') && <Link href={'/admin_access_keys/admin_access_keys-list'}>
+                <div
+                    className={`${corners !== 'rounded-full'? corners : 'rounded-3xl'} dark:bg-dark-900 ${cardsStyle} dark:border-dark-700 p-6`}
+                >
+                    <div className="flex justify-between align-center">
+                        <div>
+                            <div className="text-lg leading-tight   text-gray-500 dark:text-gray-400">
+                              Admin access keys
+                            </div>
+                            <div className="text-3xl leading-tight font-semibold">
+                                {admin_access_keys}
+                            </div>
+                        </div>
+                        <div>
+                            <BaseIcon
+                                className={`${iconsColor}`}
+                                w="w-16"
+                                h="h-16"
+                                size={48}
+                                // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+                                // @ts-ignore
+                                path={'mdiKey' in icon ? icon['mdiKey' as keyof typeof icon] : icon.mdiTable || icon.mdiTable}
+                            />
+                        </div>
+                    </div>
+                </div>
+            </Link>}
           
           
         </div>

frontend/src/pages/index.tsx

@@ -10,12 +10,12 @@ import { mdiMusic, mdiAccountKey, mdiPlayCircle, mdiCloudDownload, mdiAutoFix }
 import BaseIcon from '../components/BaseIcon';
 
 export default function Home() {
-  const title = 'AI Music Generator Creator Pro';
+  const title = 'Music Studio Pro';
 
   return (
     <div className="bg-slate-950 text-white min-h-screen font-sans selection:bg-emerald-500/30">
       <Head>
-        <title>{getPageTitle('AI Music Generator Creator')}</title>
+        <title>{getPageTitle('Music Studio')}</title>
       </Head>
 
       {/* Hero Section */}
@@ -31,16 +31,16 @@ export default function Home() {
         <div className="z-10 container mx-auto px-6 flex flex-col items-center justify-center text-center py-20">
           <div className="inline-flex items-center space-x-2 px-3 py-1 rounded-full bg-emerald-500/10 border border-emerald-500/20 mb-8 animate-fade-in">
             <BaseIcon path={mdiAutoFix} size={16} className="text-emerald-400" />
-            <span className="text-xs font-medium text-emerald-400 tracking-wider uppercase">Next-Gen AI Generation</span>
+            <span className="text-xs font-medium text-emerald-400 tracking-wider uppercase">Next-Gen Audio Engineering</span>
           </div>
 
           <h1 className="text-5xl md:text-7xl font-extrabold tracking-tight mb-6 bg-clip-text text-transparent bg-gradient-to-b from-white to-slate-400">
-            Professional AI <br /> Music Generator
+            Professional <br /> Music Studio
           </h1>
           
           <p className="max-w-2xl text-lg md:text-xl text-slate-400 mb-10 leading-relaxed">
-            Generate studio-quality songs in seconds. Choose your style, era, and voice. 
+            Create studio-quality songs in seconds. Choose your style, era, and voice. 
-            Lyrics synchronization across 200+ languages with synchronized AI vocals.
+            Advanced music generation across 200+ languages with synchronized vocals.
           </p>
 
           <div className="flex flex-col sm:flex-row space-y-4 sm:space-y-0 sm:space-x-6">
@@ -54,7 +54,7 @@ export default function Home() {
             <Link href="/login">
               <button className="px-8 py-4 bg-slate-800 hover:bg-slate-700 text-white font-bold rounded-xl border border-slate-700 transition-all duration-300 flex items-center justify-center">
                 <BaseIcon path={mdiAccountKey} size={24} className="mr-2" />
-                ADMIN LOGIN
+                LOGIN
               </button>
             </Link>
           </div>
@@ -64,7 +64,7 @@ export default function Home() {
               { label: '200+ Languages', icon: mdiMusic },
               { label: 'Studio Voices', icon: mdiMusic },
               { label: 'Sync Lyrics', icon: mdiMusic },
-              { label: 'MP4 Download', icon: mdiCloudDownload }
+              { label: 'High-Quality Download', icon: mdiCloudDownload }
             ].map((feature, i) => (
               <div key={i} className="flex flex-col items-center p-4 rounded-2xl bg-slate-900/50 border border-slate-800">
                 <div className="w-10 h-10 rounded-full bg-emerald-500/10 flex items-center justify-center mb-3 text-emerald-400">

frontend/src/pages/login.tsx

@@ -1,5 +1,3 @@
-
-
 import React, { useEffect, useState } from 'react';
 import type { ReactElement } from 'react';
 import Head from 'next/head';
@@ -44,7 +42,7 @@ export default function Login() {
     password: '60682486',
     remember: true })
 
-  const title = 'AI Music Studio Admin'
+  const title = 'Music Studio Admin'
 
   // Fetch Pexels image/video
   useEffect( () => {
@@ -273,4 +271,4 @@ export default function Login() {
 
 Login.getLayout = function getLayout(page: ReactElement) {
   return <LayoutGuest>{page}</LayoutGuest>;
-};
+};

frontend/src/pages/studio/index.tsx

@@ -149,7 +149,7 @@ const StudioPage = () => {
   return (
     <>
       <HeadInstance>
-        <title>{getPageTitle('AI Music Generator Creator')}</title>
+        <title>{getPageTitle('Music Studio')}</title>
       </HeadInstance>
 
       <audio 
@@ -159,7 +159,7 @@ const StudioPage = () => {
       />
 
       <SectionMain>
-        <SectionTitleLineWithButton icon={mdiMusic} title="AI Music Generator Creator" main>
+        <SectionTitleLineWithButton icon={mdiMusic} title="Music Studio" main>
           <BaseButton
             href="/songs/songs-list"
             label="Library"