Table of Contents
Preface
Hello, my readers! If you are familiar with my blog, you may skip this part, but if you are a new reader - Welcome! I highly recommend to read at least last post of this series to familiarize yourself to what is going on here ^_^
TL;DR
This post series is dedicated to the Seneca Polytechnic's course called Open Source Development or OSD700. In this course me and other students are playing the role of maintainers in different github repositories.
Currently, I am focusing on the ChatCraft project, you may read more about it in their github repository, since it is an open-source project!
Introduction
Throughout the previous week I was working on the file attachments UI PR. Since the last post released there weren't huge changes, only small bugs were found that I fixed a little later:
[UI] File Attachment Added
#804
Closes #794
This PR improves UX in terms of file management. Previously user was only able to see the file in the PromptForm, but now he is able to use paperclip icon to see all files attached in modal window, and manage them:
- Attach files... (Same as in OptionsButton)
- Delete (using
removeFilefromsrc/lib/fs.ts) - Download (using
downloadFilefromsrc/lib/fs.ts)
If user never attached the file(s) paperclip will trigger file attachment process without opening modal window.
Eventually, it had finally been merged! If you want to see the result, you may follow PR-link or go to the last post where I also demonstrated everything needed.
JSONL Issue
First bug that we've found working on the
Attachment UIwas that.jsonlfiles weren't supported, so I filed an issue.
Add Support of JSON LINES files
#810
During the implementation we have discovered another problem that .jsonl files aren't supported, and user isn't able to attach them. I tried to fix it in #804 by adding to acceptableFileFormats from src/hooks/use-file-import.tsx these parameters: .jsonl,application/x-jsonlines,application/jsonl. However, it didn't help at all. We need to make a deeper research, and find the ways to provide support of this type of file.
I made a small research, only changed 10 lines of code, and opened a pull-request:
Support of `.jsonl` files implemented
#816
Closes #810
In #804 @tarasglek found out that we don't have a support of .jsonl files attachments, and we obviously needed to do something with it! I decided to step up and provide a support of .jsonl files, and I have no clue what else to write here because it is a tiny change, but description required :D
Here's result:
As you can see, now ChatCraft users are able to upload .jsonl files.
Flickering Icon Issue
Second pull-request that I've opened wasn't hard as well. Professor didn't like that the
mic iconwas flickering vs. disabled if speechToText wasn't supported by model or it was loading.
Don't reveal/hide Mic icon
#811
The mic icon gets shown/hidden on startup, and it causes some visual jank in the UI, as things update and shift. I think this is due to it loading the model and checking it's capability.
Let's enable/disable it instead, and have it always be visible.
This is more obvious now that the attach-files-icon is always present.
There was a small problem. Let me provide you the code, so you understand what was causing that.
Before:
if (!isSpeechToTextSupported) {
return <></>;
}
<IconButton
isRound
isDisabled={isDisabled}
icon={<TbMicrophone />}
variant={isRecording ? "solid" : isMobile ? "outline" : "ghost"}
colorScheme={isRecording ? "red" : "blue"}
After:
<IconButton
isRound
isDisabled={!isSpeechToTextSupported || isDisabled}
icon={<TbMicrophone />}
variant={isRecording ? "solid" : isMobile ? "outline" : "ghost"}
colorScheme={isRecording ? "red" : "blue"}
As you may have noticed, that I just deleted if statement, and changed the condition of isDisabled IconButton's property.
I opened the Pull-Request:
[BUG] Mic's Flickering Problem Fixed
#813
Closes #811
Currently, once page opened or reloaded, it is checking for speech support before initialization and returns empty if unsupported, it causes the flickering since the component remounts the mic icon once supported.
The new solution uses isSpeechToTextSupported in isDisabled prop instead, that is eliminating the flickering.
Result you may find following the link above.
Conclusion
As a result, it was pretty productive sprint, 1 huge, and 2 small PRs were merged!
If you were curious enough and decided to go through all provided links, you probably have noticed that all these pull-requests were small. However, they were all merged rapidly.
One of the issues was filed by me, fixed by me, and merged by me. I really enjoyed it :D
During the next week I plan to work on a little bigger issue. I will write about it a huge blog post in a week. However, now enjoy the issue. Will catch y'all later :-D
include reasoning tokens in ui
#802
deepseek returns https://api-docs.deepseek.com/guides/reasoning_model reasoning tokens. We should use html details/summary feature for this
openrouter is gonna support this for all reasoning models
this is gonna be interesting for also explicitly including reasoning context when switching models to do function calls, etc that reasoning models suck at
</div>
<div class="gh-btn-container"><a class="gh-btn" href="https://github.com/tarasglek/chatcraft.org/issues/802">View on GitHub</a></div>
Top comments (0)