Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Rewriting the UI components rendering layer to support custom components #43

Merged
merged 125 commits into from
Apr 22, 2024
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
125 commits
Select commit Hold shift + click to select a range
9d6debf
Rewriting the UI components rendering layer to support custom components
salmenus Apr 3, 2024
e7f1689
Updated dep versions and improved LC adapter
salmenus Apr 3, 2024
0b5e9ab
Updated React Components implementation
salmenus Apr 3, 2024
bff103b
Updated AiChat implementation
salmenus Apr 3, 2024
3ff4ca8
Started implementing streaming in React
salmenus Apr 3, 2024
ddd9d6c
Implemented streaming for React messages
salmenus Apr 4, 2024
fb525eb
Updated linting
salmenus Apr 4, 2024
9b4c1a7
Updated comp name and change React imports
salmenus Apr 4, 2024
d48fe13
Fixed some failing tests
salmenus Apr 4, 2024
5cdd51c
Renamed ConversationItem to ConvItem
salmenus Apr 5, 2024
491fc28
Renamed ChatPicture to Avatar
salmenus Apr 5, 2024
aaaeeb0
Renamed ConversationItem to ChatItem
salmenus Apr 5, 2024
b5b3ca7
Update comp epxo names
salmenus Apr 5, 2024
e366015
Renamed conversation part to chat segment
salmenus Apr 5, 2024
6ece5d0
Added ChatSegment and refactored related types
salmenus Apr 6, 2024
6ce1c8d
Added streamingDomService
salmenus Apr 6, 2024
f4f9f0f
Updated JS/DOM message and chat expo
salmenus Apr 6, 2024
1fdc78b
Refactored core JS prompt box to use new DOM component
salmenus Apr 7, 2024
b1e0d6f
Renamed core/components to logic
salmenus Apr 7, 2024
1821954
Renamed core/comp to ui
salmenus Apr 7, 2024
5dcb06a
Updated folder structure for core JS
salmenus Apr 7, 2024
41f9686
Updated some react components
salmenus Apr 7, 2024
62c9ff0
Update components path
salmenus Apr 7, 2024
41996bc
Renamed x to utils in hf package
salmenus Apr 7, 2024
feb0077
Minor code improvements based on static type analysis
salmenus Apr 7, 2024
3c3c48b
Improved imports and fixed some unit tests
salmenus Apr 7, 2024
3d43ebe
Minor code improvements to React codebase
salmenus Apr 7, 2024
cba5337
Improved ChatItem UID
salmenus Apr 7, 2024
68fea65
Improved abstraction layer around custom messages
salmenus Apr 7, 2024
c13437b
Improving toggling between fetch and stream adapters
salmenus Apr 7, 2024
a4762b4
Fixed a failing unit test
salmenus Apr 7, 2024
bbff652
Renamed Naked theme to Luna
salmenus Apr 8, 2024
c9ca3db
Renamed cht_pic_ctn to avtr_ctn
salmenus Apr 8, 2024
0adce7a
Added luna theme files
salmenus Apr 8, 2024
7824452
Renamed CSS classes
salmenus Apr 8, 2024
869a155
Renamed class names and added AiChatWelcomeMessageReactExpo
salmenus Apr 8, 2024
216f4e2
Moved comp examples
salmenus Apr 8, 2024
b2b07d0
Added empty projects for AiChat showcase
salmenus Apr 8, 2024
1cfef98
Added aiChat demo pages
salmenus Apr 8, 2024
ec20fa4
Updated vite samples config
salmenus Apr 9, 2024
7b08e4d
Updated samples
salmenus Apr 9, 2024
e7491d8
Added docs for props
salmenus Apr 10, 2024
2d1cee0
Updated handling of themeId property
salmenus Apr 10, 2024
6fa160e
Renamed specs DOM folder to JS
salmenus Apr 10, 2024
4bdbf19
Added tests for className
salmenus Apr 10, 2024
cdeae45
Updated some CSS
salmenus Apr 10, 2024
38fec23
Updated some class names and css styles
salmenus Apr 10, 2024
bb5f8d0
Updated CSS styles for prompt box
salmenus Apr 10, 2024
568aaec
Added unit tests for promptBox
salmenus Apr 11, 2024
3052e7f
Updated promptBox and started added tests
salmenus Apr 11, 2024
b317ac8
Added state and handling for promptBox placeholder
salmenus Apr 11, 2024
419e70f
Added disableSubmitButton to promptBox
salmenus Apr 12, 2024
f0831e9
Added tests for autoFocus
salmenus Apr 12, 2024
68abe5e
Added submitShortcut promptBox option and related tests
salmenus Apr 12, 2024
d83fc16
Updated submitShortcut
salmenus Apr 12, 2024
773ef7b
Removed escape-key-pressed on promptBox
salmenus Apr 12, 2024
9faeaf6
Fixed minor issue related to submit logic
salmenus Apr 12, 2024
d39d794
Renamed sample/*/dom to js
salmenus Apr 13, 2024
6520d2f
Updated logic related to root comp width
salmenus Apr 13, 2024
6e98862
Added logic for display of multiple exceptions in exception box
salmenus Apr 13, 2024
a9e778a
Updated UI test names and descriptions
salmenus Apr 13, 2024
01fc97d
Updated exception box to use new component
salmenus Apr 14, 2024
d5706b1
Improved exception handling
salmenus Apr 14, 2024
a43045d
Minor improvements to submit function
salmenus Apr 14, 2024
871f537
Updated message display
salmenus Apr 15, 2024
ad75785
Added unit tests related to display of exceptions in AiChat comp
salmenus Apr 15, 2024
8c99dc3
Updated exceptions
salmenus Apr 15, 2024
1e3b0b2
Added shared package
salmenus Apr 15, 2024
16ccd81
Moved some utility functions to new shared package
salmenus Apr 15, 2024
3fc6973
Simplified @nlux-dev/shared package and imports
salmenus Apr 15, 2024
5857654
Updated exception handling between React and vanilla JS
salmenus Apr 15, 2024
e772ee4
Moved UI dom components to shared
salmenus Apr 16, 2024
e58448a
Removed import React
salmenus Apr 16, 2024
9c0dd22
Moved deepEqual util to shared and exported AiUnifiedMessage
salmenus Apr 16, 2024
100b594
Optimised focus in promptBox when status changes
salmenus Apr 16, 2024
d1d2e88
Updated autoFocus on reset bahaviour
salmenus Apr 16, 2024
fda6509
Improved auto-focus implementation and added tests
salmenus Apr 16, 2024
ebe98de
Added initial load tests
salmenus Apr 16, 2024
8c9ce6d
Renamed context tests folder to aiContext
salmenus Apr 16, 2024
578ea03
Updated autoFocus test
salmenus Apr 16, 2024
0a6bb8b
Renamed conversationSegments to segments in AiChat
salmenus Apr 16, 2024
5132bc2
Refactored ChatSegment
salmenus Apr 16, 2024
deba41f
Moved ChatSegment types to shared
salmenus Apr 16, 2024
4015c4b
Updated shared folders structure
salmenus Apr 16, 2024
10ad8f1
Refactored chat segment events
salmenus Apr 16, 2024
0d537c9
Moved error classes to shared
salmenus Apr 16, 2024
6e9a5c7
Started new implementation for submitPrompt with support for chat seg…
salmenus Apr 16, 2024
f840b56
Added MessageType and generics
salmenus Apr 16, 2024
6c3386c
Renamed MessageType to AiMsg
salmenus Apr 16, 2024
0e8f1e3
Updated AiMsg for ChatItem
salmenus Apr 16, 2024
cf84e91
Updated submitInFetchMode and related tests
salmenus Apr 16, 2024
154d15c
Improved tests for submitPrompt
salmenus Apr 16, 2024
21a0e5a
Updated error handling in submit prompt
salmenus Apr 17, 2024
79f8e3d
Renamed testing blocks to arrange / act / assert
salmenus Apr 17, 2024
f11f049
Implemented submitInStreamingMode
salmenus Apr 17, 2024
c70fd19
Renamed test file
salmenus Apr 17, 2024
602f771
Added default AiMsg type for AiChat
salmenus Apr 17, 2024
79be920
Moved common types to shared and simplified some generics
salmenus Apr 17, 2024
7e80299
Removed old submitPrompt implementation and tests
salmenus Apr 17, 2024
6a3e969
Moved submitPrompt service to shared
salmenus Apr 17, 2024
7dbbbd6
Updated code using submitPrompt
salmenus Apr 17, 2024
7bb1029
Added unit test related to submitPrompt
salmenus Apr 17, 2024
c790ca7
Updated Luna theme and some components
salmenus Apr 18, 2024
844c8a4
Moved markdown to shared folder
salmenus Apr 18, 2024
6569327
Updated submitPrompt
salmenus Apr 18, 2024
81e221b
Added chat segments and items to vanilla JS comp
salmenus Apr 18, 2024
2b070d4
Improved AiMessageStreamed event
salmenus Apr 18, 2024
5cc20a9
Fixed streamed for vanilla JS
salmenus Apr 18, 2024
3188cfb
Updated segment container DOM and started adding unit tests
salmenus Apr 19, 2024
fdd5d21
Added unit test related to segments
salmenus Apr 19, 2024
ddf5808
Updated chatSegment JS
salmenus Apr 19, 2024
6d28c4b
Added logic for showing and hiding segment loader
salmenus Apr 19, 2024
4898068
Added tests to check for segments in React JS on prompt submit
salmenus Apr 19, 2024
d0a9c26
Improved handling of segments on vanilla JS
salmenus Apr 19, 2024
3e16442
Updated message style
salmenus Apr 21, 2024
8d171de
Updated segment style
salmenus Apr 21, 2024
611d068
Updated chatitem spec
salmenus Apr 21, 2024
75bde99
Moved adapter tests under adapters folder
salmenus Apr 21, 2024
543a35b
Updated adapter tests
salmenus Apr 21, 2024
2b54554
Removed duplicated test
salmenus Apr 21, 2024
6e0b166
Updated fetchAdapter test
salmenus Apr 22, 2024
161b996
Updated some test names and folder
salmenus Apr 22, 2024
2791c55
Updated adapter
salmenus Apr 22, 2024
a5c8d3b
Removed legacy specs
salmenus Apr 22, 2024
e17f178
Updated tests workflow
salmenus Apr 22, 2024
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
The table of contents is too big for display.
Diff view
Diff view
  •  
  •  
  •  
2 changes: 1 addition & 1 deletion .github/workflows/run-all-tests.yml
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
# This workflow will do a clean installation of node dependencies, cache/restore them, build the source code and run tests across different versions of node
# For more information see: https://docs.github.com/en/actions/automating-builds-and-tests/building-and-testing-nodejs

name: 300+ Unit Tests
name: 400+ Unit Tests

on:
push:
Expand Down
2 changes: 1 addition & 1 deletion package.json
Original file line number Diff line number Diff line change
Expand Up @@ -28,7 +28,7 @@
"symlink-dir": "^5.2.1",
"jsdom": "^22.1.0",
"typescript": "^5.3.3",
"vite": "^5.0.13"
"vite": "^5.1.0"
},
"bugs": "https://github.com/nluxai/nlux/issues",
"repository": {
Expand Down
1 change: 1 addition & 0 deletions packages/css/themes/rollup.config.ts
Original file line number Diff line number Diff line change
Expand Up @@ -37,6 +37,7 @@ const cssEntry = (input: string, output: string) => ({

const packageConfig: () => Promise<RollupOptions[]> = async () => ([
cssEntry('./src/nova/theme.css', `../../../dist/${folder}/themes/nova.css`),
cssEntry('./src/luna/theme.css', `../../../dist/${folder}/themes/luna.css`),
]);

export default packageConfig;
54 changes: 27 additions & 27 deletions packages/css/themes/src/common/components/chat-room.css
Original file line number Diff line number Diff line change
@@ -1,40 +1,40 @@
.nluxc-root {
> .nluxc-chat-room-container {
.nlux-AiChat-root {
> .nlux-chat-room-container {
display: flex;
flex-direction: column;
flex-grow: 1;
gap: var(--nluxc-flex-gap);
gap: var(--nlux-flex-gap);

> .nluxc-chat-room-conversation-container {
> .nlux-chat-room-conversation-container {
display: flex;
overflow: auto;
flex: 1;
flex-direction: column;
padding: 0;
gap: var(--nluxc-flex-gap);
gap: var(--nlux-flex-gap);

> .nluxc-conversation-messages-container {
> .nlux-conversation-messages-container {
overflow: scroll;
flex: 1;

padding-right: var(--nluxc-padding);
padding-left: var(--nluxc-padding);
padding-right: var(--nlux-padding);
padding-left: var(--nlux-padding);

> .nluxc-conversation-welcome-message {
> .nlux-conversation-welcome-message {
display: flex;
align-items: center;
flex-direction: column;
justify-content: center;
width: 100%;
height: 100%;

> .nluxc-conversation-welcome-message-photo-container {
> .nlux-conversation-welcome-message-photo-container {
position: relative;
display: inline-block;
overflow: hidden;
width: 80px;
height: 80px;
margin-bottom: var(--nluxc-padding-l);
margin-bottom: var(--nlux-padding-l);
border-radius: 50%;

> * {
Expand All @@ -45,50 +45,50 @@
left: 0 !important;
}

> .nluxc-conversation-welcome-message-letter {
font-size: var(--nluxc-font-size-l);
> .nlux-conversation-welcome-message-letter {
font-size: var(--nlux-font-size-l);
font-weight: 400;
z-index: 888888;
display: flex;
align-items: center;
justify-content: center;
margin: 5px;
text-align: center;
color: var(--nluxc-text-color);
color: var(--nlux-text-color);
border-radius: 50%;
background-color: var(--nluxc-message-received-background-color);
background-color: var(--nlux-message-received-background-color);
}

> .nluxc-conversation-welcome-message-rendered-photo {
> .nlux-conversation-welcome-message-rendered-photo {
z-index: 999999;
background-position: center center;
background-size: cover;
}
}

> .nluxc-conversation-welcome-message-name-and-tagline {
> .nlux-conversation-welcome-message-name-and-tagline {
font-weight: 400;
max-width: 80%;
padding: var(--nluxc-padding-l);
padding: var(--nlux-padding-l);
text-align: center;
color: var(--nluxc-text-color);
border-color: var(--nluxc-message-received-border-color);
border-radius: var(--nluxc-border-radius-m);
color: var(--nlux-text-color);
border-color: var(--nlux-message-received-border-color);
border-radius: var(--nlux-border-radius-m);
outline: none;
background-color: var(--nluxc-message-received-background-color);
background-color: var(--nlux-message-received-background-color);

> .nluxc-conversation-welcome-message-name {
font-size: var(--nluxc-font-size-l);
> .nlux-conversation-welcome-message-name {
font-size: var(--nlux-font-size-l);
font-weight: 700;
margin-bottom: var(--nluxc-padding-m);
margin-bottom: var(--nlux-padding-m);
}
}
}
}
}

> .nluxc-chat-room-prompt-box,
> .nluxc-chat-room-footer {
> .nlux-chat-room-prompt-box,
> .nlux-chat-room-footer {
flex: 0;
}
}
Expand Down
20 changes: 10 additions & 10 deletions packages/css/themes/src/common/components/exceptions-box.css
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
.nluxc-root {
.nlux-AiChat-root {
position: relative;

> .nluxc-exceptions-box-container {
> .nlux-exceptions-box-container {
position: absolute;
top: 0;
display: flex;
Expand All @@ -14,16 +14,16 @@
width: 100%;
gap: 0;

> .nluxc-exceptions-box-exception-container {
> .nlux-exceptions-box-exception-container {
max-width: 85%;
padding: var(--nluxc-padding-s) var(--nluxc-border-radius);
color: var(--nluxc-exceptions-box-error-text-color);
border-width: var(--nluxc-border-width);
border-color: var(--nluxc-exceptions-box-error-border-color);
border-radius: var(--nluxc-border-radius-s);
background-color: var(--nluxc-exceptions-box-error-background-color);
padding: var(--nlux-padding-s) var(--nlux-border-radius);
color: var(--nlux-exceptions-box-error-text-color);
border-width: var(--nlux-border-width);
border-color: var(--nlux-exceptions-box-error-border-color);
border-radius: var(--nlux-border-radius-s);
background-color: var(--nlux-exceptions-box-error-background-color);

> .nluxc-exceptions-box-message {
> .nlux-exceptions-box-message {
text-align: center;
}
}
Expand Down
12 changes: 6 additions & 6 deletions packages/css/themes/src/common/components/prompt-box.css
Original file line number Diff line number Diff line change
@@ -1,17 +1,17 @@
.nluxc-root {
.nluxc-prompt-box-container {
.nlux-AiChat-root {
.nlux-prompt-box-container {
display: flex;
align-items: stretch;
flex-direction: row;

gap: var(--nluxc-flex-gap);
gap: var(--nlux-flex-gap);

> .nluxc-prompt-box-text-input {
> .nlux-prompt-box-text-input {
flex: 1;
resize: none;
}

> .nluxc-prompt-box-send-button {
> .nlux-prompt-box-send-button {
display: flex;
align-items: center;
justify-content: center;
Expand All @@ -25,7 +25,7 @@
display: none;
}

&.nluxc-prompt-box-send-button-loading {
&.nlux-prompt-box-send-button-loading {
> svg {
display: none;
}
Expand Down
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
.nluxc-root {
.nlux-AiChat-root {
.spinning-loader {
display: inline-block;
transform: rotateZ(45deg);
Expand Down
Loading
Loading