June 16, 2025
This is starting to look like something, no hope is lost.
You can focus different components with tab or shift+tab. When writing the command you specify a channel which will be opened on app start. When that happens, or you choose a different channel in the sidebar, the chat history for this newly opened channel loads, after that it's up to this LAZY ASS websocket SLOP to deliver live messages when they are sent in the original slack channel. I had a lot of issues with websocket (as you can probably tell), it was giving me messages in random order, from before the app even started and all sorts of stuff. I don't think everything is sorted out in that regard, so I will have to take a closer look at it.
Next to implement would be the input, bc it currently does nothing, but that will be quick. Also I am working on a userCache, currently after a message is rendered the user's ID is displayed instead of their display name for like ~200ms, then it's rerendered with the proper display name, but next time this user writes a message it will instantly have the user's display name text to it, thanks to the caching. Maybe I will also add all the users to the cache in the background while the app is running, unless that's not too overkill.
Sad to end on a sad note, but unfortunately my app is inherently limited by the slack rate limits (😠😤) aside from the slack api limitations in general. I am not sure how far I can take this app, if it's going to be usable by more people simultaneously than just me (if anyone would ever even want to use it). Either way, I WILL make it right. Maybe I will have to use some tricky, sussy, hacky ways, maybe drop some people d*ad (can I say that here? let me know in the comment or smth, don't want to get my project banned or smth) in the process, but I will get where I need to get, understood? Aight, see ya tomorrow
ROGER THAT
Aight so I have been working on the main command: hackcli channel open. Probably gonna change this command name or the structure of the commands entirely again because it sounds clunky. A LOT HAS HAPPENED.
So basically with this command a TUI opens where you can interact with your slack channels just like in slack (sidebar, chat with messages and input to type a message). First I split up this program into four smaller ones, but then I decided to have just one big program as everything was easier that way. I learned a lot about websocket and that kinda stuff because I use that to get notified from the slack api when a message is posted to a channel for example so I can display it live in the TUI. I also used go routines and channels for the first time, not complex scenario but still learnt from it. Currently the messages don't appear in the chat for some reason, will have to check why that is and fix. The UI looks like shiet, but I am working on it, will look good in no time, trust me.
I HAVE BEEN TRYING TO UPDATE A CUSTOM PROFILE FIELD FOR 5 HOURS...
SPOILER I FAILED **END OF SPOILER (if you know how to do that you can comment)
Yeah clicking enter now actually updates your slack profile and shows a confirmation message, but I had to remove the Fav Activities field. The slack go sdk failed me and I had to make some http requests manually to the slack go sdk. Tried literally everything possible at this point to update the custom field, but idk it's impossible, everything was correct, change my mind. It's crazy how many weird debugging methods I am using XD, I won't ever learn the correct way to debug code LOL.
I'm writing this in the middle of the night. Added an edit command and a first argument being profile (hackcli edit profile). Basically you can edit some of the more important profile information of yours through a nice UI. I got to know Bubble tea from it's evil side and am pretty discouraged. There is a high chance I am overcomplicating everything or doing it the completely wrong way, idk but the way bubble tea does it's stuff seems really wrong coming from javascript and react. Either way... this command is not yet finished, I have to figure out how to update the user's profile info, because for some reason there is no simple method for that in the go slack sdk.
Quick update INCOMING!
The login command now checks if the user already has a valid slack token in the config.json file (if the user is logged in). If user is logged in the cli prompts him that he can use all features of HackCLI now and if user is not logged in they will complete the login flow
A mobile app made with react native. No productivity app was right for me, so I decided to create a better one myself. It has a journal (something I have wanted to have for a long time), and most importantly a beautiful timeline where I can structure my day. Every task also has some specific features you can enable, for example you can track your reps and breaks in the gym.
At first I was so overwhelmed with cobra and bubble tea that it was crazy, but after some time it wasn't that bad. I decided to have a different command for a different feature. Now I can think of it as creating many smaller apps, instead of a big one, this makes things easier. SOOO chat, I created the first command - LOGIN, basically the user authorizes the HackCLI slack app that I created, gets the token from a backend function, pastes it into the cli and then we create a config file on the user's machine with the token and all other commands will be able to use this token to do stuff on the user's behalf (the user will be logged in). So yeah, will only get easier from now on, right? RIGHT?!
OH, btw I have not tested this command at all LOL, so it is bound not to work, as per usual, because never works on the first try for me, but little debugging will do the trick.
I tested and debugged the app and got it to work. Had to add a new scope so the cli can get the user's current status and emoji to make it the initial value of the text inputs. I also fixed the layout with empty lines to make it more readable. I made a script to inject slack secrets at build time so they work for all users and are not displayed on github. Lastly I distributed the cli on npm and made a simple installation guide.
The app flow is finished, now I have to debug the app and see what needs improvement (currently there are some errors). I did the same project but in Go to see what feels better. This was much faster because I am familiar with js and already knew what to do.
Change your slack status in seconds from the terminal. Project to learn typescript and Ink. This project was not vibe-coded 🤮, used AI only to help me distribute the cli and check if my code is correct.
Finished the app and distributed it with goreleaser. I added the rest of the app flow: input to enter the new status, another for status emoji (fallback if the terminal doesn't support emojis) and confirmation and error messages. The app calls the slack api to update user's slack status and get their name to greet them. I also created an extensive installation guide, but simplified it later.
Understanding the BubbleTea framework took some time and trial. I started by creating a slack OAuth flow so I can log the user in. Had a lot of problems with retrieving the code through a redirect uri. Tried running a go server with ngrok but that didn't work too well so I deployed a vercel function and now slack redirects to it and user has to copy the code given by slack and paste it back into the terminal.
I added a clear progression to the timeline. Every task in the timeline up to the current moment is colored and every task in the future is grey with just the color accents. Also connected all tasks with a progress bar which behaves just like the tasks color wise and has a smooth gradient from one task's color to another's when between tasks. I think this is an essential visual upgrade so the user can roughly know how much of a task is left or how far in the day is he.
Really just transformed a list of tasks into a timeline:
- Added date sections to indicate when a new day starts - Added gaps beteen tasks indicating how much free time there is between two tasks - Added timestamps when every task starts and ends - Just one timestamp if tasks are right after each other (no duplicate timestamps showing same time) - Added task's timeframe and duration below it's name - Fixed invalid timeframe check in TaskSettings - TaskSettings now doesn't allow to have overlapping tasks - + more that I don't remember
You can now add a new task by configuring the settings in TaskSettings or update an existing task. I added error messages so the user can not save a task if it doesn't have a name, emoji etc. I also sorted the tasks array by date and time so that the earliest task is first. I tried to move my project to a location on my windows system (was on Linux system, I am using wsl) so I can create EAS builds locally and not wait 6hrs in a cloud queue but the app was reloading so slow due to the wsl bridge that I went back to my original folder. Thankfully tho hackatime didn't break and correctly tracks my hours for this project after all that.
Added a delete button to a Task and made a few changes. Created settings for a Task with a name input, start and end time, duration, date, color and emoji. I used a DateTimePicker package and a reanimated-color-picker library for the respective settings. It doesn't seem like I did a whole lot, tbh I am probably bad at making UIs, but this just takes time for me.
Added firestore security rules. Started creating the timeline page: added a header with a settings page where you can log out, used FlashList for the timeline, created a Task component with a ThreeStateButton that indicates if the task is done, not done or kinda done.
There is now authentication in my app. Worked on the sign in methods, used a vercel function to safely handle github client secret and get the access token (tried google cloud functions before). I also fixed some redirecting issues with the github sign in, made sure that user accounts are created in firestore when user signs up. Hope it's not a big problem this devlog was posted after more than 4 hours of coding since the last one, I wanted to have the authentication finished and have something to show.
This was widely regarded as a great move by everyone.
Played around with Firebase and implemented saving to Firestore (there are still some issues)
I finished the journal page - the first page in my app. I added the last feature to it - a list of improvements you want to make.
This is my first devlog where I talk about everything I did so far for the 23 hours that are tracked on my project (at the beginning I didn't know we had to make devlogs). I know the small amount of stuff I made might not justify the 23 hours, but some things took me hours to figure out. Sorry that the audio is so quiet (hope it's bearable) and that I'm swinging on my chair so much (I might have ADHD or something).