From aa35a2f5a07d69bf2bb819276380ad540d5f7e5e Mon Sep 17 00:00:00 2001 From: DiegoDev-7 Date: Sun, 19 Apr 2026 22:27:22 -0500 Subject: [PATCH] Implementation of different screen sizes for the main pages, update of the contacts application and fix for some CSS errors --- .../SystemAtm/screens/ConfigurationAtm.tsx | 4 +- .../leaderboard/components/TopLeaderboard.tsx | 9 +- .../src/Nexia/SystemPhone/Apps/ContactApp.tsx | 174 ++- .../SystemPhone/Apps/Settings/SettingsApp.tsx | 14 +- .../Nexia/SystemPhone/screens/screenApps.tsx | 33 +- .../SystemPhone/screens/screenUnlock.tsx | 4 +- .../src/Nexia/auth/components/LoginButton.tsx | 2 - .../Nexia/auth/screens/Header_Interface.tsx | 4 +- .../external/contacts/contacts.service.ts | 6 +- .../Apps/Bank/components/InterfaceBank.scss | 1 + .../styles/SystemPhone/Apps/ContactApp.scss | 156 ++- .../styles/SystemPhone/screens/screens.scss | 42 +- .../Nexia/styles/SystemPhone/ui/signals.scss | 29 +- Nexia/src/Nexia/styles/_mixin.scss | 107 +- Nexia/src/Nexia/styles/auth/PanelsAuth.scss | 13 +- .../styles/components/ScrollIndicator.scss | 35 +- Nexia/src/Nexia/styles/main.css | 1210 ++++++++++++++--- Nexia/src/Nexia/styles/main.css.map | 2 +- .../src/Nexia/styles/pages/Common/Footer.scss | 24 +- .../styles/pages/Common/Header/Header.scss | 91 +- .../Common/Header/components/Discord.scss | 6 +- .../Common/Header/components/IconsHeader.scss | 30 +- .../Common/Header/components/Languages.scss | 100 +- .../pages/Common/TermsAndConditions.scss | 83 +- .../src/Nexia/styles/pages/Home/MainHome.scss | 3 +- .../styles/pages/Home/ui/AppsDescription.scss | 95 +- .../pages/Home/ui/PhoneDescription.scss | 35 +- .../styles/pages/Home/ui/SelectDevice.scss | 70 +- .../Nexia/styles/pages/Home/ui/StartHome.scss | 165 ++- .../styles/pages/Home/ui/ThanksWords.scss | 53 +- .../Nexia/styles/pages/devices/DeviceAtm.scss | 48 +- .../styles/pages/devices/DevicePhone.scss | 11 +- Nexia/src/assets/Nexia/rose_light.svg | 33 +- 33 files changed, 2193 insertions(+), 499 deletions(-) diff --git a/Nexia/src/Nexia/SystemAtm/screens/ConfigurationAtm.tsx b/Nexia/src/Nexia/SystemAtm/screens/ConfigurationAtm.tsx index d762f3b..6d0940f 100644 --- a/Nexia/src/Nexia/SystemAtm/screens/ConfigurationAtm.tsx +++ b/Nexia/src/Nexia/SystemAtm/screens/ConfigurationAtm.tsx @@ -64,6 +64,8 @@ export const ConfigurationPanel = () => { fetchUser() }, []) + + // Set theme const handleSetTheme = (gradient: string) => { localStorage.setItem("atmTheme", gradient) window.dispatchEvent(new Event("themeChange")) @@ -83,7 +85,7 @@ export const ConfigurationPanel = () => {
{!user ? ( - ) : !isGoogleUser ? ( + ) : isGoogleUser ? ( <>

Perfil

diff --git a/Nexia/src/Nexia/SystemAtm/screens/leaderboard/components/TopLeaderboard.tsx b/Nexia/src/Nexia/SystemAtm/screens/leaderboard/components/TopLeaderboard.tsx index 439fc45..7343076 100644 --- a/Nexia/src/Nexia/SystemAtm/screens/leaderboard/components/TopLeaderboard.tsx +++ b/Nexia/src/Nexia/SystemAtm/screens/leaderboard/components/TopLeaderboard.tsx @@ -1,6 +1,9 @@ /* Icons */ import { Crown } from "lucide-react"; +/* Images */ +import user from "../../../../../assets/Icons/user_light.svg" + /* Utils */ import { formatValue, getMetricValue } from "../utils/leaderboard.utils"; @@ -10,7 +13,11 @@ export const TopLeaderboard = ({ top3, balance, metric }: any) => ( <> {[1, 0, 2].map((pos, idx) => (
- {top3[pos]?.avatar && User} + {top3[pos]?.avatar ? + User + : + User + }
diff --git a/Nexia/src/Nexia/SystemPhone/Apps/ContactApp.tsx b/Nexia/src/Nexia/SystemPhone/Apps/ContactApp.tsx index 2afb092..8ccd575 100644 --- a/Nexia/src/Nexia/SystemPhone/Apps/ContactApp.tsx +++ b/Nexia/src/Nexia/SystemPhone/Apps/ContactApp.tsx @@ -4,11 +4,14 @@ import { useEffect, useState } from "react" /* Images */ import user from "../../../assets/Icons/user_light.svg" +/* Icons */ +import { Trash } from "lucide-react" + /* Components */ import { LoadingIcon } from "../../components/loading.ldrs" /* Services */ -import { getContacts } from "../../services/external/contacts/contacts.service" +import { deleteContact, getContacts, updateContact } from "../../services/external/contacts/contacts.service" @@ -20,6 +23,9 @@ type Contact = { } const ContactApp = () => { const [data, setData] = useState([]) + const [editingId, setEditingId] = useState(null) + const [editValue, setEditValue] = useState("") + const [trash, setTrash] = useState(false) // Success send data const [success, setSuccess] = useState(false) @@ -31,7 +37,7 @@ const ContactApp = () => { const [exitError, setExitError] = useState(false) - + // Get contact const fetchUser = async () => { try { @@ -39,6 +45,54 @@ const ContactApp = () => { setData(res.data) + } catch (error: any) { + + const message = + error?.response?.data?.message || + error?.response?.data?.error || + error?.message || + "Error inesperado" + + setErrorMsg(message) + setError(true) + setExitError(false) + + setTimeout(() => setExitError(true), 2000) + + setTimeout(() => { + setError(false) + setErrorMsg(null) + }, 2300) + + } + } + + useEffect(() => { + fetchUser() + }, []) + + + // Save contact + const saveContact = async (contact_id: number, newName: string) => { + try { + + if (!newName) return null + + await updateContact(contact_id, newName.trim()) + + // Actualización optimista + setData(prev => + prev.map(contact => + contact.contact_id === contact_id + ? { ...contact, name_contact: newName.trim() } + : contact + ) + ) + + setEditingId(null) + setEditValue("") + + setSuccess(true) setVisible(false) @@ -47,7 +101,7 @@ const ContactApp = () => { // Delete animation success setTimeout(() => setSuccess(false), 2300) - + } catch (error: any) { const message = @@ -69,20 +123,58 @@ const ContactApp = () => { } } - useEffect(() => { - fetchUser() - }, []) + + + // Delete contact + const deleteCon = async (contact_id: number) => { + try { + + await deleteContact(contact_id) + + await fetchUser() + + + setSuccess(true) + setVisible(false) + + // Enter animation success + setTimeout(() => setVisible(true), 2000) + + // Delete animation success + setTimeout(() => setSuccess(false), 2300) + + } catch (error: any) { + + const message = + error?.response?.data?.message || + error?.response?.data?.error || + error?.message || + "Error inesperado" + + setErrorMsg(message) + setError(true) + setExitError(false) + + setTimeout(() => setExitError(true), 2000) + + setTimeout(() => { + setError(false) + setErrorMsg(null) + }, 2300) + + } + } return ( <>
- +

Contactos

+ {/* Contacts */}
- {data === null ? (
@@ -93,28 +185,82 @@ const ContactApp = () => {

) : ( <> - {data.map(c => ( -
- + {data.map((c) => ( +
+ {trash && ( + + )} + ))} )} -
+ + + {/* Success */} + {success && ( + + ✔ + + )} + + {/* Error */} + {error && ( +
+ {errorMsg} +
+ )} ) } diff --git a/Nexia/src/Nexia/SystemPhone/Apps/Settings/SettingsApp.tsx b/Nexia/src/Nexia/SystemPhone/Apps/Settings/SettingsApp.tsx index 8058e86..3cf894e 100644 --- a/Nexia/src/Nexia/SystemPhone/Apps/Settings/SettingsApp.tsx +++ b/Nexia/src/Nexia/SystemPhone/Apps/Settings/SettingsApp.tsx @@ -45,6 +45,9 @@ const SettingsApp = () => { // Screens configuration render const [options, setOptions] = useState("settings") + // Search options + const [searchValue, setSearchValue] = useState("") + // Container from icons type Options = { id: number @@ -70,6 +73,11 @@ const SettingsApp = () => { { id: 15, containImage: "settings-comments", src: comment, alt: "Comentarios", description: "Servicios y comentarios", optionRender: "services" }, ] + // Filter menu options + const filteredOptions = optionsSettings.filter(v => + v.description.toLowerCase().includes(searchValue.toLowerCase()) + ) + return ( @@ -88,11 +96,13 @@ const SettingsApp = () => { className="input-app-settings" type="text" placeholder="Buscar en Ajustes" + value={searchValue} + onChange={(e) => setSearchValue(e.target.value)} />
- {optionsSettings.map((v, i) => ( + {filteredOptions.map((v, i) => ( <>