mirror of
https://github.com/foss42/apidash.git
synced 2025-07-03 14:36:22 +08:00
addresses review comments
This commit is contained in:
sumaiya shazad
@ -21,113 +21,148 @@
|
||||
|
||||
Short answers to the following questions (Add relevant links wherever you can):
|
||||
|
||||
1. Have you worked on or contributed to a FOSS project before? Can you attach repo links or relevant PRs?
|
||||
1. **Have you worked on or contributed to a FOSS project before? Can you attach repo links or relevant PRs?**
|
||||
|
||||
No. My first experience is with apidash. I have raised a PR for issue #122(https://github.com/foss42/apidash/pull/730) and
|
||||
had a good learning. Fairly comfortable with the process now
|
||||
and looking forward to contribute and work towards merging the PR in the apidash repo.
|
||||
|
||||
2. What is your one project/achievement that you are most proud of? Why?
|
||||
2. **What is your one project/achievement that you are most proud of? Why?**
|
||||
|
||||
I am proud of my self-learning journey in the AI area so far. I am equipped with considerable predictive and generative AI concepts and related tools/apis.
|
||||
I started with the perception that AI is new, exciting but extremely difficult. I overcame this challenge using multiple learning resources and balancing with
|
||||
my college academics and have been able to achieve much more than my peer group in terms of learning.
|
||||
Looking forward to learning and contributing to the open source space and add a new level to my learning journey.
|
||||
|
||||
3. What kind of problems or challenges motivate you the most to solve them?
|
||||
3. **What kind of problems or challenges motivate you the most to solve them?**
|
||||
|
||||
DSA related problems challenged me the most which also pushed me to solve them. I was able to solve complex problems in trees, graphs,
|
||||
recursion which I found very interesting.
|
||||
I am also part of the avions (college club related to aviation and aerospace) where we are building working models of airplanes. It is very challenging and at the
|
||||
same time motivating to make those models from scratch and fly them.
|
||||
|
||||
4. Will you be working on GSoC full-time? In case not, what will you be studying or working on while working on the project?
|
||||
4. **Will you be working on GSoC full-time? In case not, what will you be studying or working on while working on the project?**
|
||||
|
||||
Yes I can contribute full time. I dont have any other engagements since it will be my summer break.
|
||||
|
||||
5. Do you mind regularly syncing up with the project mentors?
|
||||
5. **Do you mind regularly syncing up with the project mentors?**
|
||||
|
||||
Definitely not. This is the opportunity I am looking forward to where I can work with the bright minds and gain guidance and knowledge. I would be available for
|
||||
any form of communication as required by the assignment.
|
||||
|
||||
6. What interests you the most about API Dash?
|
||||
6. **What interests you the most about API Dash?**
|
||||
|
||||
The simplicity of the gitrepo attracted me to this project. It is very easy to understand and very well written.
|
||||
|
||||
7. Can you mention some areas where the project can be improved?
|
||||
7. **Can you mention some areas where the project can be improved?**
|
||||
|
||||
Developer documentation w.r.t to the components, system design, best practices, coding standards, testing standards will increase the productivity of contributors.
|
||||
Also I feel there can be improvement in the look and feel of the user interface in terms of making it appear attractive and also enhance usability.
|
||||
|
||||
### Project Proposal Information
|
||||
|
||||
1. Proposal Title - AI UI Designer for APIs (#617)
|
||||
2. Abstract:
|
||||
Develop an AI Agent which transforms API responses into dynamic, user-friendly UI components, enabling developers to visualize and interact with data effortlessly.
|
||||
I plan to address this by building a new component ai_ui_agent which uses ollama models suitable for codegen (codellama or deepseek probably) to generate the flutter
|
||||
widgets which can be plugged into apidash ui. We can use third party component fl_chart for the charts generation.
|
||||
3. Detailed Description
|
||||
A rough ui mockup can be as below.
|
||||
This popup will be rendered on click of the "data analysis" button on the response widget.
|
||||
The drop down can be populated from the responses from the ai model. (List the charts to analyze the data in the given json)
|
||||
On selection of each item in the drop down corresponding chart with customizations can be displayed.
|
||||
Export component (link/button) will export the flutter component as a zip file.
|
||||
|
||||
**1. Proposal Title** - AI UI Designer for APIs (#617)
|
||||
|
||||
```
|
||||
To implement this we need to carry out the below tasks in order -
|
||||
**2. Abstract:**
|
||||
Develop an AI Agent which transforms API responses into dynamic, user-friendly UI components, enabling developers to visualize and interact with data effortlessly.
|
||||
I plan to address this by building a new component ai_ui_agent which uses ollama models suitable for codegen (codellama or deepseek probably) to generate the flutter
|
||||
widgets which can be plugged into apidash ui. We can use third party component fl_chart for the charts generation.
|
||||
|
||||
Task1:
|
||||
**3. Detailed Description**
|
||||
A rough ui mockup can be as below.
|
||||
This popup will be rendered on click of the "data analysis" button on the response widget.
|
||||
The default view of the popup can have thumb nails based on the visualizations applicable for the api response.
|
||||
(Example prompt - List the charts to analyze the data in the given json)
|
||||
On selection of each item in the drop down corresponding chart with customizations can be displayed.
|
||||
Export component (link/button) can be provided on this pop up which will export the flutter component as a zip file.
|
||||
|
||||
|
||||
Evaluate the Ollama supported LLMs with good code generation capability.
|
||||
To implement this we need to carry out the below tasks in order -
|
||||
**Task1: LLM model evaluation and prompt design**
|
||||
Evaluate the Ollama supported LLMs with good code generation capability.
|
||||
We need to attempt several prompts which give us the output as required.
|
||||
We need the prompt to
|
||||
|
||||
We need to attempt several prompts which give us the output as required.
|
||||
We need the prompt to
|
||||
- List the suitable widgets (data table/ chart/ card/ form) for the given json data.
|
||||
- The prompts should be fine tuned to generate different types of widgets as chosen by user.
|
||||
- The prompts should also have placeholders for customizations (Searching, sorting, custom labels in charts)
|
||||
- The prompts should be fine tuned to provide the look and feel of the apidash ui.
|
||||
- The prompts should give good performance as well as provide accuracy of output.
|
||||
At the end of this task we should have working prompts as per the requirement.
|
||||
- List the suitable widgets (data table/ chart/ card/ form) for the given json data.
|
||||
- The prompts should be fine tuned to generate different types of widgets as chosen by user.
|
||||
- The prompts should also have placeholders for customizations (Searching, sorting, custom labels in charts)
|
||||
- The prompts should be fine tuned to provide the look and feel of the apidash ui.
|
||||
- The prompts should give good performance as well as provide accuracy of output.
|
||||
At the end of this task we should have working prompts as per the requirement.
|
||||
|
||||
Task2: Build the ai_ui_agent component in the lib folder of the repo which encapsulates both the back end logic and ui widgets.
|
||||
At the end of this task we expect a working component with the below structure :
|
||||
ai_ui_agent
|
||||
- features
|
||||
ai_ui_agent_codegen.dart (This will contain the fine tuned prompts for code generation)
|
||||
exporter.dart (This will contain the logic to export the generated flutter widget)
|
||||
- providers
|
||||
ai_ui_agent_providers.dart (Will hold the generated flutter code as state/ available for download)
|
||||
- services
|
||||
ai_ui_agent_service.dart (Will invoke the ollama service using ollama_dart package)
|
||||
- widgets
|
||||
ai_ui_widget.dart (container widget for the generated code)
|
||||
(any other widgets required for customizations/styles)
|
||||
- utils
|
||||
validate_widget.dart (This should perform some basic validation/compilation to ensure the generated component can get rendered/exported successfully)
|
||||
ai_ui_agent.dart
|
||||
**Task2: Build ai_ui_agent component**
|
||||
|
||||
Task3: Integrating this component with the response_pane widget
|
||||
screens/home_page/editor_pane/details_card/response_pane.dart (Add a new button on click - render the ai_ui_widget in a pop up.)
|
||||
- Build the ai*ui_agent component in the lib folder of the repo which encapsulates both the back end logic and ui widgets.
|
||||
At the end of this task we expect a working component with the below structure :
|
||||
**ai_ui_agent** - features
|
||||
\_ai_ui_agent_codegen.dart*
|
||||
(This will contain the fine tuned prompts for code generation)
|
||||
_exporter.dart_
|
||||
(This will contain the logic to export the generated flutter widget) - providers
|
||||
_ai_ui_agent_providers.dart_
|
||||
(Will hold the generated flutter code as state/ available for download) - services
|
||||
_ai_ui_agent_service.dart_
|
||||
(Will invoke the ollama service using ollama*dart package) - widgets
|
||||
\_ai_ui_widget.dart*
|
||||
(container widget for the generated code)
|
||||
(any other widgets required for customizations/styles) - utils
|
||||
_validate_widget.dart_
|
||||
(This should perform some basic validation/compilation to ensure the generated component can get rendered/exported successfully)
|
||||
_ai_ui_agent.dart_
|
||||
**Task3: Integrating this component with the response_pane widget**
|
||||
_screens/home_page/editor_pane/details_card/response_pane.dart_
|
||||
(Add a new button named "Data Analysis". on click - render the ai_ui_widget in a pop up.)
|
||||
**Task4: Writing unit and integration tests**
|
||||
**Task5: Perform functional testing with different apis and response formats.**
|
||||
This will be crucial to ensure it works with different apis with different json structures.
|
||||
This task may involve fine tuning/fixing the prompts as well.
|
||||
**Taks6: Updating the dev guide and user guide**
|
||||
|
||||
Task4: Writing unit and integration tests
|
||||
## 4. Week Project Timeline
|
||||
|
||||
Task5: Perform functional testing with different apis and response formats.
|
||||
This will be crucial to ensure it works with different apis with different json structures.
|
||||
This task may involve fine tuning/fixing the prompts as well.
|
||||
### Week 1: Community Bonding and project initiation
|
||||
|
||||
Taks6: Updating the dev guide and user guide
|
||||
- Engage with mentors and the community to understand project expectations.
|
||||
- Finalize project requirements and milestones.
|
||||
- Set up development environment (Ollama, Flutter, APIDash).
|
||||
- **Outcome**: Working APIDash application, Working Ollama setup.
|
||||
|
||||
```
|
||||
### Week 2-3: Task1: Evaluate Ollama codegen model and prompts creation
|
||||
|
||||
4. Weekly Timeline:
|
||||
- Use sample json responses as input to Ollama model and develop basic prompts to generate Flutter chart components.
|
||||
- Test the generated Flutter compoents for fitment into apidash standards.
|
||||
- Document observations and gather mentor feedback.
|
||||
- Enhance the initial prompts - provide customization placeholders, applying apidash specific styles/themes
|
||||
- Repeat this step and finalize the expectations from mentor.
|
||||
- **Outcome**: Finalized prompts to use for ai_ui_agent
|
||||
|
||||
| Week | Focus | Key Deliverables & Achievements |
|
||||
| -------------- | --------------------------------------------------------- | -------------------------------------------------------------------------------------------- |
|
||||
| **Week 1** | Community Bonding and dev env setup | Connect with mentors. Understand project expectations. Install and configure dev env. |
|
||||
| **Week 2-3** | Task1: Evaluate Ollama codegen model and prompts creation | Working prompts and finalized Ollama ai model |
|
||||
| **Week 4-5** | Task2: Build ai_ui_agent | Features and Services |
|
||||
| **Week 6-7** | Task2,3: Build ai_ui_agent | widgets, providers and utils |
|
||||
| **Week 8-9** | Task4,5: unit, integration and functional testing | Unit, integration tests, meet code coverage |
|
||||
| **Week 9-10** | Task6: Documentation | Update Dev guide, User Guide, Readme, Changelog |
|
||||
| **Week 10-12** | Feedback and wrapup | Implement any final feedback from mentors. Open to pick up other issue related to importers. |
|
||||
### Week 4-5: Task2: Build ai_ui_agent
|
||||
|
||||
- Code backend using the prompts and models from Task1.
|
||||
- Plan and implement unit/component tests for backend.
|
||||
- **Outcome** - ai_ui_agent_codegen.dart, ai_ui_agent_providers.dart, ai_ui_agent_service.dart
|
||||
|
||||
### Week 6: Task3: ui components, exporter.
|
||||
|
||||
- Code front end components and configuration (eg: fl_chart)
|
||||
- Plan and implement unit tests for ui widgets.
|
||||
- Implement code to export the generated component.
|
||||
- Plan and implement unit tests for exporter.
|
||||
- **Outcome** - ai_ui_widget.dart, screens/home_page/editor_pane/details_card/response_pane.dart, exporter.dart
|
||||
|
||||
### Week 7-8: Task4: Unit and integration testing
|
||||
|
||||
- Enhance the tests written in Week4 & 5 to increase code coverage, negative scenarios and corner cases.
|
||||
- Implement integration tests and capture basic performance metrics.
|
||||
- **Outcome** - Unit test dart files, code coverage report
|
||||
|
||||
### Week 9: Task5: Functional testing
|
||||
|
||||
- Run manual end to end tests with different apis and response formats.
|
||||
- **Outcome**: Bug fixes, Prompt Tuning.
|
||||
|
||||
### Week 10: Task6: Wrap up
|
||||
|
||||
- Final demo and mentor feedback.
|
||||
- Update the dev guide, user guide and other documents.
|
||||
- Create demo videos and presentations.
|
||||
|
||||
Binary file not shown.
|
Before Width: | Height: | Size: 133 KiB After Width: | Height: | Size: 1.5 MiB |
Reference in New Issue
Block a user