Billing File Upload - Copy this React, Tailwind Component to your project
Build me a page for my app on the phone that has an action button – for example, "Upload a billing file" or "Reset percentages". My app 1. App name Mindfulness 2. Target audience Religious or general young people/adults who are interested in making a permanent financial arrangement. People who receive a monthly salary and want to automatically divide it into investments, savings, and tithes. 3. Problem that the app solves Difficulty keeping track of monthly salaries and obligations. Need for an accurate division of income by values (savings, investments, tithes). Lack of knowledge or motivation to perform proactive financial operations. 4. The app's solution Receive a salary → Manual or automatic entry. The app performs an automatic division by percentage. Displays a monthly division graph. Notifications before standing orders (based on a billing file from the previous month). Upload a bill file → Analyze with AI → Mark recurring charges → Alert before the due date. 5. Main features Core: Enter income amount. Distribution by predefined or custom percentages. Pie chart or table. Alerts for recurring charges. Additional: Form for tracking liabilities (rent, subscriptions, loans). Upload a PDF or XLS file to identify recurring charges. Adjustment to religious values (e.g. "tithe"). "Monthly history" area. Send a monthly PDF summary. 6. Design and style Colors: dark background (black/dark brown), light text (#D9D5B2). Fonts: Hebrew – Assistant, Heebo, or Alef. Elements: Modern design, round buttons, clear graphs. 7. Steps for Technical Construction (Glide) Creating a Google Sheet: Income Table Expense Table Charges Table Connection to the Glide App. Screen Design: Home Screen: Graph + Amount + Date. Billing File Screen + AI Analysis. Percentage Settings Screen. Details Submission Form. Plugin Connection: File Upload Plugin. Pie Chart Plugin. Option to connect Zapier or Make for Email/Push Alerts. And Build Everything for Me in Hebrew
