jashton/one-ai
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

while there's still improvements to be made, time to move onto the backend.

Browse Source
This commit is contained in:
Joshua
2024-07-11 15:24:38 -06:00
parent cbd040f57b
commit dfcddd11d4
7 changed files with 98 additions and 69 deletions
Download Patch File Download Diff File Expand all files Collapse all files
mobile/app/lib/components/conversation_thread/chat.dart
+1
View File
@@ -14,6 +14,7 @@ class Chat {
}
// TODO: Add proper filetype support. File should either be parsed on-device, or uploaded to the server.
// TODO: See https://github.com/adithya-s-k/omniparse
// TODO: Implement dynamic pathing based upon filetypes.
enum Filetype {
pdf,
mobile/app/lib/components/conversation_widget.dart
+2 -2
View File
@@ -60,7 +60,7 @@ class _ConversationWidgetState extends State<ConversationWidget> {
buttonSize: 60,
icon: const Icon(
Icons.arrow_back_rounded,
color: AppTheme.lightest,
color: AppTheme.lighterest,
size: 30,
),
onPressed: () async {
@@ -82,7 +82,7 @@ class _ConversationWidgetState extends State<ConversationWidget> {
child: FlutterFlowIconButton(
icon: const Icon(
Icons.more_vert,
color: AppTheme.lightest,
color: AppTheme.lighterest,
size: 24,
),
onPressed: () async {
mobile/app/lib/components/conversations_list_widget.dart
+5 -9
View File
@@ -87,10 +87,6 @@ class _ConversationsListWidgetState extends State<ConversationsListWidget> {
return Align(
alignment: const AlignmentDirectional(0, 0),
child: InkWell(
splashColor: AppTheme.accent,
focusColor: AppTheme.lightest,
hoverColor: AppTheme.dark,
highlightColor: AppTheme.darkest,
// TODO
// onTap: () async {
// context.pushNamed('Conversation');
@@ -111,7 +107,7 @@ class _ConversationsListWidgetState extends State<ConversationsListWidget> {
Container(
width: 100,
height: 100,
decoration: const BoxDecoration(color: AppTheme.lightest,),
decoration: const BoxDecoration(color: AppTheme.medium,),
child: const Align(
alignment: AlignmentDirectional(0, 0),
child: Icon(
@@ -131,7 +127,7 @@ class _ConversationsListWidgetState extends State<ConversationsListWidget> {
minWidth: MediaQuery.sizeOf(context).width,
),
decoration: const BoxDecoration(
color: AppTheme.lightest,
color: AppTheme.medium,
shape: BoxShape.rectangle,
),
child: Column(
@@ -175,7 +171,7 @@ class _ConversationsListWidgetState extends State<ConversationsListWidget> {
width: 100,
height: 100,
decoration: const BoxDecoration(
color: AppTheme.lightest,
color: AppTheme.medium,
),
child: const Icon(
Icons.chevron_right_rounded,
@@ -236,10 +232,10 @@ class _ConversationsListWidgetState extends State<ConversationsListWidget> {
),
), // Handle the button press
},
backgroundColor: AppTheme.darkest,
backgroundColor: AppTheme.accent,
child: const Icon(
Icons.bubble_chart,
color: AppTheme.lightest,
color: AppTheme.light,
),
),
),
mobile/app/lib/components/prompt_box/prompt_box_widget.dart
+27 -27
View File
@@ -68,26 +68,17 @@ class _PromptBoxWidgetState extends State<PromptBoxWidget> {
crossAxisAlignment: CrossAxisAlignment.end,
// TODO: Implement the context upload buttons
children: [
Expanded( // TODO: File context upload
Expanded( // TODO: Video context upload
child: Padding(
padding: const EdgeInsets.all(buttonPadding),
child: IconButton(
icon: const Icon(
Icons.file_upload_outlined,
color: AppTheme.darkest,
Icons.videocam_outlined,
color: AppTheme.accent2,
size: 30,
),
onPressed: () async {
final picker = FilePicker.platform;
final result = await picker.pickFiles(allowMultiple: true); // Allow multiple files
if (result != null) {
for (final platformFile in result.files) {
// TODO: Upload file to server
final file = File(platformFile.path!);
}
} else {
print('User canceled file selection');
}
onPressed: () {
print('IconButton pressed ...');
},
),
),
@@ -98,7 +89,7 @@ class _PromptBoxWidgetState extends State<PromptBoxWidget> {
child: IconButton(
icon: const Icon(
Icons.photo_outlined,
color: AppTheme.darkest,
color: AppTheme.accent2,
size: 30,
),
onPressed: () async {
@@ -119,28 +110,37 @@ class _PromptBoxWidgetState extends State<PromptBoxWidget> {
),
),
),
Expanded( // TODO: Video context upload
Expanded( // TODO: File context upload
child: Padding(
padding: const EdgeInsets.all(buttonPadding),
child: IconButton(
icon: const Icon(
Icons.videocam_outlined,
color: AppTheme.darkest,
Icons.file_upload_outlined,
color: AppTheme.accent2,
size: 30,
),
onPressed: () {
print('IconButton pressed ...');
onPressed: () async {
final picker = FilePicker.platform;
final result = await picker.pickFiles(allowMultiple: true); // Allow multiple files
if (result != null) {
for (final platformFile in result.files) {
// TODO: Upload file to server
final file = File(platformFile.path!);
}
} else {
print('User canceled file selection');
}
},
),
),
),
Expanded( // TODO: Camera context upload
Expanded(
child: Padding(
padding: const EdgeInsets.all(buttonPadding),
child: IconButton(
icon: const Icon(
Icons.camera_alt_outlined,
color: AppTheme.darkest,
color: AppTheme.accent2,
size: 30,
),
onPressed: () async {
@@ -148,11 +148,10 @@ class _PromptBoxWidgetState extends State<PromptBoxWidget> {
final image = await picker.pickImage(source: ImageSource.camera);
if (image != null) {
// TODO: Upload to server and add to conversation.chats
final i = Backend.convertToBase64(File(image.path));
// TODO: Add to widget rather than display in conversation thread.
Backend.loadedConversation.add(Chat.image(i.toString(), true, 1));
} else {
print('User canceled photo capture');
}
},
),
@@ -164,7 +163,7 @@ class _PromptBoxWidgetState extends State<PromptBoxWidget> {
child: IconButton(
icon: Icon(
Backend.stt.speechToText.isNotListening ? Icons.mic_off_outlined : Icons.mic_none,
color: AppTheme.darkest,
color: AppTheme.accent2,
size: 30,
),
onPressed: () {
@@ -192,6 +191,7 @@ class _PromptBoxWidgetState extends State<PromptBoxWidget> {
child: Padding(
padding: const EdgeInsetsDirectional.fromSTEB(12, 0, 12, 0),
child: TextFormField(
keyboardAppearance: Brightness.dark,
controller: _model.textController,
focusNode: _model.textFieldFocusNode,
onChanged: (_) => EasyDebounce.debounce(
@@ -246,7 +246,7 @@ class _PromptBoxWidgetState extends State<PromptBoxWidget> {
},
child: const Icon(
Icons.send,
color: AppTheme.primary,
color: AppTheme.accent,
size: 30,
),
),
mobile/app/lib/components/util/backend.dart
+23 -1
View File
@@ -173,19 +173,41 @@ class Backend {
// TODO: Allow for additional flags, ie. continuous conversation, images, etc.
// TODO: Allow for toggleable states between stream
// TODO: Allow for different models to be dynamically selected.
// TODO: Further adaption of API calls to allow for images to/from the AI model
// Example API call for image recognition
// curl http://localhost:11434/api/generate -d '{
// "model": "llava",
// "prompt":"What is in this picture?",
// "stream": false,
// "images": ["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"]
// }'
Map<String, dynamic> data;
if(conversations[conversationID].conversationContext) {
if(loadedConversation.conversationContext) {
loadedChats = [...loadedChats, Chat(prompt, true, 0)];
endpoint = "chat";
List<Map<String, String>> messageList = convertMessages();
// Last prompt was text
if(loadedChats.last.chatType == 0) {
data = {
"model": model.name,
"messages": messageList,
"stream": loadedConversation.stream,
};
// Last prompt was image
} else { //if (loadedChats.last.chatType == 1) {
// TODO: Do some wizardry to pipe the output of llava as additional context for the user's actual prompt or something.
data = {
"model": "llava",
"prompt": "What is in this picture?",
"stream": loadedConversation.stream,
"images" : [loadedChats.last.content],
};
}
}
else {
endpoint = "generate";
mobile/app/lib/main.dart
+3 -4
View File
@@ -35,8 +35,6 @@ BottomNavigationBarItem _buildNavigationItem(int index) {
return BottomNavigationBarItem(
icon: Icon(iconData),
label: label,
backgroundColor: AppTheme.lightest,
);
}
@@ -67,11 +65,12 @@ class MyApp extends ConsumerWidget {
return MaterialApp(
title: 'One AI',
home: Scaffold(
backgroundColor: AppTheme.medium,
backgroundColor: AppTheme.dark,
body: _pages[selectedIndex],
bottomNavigationBar: BottomNavigationBar(
backgroundColor: AppTheme.darkest,
selectedItemColor: AppTheme.lightest,
selectedItemColor: AppTheme.accent2,
unselectedItemColor: AppTheme.light,
showUnselectedLabels: false,
showSelectedLabels: false,
iconSize: 30,
mobile/app/lib/theme.dart
+32 -21
View File
@@ -1,19 +1,30 @@
import 'package:flutter/material.dart';
// TODO: Convert this to my .theme file format for cross-platform and cross-application compatability
// TODO: Create customization options (pre-built, auto-generated, AI-generated, or completely custom??) to settings
class AppTheme {
static const darkest = Color.fromARGB(255, 45, 45, 145);
static const dark = Color.fromARGB(255, 81, 81, 196);
static const medium = Color.fromARGB(255, 107, 107, 201);
static const light = Color.fromARGB(255, 155, 155, 255);
static const lightest = Color.fromARGB(255, 172, 175, 255);
static const accent = Color.fromARGB(255, 255, 113, 0);
static const accent2 = Color.fromARGB(255, 255, 164, 79);
// static const darkest = Color.fromARGB(255, 45, 45, 145);
// static const dark = Color.fromARGB(255, 81, 81, 196);
// static const medium = Color.fromARGB(255, 107, 107, 201);
// static const light = Color.fromARGB(255, 155, 155, 255);
// static const lightest = Color.fromARGB(255, 172, 175, 255);
static const darkest = Color.fromARGB(255, 18, 18, 18);
static const dark = Color.fromARGB(255, 27, 27, 27);
static const medium = Color.fromARGB(255, 36, 36, 36);
static const light = Color.fromARGB(255, 45, 45, 45);
static const lightest = Color.fromARGB(255, 54, 54, 54);
static const lighterest = Color.fromARGB(255, 145, 145, 145);
static const white = Colors.white;
static const accent = Color.fromARGB(255, 155, 155, 255);
static const accent2 = Color.fromARGB(255, 172, 175, 255);
static const primaryBackground = darkest;
static const secondaryBackground = medium;
static const primaryTextColor = darkest;
static const primaryTextColor = white;
static const primaryText = TextStyle(color: primaryTextColor, fontSize: 16);
static const secondaryText = dark;
static const secondaryText = lightest;
static const accent1 = lightest;
static const accent4 = accent2;
@@ -22,24 +33,24 @@ class AppTheme {
static const tertiary = light;
static const alternate = lightest;
static const bodyLarge = TextStyle(color: light, fontSize: 24, fontWeight: FontWeight.bold);
static const bodyMedium = TextStyle(color: lightest, fontSize: 16);
static const bodySmall = TextStyle(color: light, fontSize: 12);
static const bodyLarge = TextStyle(color: white, fontSize: 24, fontWeight: FontWeight.bold);
static const bodyMedium = TextStyle(color: white, fontSize: 16);
static const bodySmall = TextStyle(color: white, fontSize: 12);
static const error = Colors.red;
static const info = Colors.grey;
static const displayLarge = TextStyle(color: darkest, fontSize: 24, fontWeight: FontWeight.bold);
static const displayMedium = TextStyle(color: dark, fontSize: 16, fontWeight: FontWeight.bold);
static const displaySmall = TextStyle(color: lightest, fontSize: 12, fontWeight: FontWeight.bold);
static const displayLarge = TextStyle(color: white, fontSize: 24, fontWeight: FontWeight.bold);
static const displayMedium = TextStyle(color: white, fontSize: 16, fontWeight: FontWeight.bold);
static const displaySmall = TextStyle(color: white, fontSize: 12, fontWeight: FontWeight.bold);
static const labelLarge = TextStyle(color: darkest, fontSize: 24, fontWeight: FontWeight.bold);
static const labelMedium = TextStyle(color: dark, fontSize: 16, fontWeight: FontWeight.bold);
static const labelSmall = TextStyle(color: medium, fontSize: 12, fontWeight: FontWeight.bold);
static const labelLarge = TextStyle(color: white, fontSize: 24, fontWeight: FontWeight.bold);
static const labelMedium = TextStyle(color: white, fontSize: 16, fontWeight: FontWeight.bold);
static const labelSmall = TextStyle(color: white, fontSize: 12, fontWeight: FontWeight.bold);
static const headlineLarge = TextStyle(color: medium, fontWeight: FontWeight.bold);
static const headlineMedium = TextStyle(color: light, fontWeight: FontWeight.bold);
static const headlineSmall = TextStyle(color: lightest, fontWeight: FontWeight.bold);
static const headlineLarge = TextStyle(color: white, fontWeight: FontWeight.bold);
static const headlineMedium = TextStyle(color: white, fontWeight: FontWeight.bold);
static const headlineSmall = TextStyle(color: white, fontWeight: FontWeight.bold);
static const titleLarge = TextStyle(fontFamily: 'Outfit', letterSpacing: 0, fontSize: 24);
static const titleSmall = TextStyle(fontFamily: 'Outfit', letterSpacing: 0, fontSize: 16);