Commit graph

49 commits

Author SHA1 Message Date
sabaimran
9a5bf4c701 Fix rendering of teaser reference panel in mobile width 2024-07-15 19:40:55 +05:30
sabaimran
2e9275c0f3 Remove side panel padding in desktop view. Fix width in mobile view 2024-07-15 19:33:12 +05:30
Debanjum Singh Solanky
ba0ba6b59f Merge branch 'features/big-upgrade-chat-ux' of github.com:khoj-ai/khoj into document-styling-on-chat-ux 2024-07-15 10:42:56 +05:30
sabaimran
06dce4729b
Make most major changes for an updated chat UI (#843)
- Updated references panel
- Use subtle coloring for chat cards
- Chat streaming with train of thought
- Side panel with limited sessions, expandable
- Manage conversation file filters easily from the side panel
- Updated nav menu, easily go to agents/automations/profile
- Upload data from the chat UI (on click attachment icon)
- Slash command pop-up menu, scrollable and selectable
- Dark mode-enabled
- Mostly mobile friendly
2024-07-14 23:18:06 +05:30
Debanjum Singh Solanky
6dd90931e8 Fix closing side panel on mobile when click open a chat session 2024-07-14 22:54:49 +05:30
Debanjum Singh Solanky
47b754c07b Only open side panel as drawer in mobile view 2024-07-14 14:08:41 +05:30
Debanjum Singh Solanky
b47f30ad77 Make Khoj icon appropriately sized and side panel arrow bold 2024-07-14 14:06:36 +05:30
Debanjum Singh Solanky
e6b21144e2 Conversations list should resize to take max space on side panel 2024-07-14 13:49:36 +05:30
Debanjum Singh Solanky
c2bf405489 Make loading message, styling configurable. Do not show agent when no data
- Pass Loading message, class name via props to both inline and normal
  loading spinners
- Pass loading conversation message to loading spinner when chat
  history is being fetched
2024-07-14 13:00:36 +05:30
Debanjum Singh Solanky
63719747cb Show agent profile card with description when hover on agent in chat view
- Create profile card componennt. Use it for agent profile card
- Pass agent persona from khoj server via API
- Put link to agent profile page in the hover card to make it 2 clicks
  away. Othewise inadvertent clicks on agent in chat view lead away to
  agent page
- Use tailwind line-clamp extension to clamp card to first two lines
2024-07-14 12:20:11 +05:30
Debanjum Singh Solanky
dbbd4b9777 Show action bar on last chat message without hover 2024-07-14 10:32:31 +05:30
Debanjum Singh Solanky
a0f38e079f Improve Train of Thought icons spacing and loading circle 2024-07-14 09:35:15 +05:30
Debanjum Singh Solanky
e9567741eb Improve mobile friendly styling of chat session side panel 2024-07-14 00:57:08 +05:30
Debanjum Singh Solanky
b26a6e25d1 Show chat message action buttons without hover on mobile interfaces
This is because hover maybe hard to do on mobile devices
2024-07-14 00:54:23 +05:30
Debanjum Singh Solanky
f69f9e3523 Close chat sessions side panel on click open a chat session 2024-07-14 00:53:16 +05:30
Debanjum Singh Solanky
d51011314f Improve styling of chat input, references UI across screen sizes
Use tailwind screen breakpoints shorthand instead of js to apply
different styling for different screen sizes
2024-07-13 20:45:34 +05:30
Debanjum Singh Solanky
2668e42e7f Center cursor in chat input. See upto 2 lines for multi-line context
- Reuse class name when get slash command icons
- Previous chat input styling didn't have the cursor centered in the
  chat input text area. But it did allow seeing multi line chat inputs
  for context
2024-07-13 02:51:29 +05:30
Debanjum Singh Solanky
aeaebfb515 Show chat message timestamp on hover in chat view 2024-07-13 02:51:19 +05:30
Debanjum Singh Solanky
e00c6b486e Add hover text descriptions of action buttons on chat message in web view 2024-07-12 15:40:51 +05:30
Debanjum Singh Solanky
5fccccfdff Do not render references with broken links in chat view 2024-07-12 15:14:11 +05:30
Debanjum Singh Solanky
b98a0cfe1b Render inline png, webp images generated by Khoj in chat view
Add spacing between chat message paragraphs
2024-07-12 15:13:19 +05:30
sabaimran
3e7e73ddd6 Switch from using dynamic routes to static routes and extracting slug from URL manually. See https://github.com/vercel/next.js/discussions/64660 for limitations with static export / dynamic routes 2024-07-11 23:06:27 +05:30
sabaimran
bea0aa5445 Improve the logged out share experience 2024-07-11 20:11:21 +05:30
sabaimran
6f1d799759 Modularize code and implemenet share experience 2024-07-10 23:08:16 +05:30
sabaimran
1b4a51f4a2 Remove print statement for debugging timestamps 2024-07-10 14:54:22 +05:30
sabaimran
0369eb6e0e Fix timestamp bug for pending message and expand CSP for thumbnails 2024-07-10 14:53:31 +05:30
sabaimran
375685530f Add content security policy to the chat page 2024-07-10 11:18:41 +05:30
sabaimran
c5cfd0f2cf Remove unused slash command-related useeffect hook 2024-07-10 10:03:58 +05:30
sabaimran
e1a5c17775 Add DOMPurify for rendering md text. Add a easter egg in the console 2024-07-10 10:03:08 +05:30
sabaimran
e358723baa Fix image rendering and unique key for pending message? 2024-07-09 21:55:54 +05:30
sabaimran
c8c5d50b1a Improve command bar slash experience 2024-07-09 21:39:13 +05:30
sabaimran
c25bf97831 Update hover styling for see all button 2024-07-09 20:55:54 +05:30
sabaimran
23b71b0dff Remove shadow from the slash command bar 2024-07-09 20:52:38 +05:30
sabaimran
998e2aec30 Update dark mode, fix chat message time stamp, fix rendering for new message 2024-07-09 20:50:20 +05:30
sabaimran
cc22e1b013 Add pop-up module for the slash commands 2024-07-09 19:46:17 +05:30
sabaimran
5b69252337 Add hover effects for chat messages 2024-07-09 14:56:57 +05:30
sabaimran
609e7ee19c Fix width of side panel 2024-07-09 12:02:01 +05:30
sabaimran
6f8a65c529 References, mobile friendly chat sessions and file filter 2024-07-07 15:42:29 +05:30
sabaimran
aec44a0b89 Add dark mode toggle! And improve experience for train of thought 2024-07-04 18:29:21 +05:30
sabaimran
465ef0b772 Add a loading experience when waiting for khoj response 2024-07-04 13:49:51 +05:30
sabaimran
d5ba916978 Working example of streaming, intersection observer, other UI updates 2024-07-04 00:30:01 +05:30
sabaimran
78d1a29bc1 Finish up filte filter side panel menu 2024-07-02 23:32:36 +05:30
sabaimran
8a6722ba97 Add basic implementation for chat side panel components 2024-07-02 21:56:43 +05:30
sabaimran
0ee7cc8c47 Change overall architecure of how information is flowing for better statefulness 2024-07-02 12:39:54 +05:30
sabaimran
541ce04ebc Checkpoint: Updated sidebar panel with new components
- Add non-functional UI elements for chat, references, feedback buttons, rename/share session, mic, attachment, websocket connection
2024-07-02 11:18:50 +05:30
sabaimran
80fe5ce182 Fix user not authenticated interpretation error 2024-06-27 21:13:54 +05:30
sabaimran
870d9ecdbf
Add a fact checker feature with updated styling (#835)
- Add an experimental feature used for fact-checking falsifiable statements with customizable models. See attached screenshot for example. Once you input a statement that needs to be fact-checked, Khoj goes on a research spree to verify or refute it.
- Integrate frontend libraries for [Tailwind](https://tailwindcss.com/) and [ShadCN](https://ui.shadcn.com/) for easier UI development. Update corresponding styling for some existing UI components. 
- Add component for model selection 
- Add backend support for sharing arbitrary packets of data that will be consumed by specific front-end views in shareable scenarios
2024-06-27 18:45:38 +05:30
sabaimran
3b7a9358c3
Add our first view via Next.js for Agents (#817)
Initialize our migration to use Next.js for front-end views via Agents. This includes setup for getting authenticated users, reading in available agents, setting up a pop-up modal when you're clicking on an agent, and allowing users to start new conversations with agents.

Best attempt at an in-place migration, though there are some noticeable differences.

Also adds view for chat that are not being used, but in experimental phase.
2024-06-27 13:56:16 +05:30
sabaimran
a53178cab9
Add developer support for using next.js to serve generated static files (#814)
To improve the developer experience for front-end development, we're migrating to Next.js. In order to do this migration page-by-page, we're using static site generation via Next.js. This also helps us avoid making cross site requests from front-end to back-end for the time being, while giving a ramp to separating out server and client if needed for scale down the road.

Dev instructions for using the next.js setup are in the added README.

This adds scaffolding for including the built files in the python package as well as the docker images. Docker setup has been tested locally. In order to verify the build is working as expected, we can navigate to the {khoj_host}:42110/experimental and verify that the experiment page comes up.

This setup works with serving static files included in the src/interface/web folder from the Django app. The key bit for understanding the setup is in the yarn export command in package.json.
2024-06-22 20:12:41 +05:30