inicio

app/ui/dashboard.py

@@ -0,0 +1,138 @@
+from nicegui import ui
+from database import AppConfig
+from core.state import state
+
+def show():
+    semi_auto_initial = AppConfig.get_val('semi_auto', 'false') == 'true'
+
+    with ui.grid(columns=2).classes('w-full gap-4'):
+        
+        # --- COLUNA DA ESQUERDA: CONTROLES ---
+        with ui.column().classes('w-full gap-4'):
+            
+            # Painel de Controle
+            with ui.card().classes('w-full p-4 border-l-4 border-indigo-500'):
+                ui.label('🎛️ Painel de Controle').classes('text-xl font-bold mb-4 text-gray-700')
+                
+                # Switches
+                is_running = state.watcher.is_running if state.watcher else False
+                
+                def toggle_watcher(e):
+                    if state.watcher:
+                        state.watcher.is_running = e.value
+                        state.log(f"Comando: {'INICIAR' if e.value else 'PAUSAR'}")
+
+                switch_run = ui.switch('Monitoramento Ativo', value=is_running, on_change=toggle_watcher).props('color=green size=lg')
+
+                def toggle_semi_auto(e):
+                    AppConfig.set_val('semi_auto', str(e.value).lower())
+                    state.log(f"⚠️ Semi-Auto: {e.value}")
+
+                switch_auto = ui.switch('Modo Semi-Automático', value=semi_auto_initial, on_change=toggle_semi_auto).props('color=amber size=lg')
+                
+                # Botão Cancelar Global
+                def cancel_task():
+                    if state.watcher: 
+                        state.watcher.abort_current_task()
+                        ui.notify('Cancelando...', type='warning')
+
+                btn_cancel = ui.button('CANCELAR ATUAL', on_click=cancel_task, icon='cancel').props('color=red').classes('w-full mt-4 hidden')
+
+            # Terminal de Logs
+            with ui.card().classes('w-full h-64 bg-black text-green-400 font-mono text-xs p-2 overflow-hidden flex flex-col'):
+                ui.label('>_ Logs').classes('text-gray-500 mb-1 border-b border-gray-800 w-full')
+                log_container = ui.scroll_area().classes('flex-grow w-full')
+                log_content = ui.label().style('white-space: pre-wrap; font-family: monospace;')
+                with log_container: log_content.move(log_container)
+
+        # --- COLUNA DA DIREITA: LISTA DE TAREFAS (Igual ao antigo) ---
+        with ui.card().classes('w-full h-[80vh] bg-gray-50 flex flex-col p-0'):
+            # Cabeçalho da Lista
+            with ui.row().classes('w-full p-4 bg-white border-b items-center justify-between'):
+                ui.label('📋 Fila de Processamento').classes('text-lg font-bold text-gray-700')
+                lbl_status_top = ui.label('Ocioso').classes('text-sm text-gray-400')
+
+            # Container da Lista (Onde a mágica acontece)
+            tasks_container = ui.column().classes('w-full p-2 gap-2 overflow-y-auto flex-grow')
+
+    # --- RENDERIZADOR DA LISTA ---
+    def render_tasks():
+        tasks_container.clear()
+        
+        # Se não tiver tarefas
+        if not state.tasks:
+            with tasks_container:
+                ui.label('Nenhuma atividade recente.').classes('text-gray-400 italic p-4')
+            return
+
+        # Itera sobre as tarefas (reversed para mais recentes no topo)
+        for fname, data in reversed(state.tasks.items()):
+            status = data['status']
+            pct = data['progress']
+            label = data['label']
+            
+            # Estilo baseado no status (Igual ao seu código antigo)
+            icon = 'circle'; color = 'grey'; spin = False
+            bg_color = 'bg-white'
+            
+            if status == 'pending': 
+                icon = 'hourglass_empty'; color = 'grey'
+            elif status == 'running': 
+                icon = 'sync'; color = 'blue'; spin = True
+                bg_color = 'bg-blue-50 border-blue-200 border'
+            elif status == 'warning':
+                icon = 'warning'; color = 'orange'
+                bg_color = 'bg-orange-50 border-orange-200 border'
+            elif status == 'done': 
+                icon = 'check_circle'; color = 'green'
+            elif status == 'error': 
+                icon = 'error'; color = 'red'
+            elif status == 'skipped': 
+                icon = 'block'; color = 'red'
+
+            with tasks_container:
+                with ui.card().classes(f'w-full p-2 {bg_color} flex-row items-center gap-3'):
+                    # Ícone
+                    if spin: ui.spinner(size='sm').classes('text-blue-500')
+                    else: ui.icon(icon, color=color, size='sm')
+                    
+                    # Conteúdo
+                    with ui.column().classes('flex-grow gap-0'):
+                        ui.label(label).classes('font-bold text-sm text-gray-800 truncate')
+                        ui.label(fname).classes('text-xs text-gray-500 truncate')
+                        
+                        # Barra de Progresso (Só aparece se estiver rodando)
+                        if status == 'running':
+                            with ui.row().classes('w-full items-center gap-2 mt-1'):
+                                ui.linear_progress(value=pct/100, show_value=False).classes('h-2 rounded flex-grow')
+                                ui.label(f"{int(pct)}%").classes('text-xs font-bold text-blue-600')
+
+    # --- LOOP DE ATUALIZAÇÃO ---
+    def update_ui():
+        # 1. Logs
+        logs = state.get_logs()
+        log_content.set_text("\n".join(logs[-30:]))
+        log_container.scroll_to(percent=1.0)
+
+        # 2. Re-renderiza a lista de tarefas
+        # Nota: O NiceGUI é eficiente, mas para listas muito grandes seria melhor atualizar in-place.
+        # Como limitamos a 20 itens no state, limpar e redesenhar é rápido e seguro.
+        render_tasks()
+
+        # 3. Controles Globais
+        if state.watcher and state.watcher.is_running:
+            lbl_status_top.text = "Serviço Rodando"
+            lbl_status_top.classes(replace='text-green-500')
+            switch_run.value = True
+        else:
+            lbl_status_top.text = "Serviço Pausado"
+            lbl_status_top.classes(replace='text-red-400')
+            switch_run.value = False
+
+        # 4. Botão Cancelar
+        if state.current_file:
+            btn_cancel.classes(remove='hidden')
+        else:
+            btn_cancel.classes(add='hidden')
+
+    ui.timer(1.0, update_ui) # Atualiza a cada 1 segundo

