Tram Tong - Frontend Engineer | ContraWork by Tram Tong
Tram Tong

Tram Tong

Full Stack Engineer architecting complex system logic.

New to Contra

Tram is ready for their next project!

Cover image for Engineered an advanced, real-time communication
Engineered an advanced, real-time communication framework that seamlessly merges chat functionalities, interactive e-commerce product catalogs, and VoIP audio calls within a unified social commerce dashboard. Key technical solutions implemented: Interactive Chat Commerce (ChatProductComboDetailSheet.jsx): Developed a modular product combo overlay sheet utilizing React useMemo hooks to instantly filter catalogs (findCatalogProduct), load product specifications dynamically, and trigger lightning-fast operational workflows like staff quick-orders. Contextual Product Filtering (ChatProductSearchFilters.jsx): Built a prescriptive search engine featuring dynamic category pills (CHAT_CATEGORY_PILLS) and range field inputs (PowerField) to dynamically alter query states according to customer advice parameters. Relative Time Utilities (conversationListUi.jsx): Programmed a localized timestamp parser (formatListTime) that calculates accurate milliseconds deltas to present intuitive relative time intervals (e.g., 'Vừa xong', 'm', 'h', 'd') for high-volume customer messaging threads. VoIP Audio Interface UI (CallWindowAudioCall.jsx): Designed an immersive audio call dashboard complete with blur backdrop filters, call statistics rendering (converting audio bytes transmission metrics dynamically), status indicators, and responsive touch controls.
0
2
Cover image for Architected and developed a production-ready,
Architected and developed a production-ready, security-focused Accounting and Internal Control engine tailored for real-time commercial auditing and enterprise ledger reconciliations. Key technical solutions implemented: Accounts Receivable (AR) Aging Engine (ARAgingPanel.jsx): Programmed mathematical sorting arrays utilizing React useMemo hooks to parse pending payments into precise chronological duration buckets (0-7 days, 8-30 days, 31+ days) combined with localization for financial currency rendering. Automated Data Exporters (InnerShippingCpcReportPanel.jsx): Designed efficient custom parsing mechanisms to stream raw data tables, handle loading states dynamically, and execute automatic local downloads of secure CSV files via secure Blob URI instantiation. Strict Corporate Auditing & Internal Controls (InternalControlTab.jsx): Implemented automated validation check-lists tracking internal system actions, state histories, ledger balances, and corporate payroll compliance rules to ensure maximum data transparency. Lazy-Loaded Financial Routing Architecture (AccountingTabPanels.jsx): Built a high-performance tabbed navigation hub utilizing code-splitting optimized with React lazy and Suspense wrapper guards to optimize page loading speeds across data-heavy sub-modules.
0
12
Cover image for Engineered a robust, comprehensive Team
Engineered a robust, comprehensive Team Management module designed to coordinate, rank, and dynamically administer a high-volume sales collaborator and team leader infrastructure. Key technical solutions implemented: Recruitment & Network Growth (AddMemberModal.jsx): Developed an asynchronous search and validation pipeline using phone numbers (findUserByPhone) to instantly query the database and safely bind new members to specific team hierarchies (addMemberToTeam). Performance Ranking Engine (RankingList.jsx): Built a high-performance calculation component that dynamically parses, slices, and structures top sales performers based on key performance indicators (KPIs) like paidRevenue and paidOrderCount. Dynamic Rules & Disciplinary Operations (QuickPenaltyModal.jsx): Programmed automated logical flows to calculate delta commissions (commissionDeltaPct) and structural penalty adjustments based on pre-defined campaign mechanisms. Modular Lifecycle Infrastructure (TeamMembersTab.jsx): Integrated clean structural design practices to handle member states, custom performance filters (applyMemberPerformanceFilter), and comprehensive dashboard view controls.
0
22
Cover image for ST Lens Super APP —
ST Lens Super APP — A comprehensive, high-performance management system tailored for e-commerce, product tracking, and multi-tier network operations. Key Features & Technical Implementation: Dynamic E-Commerce Platform: Built an intuitive storefront catalog with advanced product filtering, customized pricing tiers, and real-time inventory synchronization. Complex Administrative Panels: Engineered secure Admin Dashboards featuring granular access control, comprehensive system monitoring, and performance analytics. Advanced Computational Logic: Architected robust automated payroll, team reward structures, and overriding commission calculation engines to independently manage collaborator networks. Scalable Tech Stack: Developed using a modern stack (React, Node.js, JavaScript, and secure cloud databases) with clean state management, optimized data validation pipelines, and strict error handling mechanics.
0
63