Skip to content

Commit 680e109

Browse files
chr-hertelchr-hertel
committed
refactor: follow up on example structure
1 parent 7cb6f6d commit 680e109

33 files changed

+227
-211
lines changed

‎README.md

+2-2
Original file line numberDiff line numberDiff line change
@@ -79,7 +79,7 @@ docker compose exec app bin/console app:blog:embed -vv
7979
Now you should be able to run the test command and get some results:
8080

8181
```shell
82-
docker compose exec app bin/console app:chroma:test
82+
docker compose exec app bin/console app:blog:query
8383
```
8484

8585
**Don't forget to set up the project in your favorite IDE or editor.**
@@ -89,4 +89,4 @@ docker compose exec app bin/console app:chroma:test
8989
* The chatbot application is a simple and small Symfony 7.2 application.
9090
* The UI is coupled to a [Twig LiveComponent](https://symfony.com/bundles/ux-live-component/current/index.html), that integrates different `Chat` implementations on top of the user's session.
9191
* You can reset the chat context by hitting the `Reset` button in the top right corner.
92-
* You find three different usage scenarios in the upper navbar.
92+
* You find three different usage scenarios in the upper navbar.

‎assets/app.js

+3
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,6 @@
11
import './bootstrap.js';
22
import 'bootstrap/dist/css/bootstrap.min.css';
33
import './styles/app.css';
4+
import './styles/blog.css';
5+
import './styles/youtube.css';
6+
import './styles/wikipedia.css';

‎assets/icons/entypo/chat.svg

-1
This file was deleted.

‎assets/icons/mdi/symfony.svg

+1
Loading

‎assets/icons/mingcute/ai-fill.svg

-1
This file was deleted.

‎assets/styles/app.css

+3-103
Original file line numberDiff line numberDiff line change
@@ -1,16 +1,5 @@
11
body {
22
min-height: 100vh;
3-
&.rag, .rag .card-img-top {
4-
background: rgb(220,139,110);
5-
background: linear-gradient(0deg, rgba(220,139,110,1) 0%, rgba(244,233,115,1) 100%);
6-
}
7-
&.youtube, .youtube .card-img-top {
8-
background: rgb(34,34,34);
9-
background: linear-gradient(0deg, rgb(0, 0, 0) 0%, rgb(71, 71, 71) 100%);
10-
}
11-
&.wikipedia, .wikipedia .card-img-top {
12-
background: url('/wiki.png') no-repeat right 50px bottom 50px fixed, linear-gradient(0deg, rgb(246, 246, 246) 0%, rgb(197, 197, 197) 100%);
13-
}
143

154
footer, footer a {
165
color: #6c757d;
@@ -20,10 +9,6 @@ body {
209
.index {
2110
.card-img-top {
2211
text-align: center;
23-
24-
.youtube & {
25-
color: #ff0000;
26-
}
2712
}
2813
}
2914

@@ -44,55 +29,19 @@ body {
4429
.card-body {
4530
height: 700px;
4631

47-
.wikipedia & {
48-
background-image: linear-gradient(135deg, #f2f2f2 16.67%, #ebebeb 16.67%, #ebebeb 50%, #f2f2f2 50%, #f2f2f2 66.67%, #ebebeb 66.67%, #ebebeb 100%);
49-
background-size: 21.21px 21.21px;
50-
}
51-
5232
.user-message {
5333
border-radius: 10px 10px 0 10px;
5434
color: #292929;
55-
56-
.rag & {
57-
background: #f4e973;
58-
}
59-
60-
.youtube & {
61-
background: #3e2926;
62-
color: #fafafa;
63-
}
64-
65-
.wikipedia & {
66-
background: #ffffff;
67-
}
6835
}
6936

7037
.bot-message {
7138
border-radius: 10px 10px 10px 0;
39+
color: #292929;
7240

73-
.rag & {
74-
background: #dc8b6e;
75-
76-
a {
77-
color: #f4e973;
78-
}
79-
}
80-
81-
.youtube & {
82-
background: #df3535;
83-
84-
a {
85-
color: #3e2926;
86-
}
87-
}
88-
89-
.wikipedia & {
90-
background: #ffffff;
91-
color: #292929 !important;
41+
&.loading {
42+
color: rgba(41, 41, 41, 0.5);
9243
}
9344

94-
color: #fff;
95-
9645
p {
9746
margin-bottom: 0;
9847
}
@@ -102,31 +51,6 @@ body {
10251
width: 50px;
10352
height: 50px;
10453
border: 2px solid white;
105-
106-
.rag &.bot {
107-
outline: 1px solid #ffdacc;
108-
background: #ffdacc;
109-
}
110-
111-
.rag &.user {
112-
outline: 1px solid #fffad1;
113-
background: #fffad1;
114-
}
115-
116-
.youtube &.bot {
117-
outline: 1px solid #ffcccc;
118-
background: #ffcccc;
119-
}
120-
121-
.youtube &.user {
122-
outline: 1px solid #9e8282;
123-
background: #9e8282;
124-
}
125-
126-
.wikipedia &.bot, .wikipedia &.user {
127-
outline: 1px solid #eaeaea;
128-
background: #eaeaea;
129-
}
13054
}
13155
}
13256

@@ -138,28 +62,4 @@ body {
13862
box-shadow: none !important;
13963
}
14064
}
141-
142-
#welcome {
143-
h4 {
144-
.rag & {
145-
color: #f97b62;
146-
}
147-
148-
.youtube & {
149-
color: #ff0000;
150-
}
151-
}
152-
}
153-
154-
#chat-reset, #chat-submit {
155-
.rag &:hover {
156-
background: #f97b62;
157-
border-color: #f97b62;
158-
}
159-
160-
.youtube &:hover {
161-
background: #ff0000;
162-
border-color: #ff0000;
163-
}
164-
}
16565
}

‎assets/styles/blog.css

+61
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,61 @@
1+
.blog {
2+
body&, .card-img-top {
3+
background: #2c5282;
4+
background: linear-gradient(0deg, #2c5282 0%, #3c366b 100%);
5+
}
6+
7+
.card-img-top {
8+
color: #ffffff;
9+
}
10+
11+
&.chat {
12+
.user-message {
13+
background: #d5054e;
14+
color: #ffffff;
15+
}
16+
17+
.bot-message {
18+
color: #ffffff;
19+
background: #3182ce;
20+
21+
&.loading {
22+
color: rgba(255, 255, 255, 0.5);
23+
}
24+
25+
a {
26+
color: #c8d8ef;
27+
28+
&:hover {
29+
color: #ffffff;
30+
}
31+
}
32+
33+
code {
34+
color: #ffb1ca;
35+
}
36+
}
37+
38+
.avatar {
39+
&.bot {
40+
outline: 1px solid #b8d8fb;
41+
background: #b8d8fb;
42+
}
43+
44+
&.user {
45+
outline: 1px solid #ffb1ca;
46+
background: #ffb1ca;
47+
}
48+
}
49+
50+
#welcome h4 {
51+
color: #2c5282;
52+
}
53+
54+
#chat-reset, #chat-submit {
55+
&:hover {
56+
background: #d5054e;
57+
border-color: #d5054e;
58+
}
59+
}
60+
}
61+
}

‎assets/styles/wikipedia.css

+31
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,31 @@
1+
.wikipedia {
2+
body&, .card-img-top {
3+
background: url('/wiki.png') no-repeat right 50px bottom 50px fixed, linear-gradient(0deg, rgb(246, 246, 246) 0%, rgb(197, 197, 197) 100%);
4+
}
5+
6+
&.chat {
7+
.card-body {
8+
background-image: linear-gradient(135deg, #f2f2f2 16.67%, #ebebeb 16.67%, #ebebeb 50%, #f2f2f2 50%, #f2f2f2 66.67%, #ebebeb 66.67%, #ebebeb 100%);
9+
background-size: 21.21px 21.21px;
10+
}
11+
12+
.user-message {
13+
background: #ffffff;
14+
}
15+
16+
.bot-message {
17+
background: #ffffff;
18+
19+
a {
20+
color: #3e2926;
21+
}
22+
}
23+
24+
.avatar {
25+
&.bot, &.user {
26+
outline: 1px solid #eaeaea;
27+
background: #eaeaea;
28+
}
29+
}
30+
}
31+
}

‎assets/styles/youtube.css

+49
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,49 @@
1+
.youtube {
2+
body&, .card-img-top {
3+
background: rgb(34,34,34);
4+
background: linear-gradient(0deg, rgb(0, 0, 0) 0%, rgb(71, 71, 71) 100%);
5+
}
6+
7+
.card-img-top {
8+
color: #ff0000;
9+
}
10+
11+
&.chat {
12+
.user-message {
13+
background: #3e2926;
14+
color: #fafafa;
15+
}
16+
17+
.bot-message {
18+
color: #ffffff;
19+
background: #df3535;
20+
21+
&.loading {
22+
color: rgba(255, 255, 255, 0.5);
23+
}
24+
}
25+
26+
.avatar {
27+
&.bot {
28+
outline: 1px solid #ffcccc;
29+
background: #ffcccc;
30+
}
31+
32+
&.user {
33+
outline: 1px solid #9e8282;
34+
background: #9e8282;
35+
}
36+
}
37+
38+
#welcome h4 {
39+
color: #ff0000;
40+
}
41+
42+
#chat-reset, #chat-submit {
43+
&:hover {
44+
background: #ff0000;
45+
border-color: #ff0000;
46+
}
47+
}
48+
}
49+
}

‎config/packages/llm_chain.yaml

+1-1
Original file line numberDiff line numberDiff line change
@@ -16,7 +16,7 @@ llm_chain:
1616
openai:
1717
api_key: '%env(OPENAI_API_KEY)%'
1818
chain:
19-
rag:
19+
blog:
2020
# platform: 'llm_chain.platform.anthropic'
2121
model:
2222
name: 'GPT'

‎config/routes.yaml

+8-5
Original file line numberDiff line numberDiff line change
@@ -4,20 +4,23 @@ index:
44
defaults:
55
template: 'index.html.twig'
66

7-
rag:
8-
path: '/rag'
7+
blog:
8+
path: '/blog'
99
controller: 'Symfony\Bundle\FrameworkBundle\Controller\TemplateController'
1010
defaults:
11-
template: 'chat/rag.html.twig'
11+
template: 'chat.html.twig'
12+
context: { chat: 'blog' }
1213

1314
youtube:
1415
path: '/youtube'
1516
controller: 'Symfony\Bundle\FrameworkBundle\Controller\TemplateController'
1617
defaults:
17-
template: 'chat/youtube.html.twig'
18+
template: 'chat.html.twig'
19+
context: { chat: 'youtube' }
1820

1921
wikipedia:
2022
path: '/wikipedia'
2123
controller: 'Symfony\Bundle\FrameworkBundle\Controller\TemplateController'
2224
defaults:
23-
template: 'chat/wikipedia.html.twig'
25+
template: 'chat.html.twig'
26+
context: { chat: 'wikipedia' }

‎demo.png

12 KB
Loading

‎src/Blog/Chat/Blog.php ‎src/Blog/Chat.php

+4-4
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22

33
declare(strict_types=1);
44

5-
namespace App\Blog\Chat;
5+
namespace App\Blog;
66

77
use PhpLlm\LlmChain\ChainInterface;
88
use PhpLlm\LlmChain\Model\Message\Message;
@@ -11,13 +11,13 @@
1111
use Symfony\Component\DependencyInjection\Attribute\Autowire;
1212
use Symfony\Component\HttpFoundation\RequestStack;
1313

14-
final class Blog
14+
final class Chat
1515
{
16-
private const SESSION_KEY = 'rag-chat';
16+
private const SESSION_KEY = 'blog-chat';
1717

1818
public function __construct(
1919
private readonly RequestStack $requestStack,
20-
#[Autowire(service: 'llm_chain.chain.rag')]
20+
#[Autowire(service: 'llm_chain.chain.blog')]
2121
private readonly ChainInterface $chain,
2222
) {
2323
}

‎src/Blog/Command/BlogEmbedCommand.php ‎src/Blog/Command/EmbedCommand.php

+1-1
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,7 @@
1212
use Symfony\Component\Console\Style\SymfonyStyle;
1313

1414
#[AsCommand('app:blog:embed', description: 'Create embeddings for Symfony blog and push to ChromaDB.')]
15-
final class BlogEmbedCommand extends Command
15+
final class EmbedCommand extends Command
1616
{
1717
public function __construct(
1818
private readonly Embedder $embedder,

0 commit comments

Comments
 (0)