shni/amayo

Template

Files

Shni 38046e4df8 feat: Implementar nuevas mejoras en Amayo Bot Editor

- Agregar selector de directorio multi-OS con validación y persistencia
- Implementar preview en tiempo real del código generado en CommandCreator y EventCreator
- Activar TypeScript strict mode y añadir snippets nativos para mejorar la experiencia de desarrollo
- Crear documentación detallada sobre las nuevas funcionalidades y cambios realizados
- Actualizar README con instrucciones de uso y solución de problemas comunes
- Modificar archivos clave para integrar las nuevas características y mejorar la usabilidad

2025-11-04 03:14:03 -06:00

3.9 KiB

Raw Blame History

🎮 Configuración Discord Rich Presence

Paso 1: Crear Aplicación en Discord

Ve a Discord Developer Portal
Haz clic en "New Application"
Nombre: Amayo Bot Editor
Acepta los términos y crea la aplicación

Paso 2: Obtener Application ID

En la página de tu aplicación, ve a "OAuth2" → "General"
Copia el APPLICATION ID (número largo)

Pégalo en src-tauri/src/lib.rs línea 169:

let client_id = "TU_APPLICATION_ID_AQUI";

Paso 3: Subir Imágenes (Assets)

En tu aplicación, ve a "Rich Presence" → "Art Assets"
Sube las siguientes imágenes:

Imagen Principal: `amayo_logo`

Tamaño recomendado: 1024x1024 píxeles
Logo del editor Amayo
Aparecerá como imagen grande en Discord

Imagen Secundaria: `code`

Tamaño recomendado: 512x512 píxeles
Icono de código </> o similar
Aparecerá como imagen pequeña en Discord

IMPORTANTE: El nombre debe ser exactamente amayo_logo y code (minúsculas, sin espacios)

Paso 4: ¿Qué mostrará Discord?

Cuando abres el editor:

🎮 Jugando a Amayo Bot Editor
📝 Editando bot de Discord
🕐 En el menú principal
   [Desde: hace 5 minutos]

Cuando editas un archivo:

🎮 Jugando a Amayo Bot Editor
📝 Editando Comando slash
📄 ping.ts
   [Desde: hace 10 minutos]

Cuando creas un comando:

🎮 Jugando a Amayo Bot Editor
🆕 Creando comando nuevo
🔧 En el wizard de comandos
   [Desde: hace 2 minutos]

Cuando editas la base de datos:

🎮 Jugando a Amayo Bot Editor
🗄️ Editando base de datos
📊 Visualizando schema.prisma
   [Desde: hace 15 minutos]

Paso 5: Estados Implementados

El RPC se actualiza automáticamente cuando:

✅ Abres el editor → "Editando bot de Discord"
✅ Navegas el proyecto → "X comandos | Y eventos"
✅ Seleccionas un archivo → "Editando [tipo]" + nombre
✅ Creas comando → "Creando comando nuevo"
✅ Creas evento → "Creando evento nuevo"
✅ Abres database → "Visualizando schema.prisma"

Paso 6: Crear Imágenes Sugeridas

Para `amayo_logo`:

Puedes usar cualquier herramienta de diseño o generador de logos:

Logo.com
Canva
Photopea (Photoshop gratis)

Sugerencia: Logo con letra "A" estilizada o nombre "Amayo" con colores modernos

Para `code`:

Busca iconos gratuitos de código:

Flaticon → buscar "code icon"
Icons8 → buscar "coding icon"
Emoji de código: </> o {}

Paso 7: Compilar y Probar

cd AEditor
npm run tauri dev

Si Discord está abierto, deberías ver el Rich Presence actualizado!

Troubleshooting

❌ No aparece en Discord

Verifica que Discord esté abierto
Revisa que el Application ID sea correcto
Asegúrate que las imágenes tengan los nombres exactos
En Discord → Configuración → Actividad → Habilitar "Mostrar actividad actual"

❌ Error de conexión

Error conectando a Discord: Connection refused

Solución: Reinicia Discord completamente

❌ Imágenes no aparecen

Las imágenes tardan 5-10 minutos en activarse después de subirlas
Deben llamarse exactamente amayo_logo y code
Formato: PNG, JPG o GIF

Personalización Avanzada

Puedes modificar los mensajes en src/App.vue:

// Ejemplo: cambiar el mensaje al editar
updateDiscordRPC(
  "🔥 Hackeando el mainframe",  // Details
  `Archivo: ${file.name}`         // State
);

O en src-tauri/src/lib.rs para cambiar las imágenes:

.assets(activity::Assets::new()
    .large_image("tu_imagen_custom")
    .large_text("Tu texto custom")
    .small_image("otra_imagen")
    .small_text("Otro texto")
)

🎉 ¡Listo! Tu editor ahora muestra lo que estás haciendo en Discord.

3.9 KiB Raw Blame History