app/ui/layout.py

@@ -0,0 +1,19 @@
+from nicegui import ui
+
+def create_interface():
+    # Cabeçalho Azul
+    with ui.header().classes('bg-blue-900 text-white'):
+        ui.button(on_click=lambda: left_drawer.toggle(), icon='menu').props('flat color=white')
+        ui.label('Clei-Flow').classes('text-xl font-bold')
+        
+    # Menu Lateral
+    with ui.left_drawer().classes('bg-gray-100').props('width=200') as left_drawer:
+        ui.label('MENU').classes('text-gray-500 text-xs font-bold mb-2 px-4 pt-4')
+        
+        # Helper para criar links
+        def nav_link(text, target, icon_name):
+            ui.link(text, target).classes('text-gray-700 hover:text-blue-600 block px-4 py-2 font-medium').props(f'icon={icon_name}')
+            
+        nav_link('Dashboard', '/', 'dashboard')
+        nav_link('Explorador', '/explorer', 'folder')
+        nav_link('Configurações', '/settings', 'settings')

app/ui/manual_tools.py

@@ -0,0 +1,2 @@
+from nicegui import ui
+# Abas antigas (Renomeador Manual, Encoder Manual) viram ferramentas aqui

app/ui/settings.py

@@ -0,0 +1,326 @@
+from nicegui import ui
+import os
+from database import Category, FFmpegProfile, AppConfig
+
+# Lista de idiomas (ISO 639-2)
+ISO_LANGS = {
+    'por': 'Português (por)', 'eng': 'Inglês (eng)', 'jpn': 'Japonês (jpn)',
+    'spa': 'Espanhol (spa)', 'fra': 'Francês (fra)', 'ger': 'Alemão (ger)',
+    'ita': 'Italiano (ita)', 'rus': 'Russo (rus)', 'und': 'Indefinido (und)'
+}
+
+# --- COMPONENTE: SELETOR DE PASTAS (Restrito ao /media) ---
+async def pick_folder_dialog(start_path='/media'):
+    """Abre um modal para escolher pastas, restrito a /media"""
+    ALLOWED_ROOT = '/media'
+    
+    # Garante que começa dentro do permitido
+    if not start_path or not start_path.startswith(ALLOWED_ROOT):
+        start_path = ALLOWED_ROOT
+        
+    result = {'path': None}
+    
+    with ui.dialog() as dialog, ui.card().classes('w-96 h-[500px] flex flex-col'):
+        ui.label('Selecionar Pasta (/media)').classes('font-bold text-lg mb-2')
+        path_label = ui.label(start_path).classes('text-xs bg-gray-100 p-2 border rounded w-full break-all font-mono')
+        
+        scroll = ui.scroll_area().classes('flex-grow border rounded p-1 mt-2 bg-white')
+        
+        async def load_dir(path):
+            # Segurança extra
+            if not path.startswith(ALLOWED_ROOT): path = ALLOWED_ROOT
+            
+            path_label.text = path
+            scroll.clear()
+            
+            try:
+                # Botão Voltar (Só aparece se NÃO estiver na raiz permitida)
+                if path != ALLOWED_ROOT:
+                    parent = os.path.dirname(path)
+                    # Garante que o parent não suba além do permitido
+                    if not parent.startswith(ALLOWED_ROOT): parent = ALLOWED_ROOT
+                    
+                    with scroll:
+                        ui.button('.. (Voltar)', on_click=lambda: load_dir(parent)).props('flat dense icon=arrow_upward align=left w-full')
+
+                # Lista Pastas
+                with scroll:
+                    # Tenta listar. Se diretório não existir (ex: nome novo), mostra vazio
+                    if os.path.exists(path):
+                        for entry in sorted([e for e in os.scandir(path) if e.is_dir()], key=lambda x: x.name.lower()):
+                            ui.button(entry.name, on_click=lambda p=entry.path: load_dir(p)).props('flat dense icon=folder align=left w-full color=amber-8')
+                    else:
+                        ui.label('Pasta não criada ainda.').classes('text-gray-400 italic p-2')
+                        
+            except Exception as e:
+                with scroll: ui.label(f'Erro: {e}').classes('text-red text-xs')
+
+        def select_this():
+            result['path'] = path_label.text
+            dialog.close()
+
+        with ui.row().classes('w-full justify-between mt-auto pt-2'):
+            ui.button('Cancelar', on_click=dialog.close).props('flat color=grey')
+            ui.button('Selecionar Esta', on_click=select_this).props('flat icon=check color=green')
+
+        await load_dir(start_path)
+        await dialog
+        return result['path']
+
+# --- TELA PRINCIPAL ---
+def show():
+    with ui.column().classes('w-full p-6'):
+        ui.label('Configurações').classes('text-3xl font-light text-gray-800 mb-4')
+        
+        with ui.tabs().classes('w-full') as tabs:
+            tab_ident = ui.tab('Identificação', icon='search')
+            tab_cats = ui.tab('Categorias', icon='category')
+            tab_deploy = ui.tab('Deploy & Caminhos', icon='move_to_inbox')
+            tab_ffmpeg = ui.tab('Motor (FFmpeg)', icon='movie')
+            tab_telegram = ui.tab('Telegram', icon='send')
+            
+        with ui.tab_panels(tabs, value=tab_ident).classes('w-full bg-gray-50 p-4 rounded border'):
+            
+            # --- ABA 1: IDENTIFICAÇÃO ---
+            with ui.tab_panel(tab_ident):
+                with ui.card().classes('w-full max-w-2xl mx-auto p-6'):
+                    ui.label('🔍 Configuração do Identificador').classes('text-2xl font-bold mb-4 text-indigo-600')
+                    tmdb_key = AppConfig.get_val('tmdb_api_key', '')
+                    lang = AppConfig.get_val('tmdb_language', 'pt-BR')
+                    confidence = AppConfig.get_val('min_confidence', '90')
+
+                    ui.label('API Key do TMDb').classes('font-bold text-sm')
+                    key_input = ui.input(placeholder='Ex: 8a9b...', value=tmdb_key).props('password').classes('w-full mb-4')
+                    ui.markdown('[Clique aqui para pegar sua API Key](https://www.themoviedb.org/settings/api)').classes('text-xs text-blue-500 mb-6')
+                    
+                    with ui.grid(columns=2).classes('w-full gap-4'):
+                        lang_input = ui.input('Idioma', value=lang, placeholder='pt-BR')
+                        conf_input = ui.number('Confiança Auto (%)', value=int(confidence), min=50, max=100)
+
+                    def save_ident():
+                        AppConfig.set_val('tmdb_api_key', key_input.value)
+                        AppConfig.set_val('tmdb_language', lang_input.value)
+                        AppConfig.set_val('min_confidence', str(int(conf_input.value)))
+                        ui.notify('Salvo!', type='positive')
+
+                    ui.button('Salvar', on_click=save_ident).props('icon=save color=indigo').classes('w-full mt-6')
+
+# --- ABA 2: CATEGORIAS (ATUALIZADA) ---
+            with ui.tab_panel(tab_cats):
+                ui.label('Bibliotecas e Tipos').classes('text-xl text-gray-700 mb-2')
+                
+                cats_container = ui.column().classes('w-full gap-2')
+
+                def load_cats():
+                    cats_container.clear()
+                    cats = list(Category.select())
+                    if not cats: ui.label('Nenhuma categoria.').classes('text-gray-400')
+                    
+                    for cat in cats:
+                        # Define ícone e cor baseados no tipo
+                        icon = 'movie' if cat.content_type == 'movie' else 'tv'
+                        if cat.content_type == 'mixed': icon = 'shuffle'
+                        
+                        color_cls = 'bg-blue-50 border-blue-200'
+                        if cat.content_type == 'series': color_cls = 'bg-green-50 border-green-200'
+                        if cat.content_type == 'mixed': color_cls = 'bg-purple-50 border-purple-200'
+
+                        with cats_container, ui.card().classes(f'w-full flex-row items-center justify-between p-3 border {color_cls}'):
+                            with ui.row().classes('items-center gap-4'):
+                                ui.icon(icon).classes('text-gray-600')
+                                with ui.column().classes('gap-0'):
+                                    ui.label(cat.name).classes('font-bold text-lg')
+                                    # Mostra o tipo visualmente
+                                    type_map = {'movie': 'Só Filmes', 'series': 'Só Séries', 'mixed': 'Misto (Filmes e Séries)'}
+                                    ui.label(f"Tipo: {type_map.get(cat.content_type, 'Misto')} | Tags: {cat.match_keywords}").classes('text-xs text-gray-500')
+                            
+                            ui.button(icon='delete', color='red', on_click=lambda c=cat: delete_cat(c)).props('flat dense')
+
+                def add_cat():
+                    if not name_input.value: return
+                    try:
+                        Category.create(
+                            name=name_input.value, 
+                            target_path=f"/media/{name_input.value}", 
+                            match_keywords=keywords_input.value,
+                            content_type=type_select.value # Salva o tipo escolhido
+                        )
+                        name_input.value = ''; keywords_input.value = ''
+                        ui.notify('Categoria criada!', type='positive')
+                        load_cats()
+                    except Exception as e: ui.notify(f'Erro: {e}', type='negative')
+
+                def delete_cat(cat): 
+                    cat.delete_instance()
+                    load_cats()
+
+                # Formulário de Criação
+                with ui.card().classes('w-full mb-4 bg-gray-100 p-4'):
+                    ui.label('Nova Biblioteca').classes('font-bold text-gray-700')
+                    with ui.row().classes('w-full items-start gap-2'):
+                        name_input = ui.input('Nome (ex: Animes)').classes('w-1/4')
+                        keywords_input = ui.input('Tags (ex: anime, animation)').classes('w-1/4')
+                        
+                        # NOVO SELETOR DE TIPO
+                        type_select = ui.select({
+                            'mixed': 'Misto (Filmes e Séries)',
+                            'movie': 'Apenas Filmes',
+                            'series': 'Apenas Séries'
+                        }, value='mixed', label='Tipo de Conteúdo').classes('w-1/4')
+                        
+                        ui.button('Adicionar', on_click=add_cat).props('icon=add color=green').classes('mt-2')
+                
+                load_cats()
+ # --- ABA 3: DEPLOY & CAMINHOS ---
+            with ui.tab_panel(tab_deploy):
+                
+                # Helper para o Picker funcionar com categorias ou solto
+                async def open_picker(input_element):
+                    # Seletor de pastas (inicia onde estiver escrito no input ou na raiz)
+                    start = input_element.value if input_element.value else '/'
+                    selected = await pick_folder_dialog(start)
+                    if selected: input_element.value = selected
+
+                # --- 1. CONFIGURAÇÃO DA ORIGEM (MONITORAMENTO) ---
+                with ui.card().classes('w-full mb-6 border-l-4 border-amber-500 bg-amber-50'):
+                    ui.label('📡 Origem dos Arquivos').classes('text-lg font-bold mb-2 text-amber-900')
+                    ui.label('Qual pasta o Clei-Flow deve vigiar?').classes('text-xs text-amber-700 mb-2')
+                    
+                    monitor_path = AppConfig.get_val('monitor_path', '/downloads')
+                    
+                    with ui.row().classes('w-full items-center gap-2'):
+                        mon_input = ui.input('Pasta Monitorada (Container)', value=monitor_path).classes('flex-grow font-mono bg-white rounded px-2')
+                        # Botão de Pasta (reutilizando o dialog, mas permitindo sair do /media se quiser, ou ajustamos o dialog depois)
+                        # Nota: O pick_folder_dialog atual trava em /media. Se sua pasta de downloads for fora, 
+                        # precisaremos liberar o picker. Por enquanto assumimos que o usuário digita ou está montado.
+                        ui.button(icon='folder', on_click=lambda i=mon_input: open_picker(i)).props('flat dense color=amber-9')
+                    
+                    def save_monitor():
+                        if not mon_input.value.startswith('/'):
+                            ui.notify('Caminho deve ser absoluto (/...)', type='warning'); return
+                        AppConfig.set_val('monitor_path', mon_input.value)
+                        ui.notify('Pasta de monitoramento salva! (Reinicie se necessário)', type='positive')
+                        
+                    ui.button('Salvar Origem', on_click=save_monitor).classes('mt-2 bg-amber-600 text-white')
+
+                ui.separator()
+
+                # --- 2. REGRAS GLOBAIS DE DEPLOY ---
+                with ui.card().classes('w-full mb-6 border-l-4 border-indigo-500'):
+                    ui.label('⚙️ Regras de Destino (Deploy)').classes('font-bold mb-2')
+                    deploy_mode = AppConfig.get_val('deploy_mode', 'move')
+                    conflict_mode = AppConfig.get_val('conflict_mode', 'skip')
+                    cleanup = AppConfig.get_val('cleanup_empty_folders', 'true')
+
+                    with ui.grid(columns=2).classes('w-full gap-4'):
+                        mode_select = ui.select({'move': 'Mover (Recortar)', 'copy': 'Copiar'}, value=deploy_mode, label='Modo')
+                        conflict_select = ui.select({'skip': 'Ignorar', 'overwrite': 'Sobrescrever', 'rename': 'Renomear Auto'}, value=conflict_mode, label='Conflito')
+                    
+                    cleanup_switch = ui.switch('Limpar pastas vazias na origem', value=(cleanup == 'true')).classes('mt-2')
+
+                    def save_global_deploy():
+                        AppConfig.set_val('deploy_mode', mode_select.value)
+                        AppConfig.set_val('conflict_mode', conflict_select.value)
+                        AppConfig.set_val('cleanup_empty_folders', str(cleanup_switch.value).lower())
+                        ui.notify('Regras salvas!', type='positive')
+                    ui.button('Salvar Regras', on_click=save_global_deploy).classes('mt-2')
+
+                ui.separator()
+                
+                # --- 3. MAPEAMENTO DE DESTINOS ---
+                ui.label('📂 Mapeamento de Destinos (/media)').classes('text-xl text-gray-700 mt-4')
+                paths_container = ui.column().classes('w-full gap-2')
+
+                def save_cat_path(cat, new_path):
+                    if not new_path.startswith('/media'):
+                        ui.notify('O caminho deve começar com /media', type='warning'); return
+                    cat.target_path = new_path
+                    cat.save()
+                    ui.notify(f'Caminho de "{cat.name}" salvo!')
+
+                def load_deploy_paths():
+                    paths_container.clear()
+                    cats = list(Category.select())
+                    if not cats: return
+                    for cat in cats:
+                        with paths_container, ui.card().classes('w-full p-4 flex-row items-center gap-4'):
+                            with ui.column().classes('min-w-[150px]'):
+                                ui.label(cat.name).classes('font-bold')
+                            ui.icon('arrow_forward', color='gray')
+                            with ui.row().classes('flex-grow items-center gap-2'):
+                                path_input = ui.input(value=cat.target_path).classes('flex-grow font-mono')
+                                ui.button(icon='folder', on_click=lambda i=path_input: open_picker(i)).props('flat dense color=amber-8')
+                            ui.button(icon='save', on_click=lambda c=cat, p=path_input: save_cat_path(c, p.value)).props('flat round color=green')
+
+                load_deploy_paths()
+                ui.button('Recarregar', on_click=load_deploy_paths, icon='refresh').props('flat dense').classes('mt-2 self-center')
+
+            # --- ABA 4: FFMPEG (Com VAAPI) ---
+            with ui.tab_panel(tab_ffmpeg):
+                ui.label('Perfis de Conversão').classes('text-xl text-gray-700')
+                
+                # 1. Carrega dados
+                profiles_query = list(FFmpegProfile.select())
+                profiles_dict = {p.id: p.name for p in profiles_query}
+                
+                # 2. Ativo
+                active_profile = next((p for p in profiles_query if p.is_active), None)
+                initial_val = active_profile.id if active_profile else None
+                
+                # 3. Função
+                def set_active_profile(e):
+                    if not e.value: return
+                    FFmpegProfile.update(is_active=False).execute()
+                    FFmpegProfile.update(is_active=True).where(FFmpegProfile.id == int(e.value)).execute()
+                    ui.notify(f'Perfil "{profiles_dict[e.value]}" ativado!', type='positive')
+
+                # 4. Select
+                select_profile = ui.select(profiles_dict, value=initial_val, label='Perfil Ativo', on_change=set_active_profile).classes('w-64 mb-6')
+                
+                ui.separator()
+                
+                # Editor
+                for p in profiles_query:
+                    with ui.expansion(f"{p.name}", icon='tune').classes('w-full bg-white mb-2 border rounded'):
+                        with ui.column().classes('p-4 w-full'):
+                            with ui.grid(columns=2).classes('w-full gap-4'):
+                                c_name = ui.input('Nome', value=p.name)
+                                c_codec = ui.select({
+                                    'h264_vaapi': 'Intel VAAPI (Linux/Docker)', 
+                                    'h264_qsv': 'Intel QuickSync', 
+                                    'h264_nvenc': 'Nvidia NVENC', 
+                                    'libx264': 'CPU', 
+                                    'copy': 'Copy'
+                                }, value=p.video_codec, label='Codec')
+                                c_preset = ui.select(['fast', 'medium', 'slow'], value=p.preset, label='Preset')
+                                c_crf = ui.number('CRF/QP', value=p.crf, min=0, max=51)
+
+                                audios = p.audio_langs.split(',') if p.audio_langs else []
+                                subs = p.subtitle_langs.split(',') if p.subtitle_langs else []
+                                c_audio = ui.select(ISO_LANGS, value=audios, multiple=True, label='Áudios').props('use-chips')
+                                c_sub = ui.select(ISO_LANGS, value=subs, multiple=True, label='Legendas').props('use-chips')
+
+                            def save_profile(prof=p, n=c_name, c=c_codec, pr=c_preset, cr=c_crf, a=c_audio, s=c_sub):
+                                prof.name = n.value; prof.video_codec = c.value; prof.preset = pr.value
+                                prof.crf = int(cr.value); prof.audio_langs = ",".join(a.value); prof.subtitle_langs = ",".join(s.value)
+                                prof.save()
+                                profiles_dict[prof.id] = prof.name
+                                select_profile.options = profiles_dict
+                                select_profile.update()
+                                ui.notify('Salvo!')
+                            
+                            ui.button('Salvar', on_click=save_profile).classes('mt-2')
+
+            # --- ABA 5: TELEGRAM ---
+            with ui.tab_panel(tab_telegram):
+                with ui.card().classes('w-full max-w-lg mx-auto p-6'):
+                    ui.label('🤖 Integração Telegram').classes('text-2xl font-bold mb-4 text-blue-600')
+                    t_token = AppConfig.get_val('telegram_token', '')
+                    t_chat = AppConfig.get_val('telegram_chat_id', '')
+                    token_input = ui.input('Bot Token', value=t_token).props('password').classes('w-full mb-2')
+                    chat_input = ui.input('Chat ID', value=t_chat).classes('w-full mb-6')
+                    def save_telegram():
+                        AppConfig.set_val('telegram_token', token_input.value)
+                        AppConfig.set_val('telegram_chat_id', chat_input.value)
+                        ui.notify('Salvo!', type='positive')
+                    ui.button('Salvar', on_click=save_telegram).props('icon=save color=blue').classes('w-full')