Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
The FIS Systematics application is a web-based tool designed to enable users to upload files, select content groups, and interact with a local LLM for embedding and running queries. It provides a structured environment for users to ask questions, view answers, and understand the reasoning behind those answers through an intuitive and professional user interface.

## CORE FEATURES
1. **File Upload**: Users can upload documents to the system for processing and analysis.
2. **Content Group Selection**: Allows users to choose specific content groups relevant to their queries.
3. **Question and Answer Interface**: Users can input questions and receive answers generated by the local LLM.
4. **Reasoning Tab**: Displays the reasoning and proofs behind the answers provided by the system.
5. **Lang Chain Flow Visualization**: Shows the updated Lang chain flow, detailing how the system arrived at the final answers, including chunking and top-k value.
6. **User-Friendly Design**: A professional and minimalist UI that ensures easy navigation and usability.

## DESIGN SPECIFICATIONS
- **Visual Style**: minimalist - Clean, simple design with plenty of white space, minimal color palette, and focus on typography
- **Color Mode**: Light theme with dark text on light backgrounds
- **Primary Color**: #1978E5 (accent for buttons, links, highlights)
- **Typography**: Use Inter from Google Fonts for headings, Inter for body text and UI elements
- **Border Radius**: 8px (moderately rounded) for buttons, cards, and inputs
- **Layout**: The application should feature a tabbed layout where each tab corresponds to a core feature, including file upload, Q&A, reasoning, and Lang chain flow visualization. The main interface should be simple and intuitive, promoting easy access to all functionalities.

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript
- **Styling**: Tailwind CSS
- **UI Components**: shadcn/ui
- **State Management**: Redux (optional, based on complexity)

## IMPLEMENTATION STEPS
1. **Set Up Development Environment**: Initialize a new React project with TypeScript using Create React App.
2. **Install Dependencies**: Add Tailwind CSS for styling and shadcn/ui for UI components.
3. **Create Core Components**: Develop components for file upload, question input, answer display, reasoning, and Lang chain flow visualization.
4. **Implement State Management**: If necessary, set up Redux for managing application state related to user queries and responses.
5. **Design Layout**: Structure the main app layout with a tabbed interface using Tailwind CSS for styling and responsiveness.
6. **Integrate Local LLM**: Develop the logic to handle the embedding and running of queries against the local LLM.
7. **Test Functionality**: Conduct user testing to ensure all features work seamlessly and the UI is intuitive.
8. **Deploy Application**: Once tested, deploy the application to a suitable hosting platform.

## USER EXPERIENCE
Users will interact with the FIS Systematics application by first uploading their files and selecting the relevant content group. They can then input questions to receive answers generated by the local LLM. The reasoning tab will provide insights into how the answers were derived, enhancing user understanding and trust in the system. The overall experience is designed to be straightforward and engaging, with a focus on clarity and ease of use.