Skip to content

Commit ace1749

Browse files
mluukkaimluukkai
committed
feat: prompt info format
1 parent ab59ed5 commit ace1749

File tree

4 files changed

+95
-42
lines changed

4 files changed

+95
-42
lines changed

‎src/client/components/Prompt/PromptInfoContent.tsx‎

Lines changed: 83 additions & 36 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,11 @@
11
import {
22
Box,
33
Divider,
4+
Tab,
5+
Tabs,
46
Typography,
57
} from '@mui/material'
8+
import { useState } from 'react'
69
import { useTranslation } from 'react-i18next'
710
import ReactMarkdown from 'react-markdown'
811
import { PromptInfo } from 'src/client/types'
@@ -37,53 +40,97 @@ export const PromptInfoContent = ({
3740

3841
const { t } = useTranslation()
3942
const defaultInstructions = type === 'PERSONAL' ? t('prompt:myPrompt') : t('prompt:defaultChatInstructions')
43+
const [tab, setTab] = useState(0)
44+
45+
// If system message is hidden, render content without tabs
46+
if (hidden) {
47+
return (
48+
<Box sx={{
49+
p: 2,
50+
display: 'flex',
51+
flexDirection: 'column',
52+
gap: 2,
53+
}}>
54+
<Box>
55+
<Typography variant="h5" fontWeight="bold">{name || '-'}</Typography>
56+
57+
<Box sx={{
58+
mt: 2,
59+
overflowWrap: 'break-word',
60+
wordBreak: 'break-word',
61+
whiteSpace: 'pre-wrap'
62+
}}>
63+
<Typography>
64+
{userInstructions?.length ? userInstructions : defaultInstructions}
65+
</Typography>
66+
</Box>
67+
</Box>
68+
</Box>
69+
)
70+
}
4071

4172
return (
4273
<Box sx={{
43-
p: 2,
4474
display: 'flex',
4575
flexDirection: 'column',
46-
gap: 2,
4776
}}>
48-
<Box>
49-
<Typography mb={2} fontWeight="bold">{t('prompt:promptName')}</Typography>
50-
51-
{/* No <p> wrapper needed anymore */}
52-
<Box sx={muiTextfieldMimic}>
53-
<Typography>{name || '-'}</Typography>
54-
</Box>
77+
<Tabs
78+
sx={{ borderBottom: 1, borderColor: 'divider', px: 2 }}
79+
value={tab}
80+
onChange={(_, newValue) => setTab(newValue)}
81+
>
82+
<Tab label={t('prompt:description')} />
83+
<Tab label={t('prompt:languageModel')} />
84+
</Tabs>
5585

56-
<Typography mt={3} mb={2} fontWeight="bold">
57-
{type === 'PERSONAL' ? t('prompt:promptDescription') : t('prompt:promptInstructions')}
58-
</Typography>
86+
{tab === 0 && (
87+
<Box sx={{
88+
p: 2,
89+
display: 'flex',
90+
flexDirection: 'column',
91+
gap: 2,
92+
}}>
93+
<Box>
94+
<Typography variant="h5" fontWeight="bold">{name || '-'}</Typography>
5995

60-
<Box sx={{ ...muiTextfieldMimic, ...multilineMimic }}>
61-
<ReactMarkdown>
62-
{userInstructions?.length ? userInstructions : defaultInstructions}
63-
</ReactMarkdown>
96+
<Box sx={{
97+
mt: 2,
98+
overflowWrap: 'break-word',
99+
wordBreak: 'break-word',
100+
whiteSpace: 'pre-wrap'
101+
}}>
102+
<Typography>
103+
{userInstructions?.length ? userInstructions : defaultInstructions}
104+
</Typography>
105+
</Box>
106+
</Box>
64107
</Box>
65-
</Box>
108+
)}
66109

67-
{
68-
!hidden &&
69-
<>
70-
<Divider sx={{ my: 3 }} />
71-
<Box>
72-
<Typography mb={2} fontWeight="bold">{t('prompt:systemMessageLabel')}</Typography>
73-
<Box sx={{ ...muiTextfieldMimic, ...multilineMimic }}>
74-
{systemMessage ? (
75-
<ReactMarkdown>
76-
{systemMessage}
77-
</ReactMarkdown>
78-
) : (
79-
<Typography color="text.secondary">
80-
{t('prompt:noSystemMessage')}
81-
</Typography>
82-
)}
83-
</Box>
110+
{tab === 1 && (
111+
<Box sx={{
112+
p: 2,
113+
display: 'flex',
114+
flexDirection: 'column',
115+
gap: 2,
116+
}}>
117+
<Box sx={{
118+
overflowWrap: 'break-word',
119+
wordBreak: 'break-word',
120+
whiteSpace: 'pre-wrap'
121+
}}>
122+
{systemMessage ? (
123+
<Typography>
124+
{systemMessage}
125+
</Typography>
126+
) : (
127+
<Typography color="text.secondary">
128+
{t('prompt:noSystemMessage')}
129+
</Typography>
130+
)}
84131
</Box>
85-
</>
86-
}
132+
</Box>
133+
)}
87134
</Box>
88135
)
89136
}

‎src/client/locales/en.json‎

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -451,7 +451,7 @@
451451
"courseSourceMaterials": "Edit course's source materials",
452452
"edit": "Edit",
453453
"preview": "Preview",
454-
"defaultChatInstructions": "You are interacting with a chat interface that has a pre-defined system prompt. This means the AI has been given a specific role, personality, or set of rules to follow.\n\n**How to start:**\n* Simply type **\"Hello\"** or ask a question to see how it responds.\n* The AI will adhere to its hidden instructions while chatting with you.",
454+
"defaultChatInstructions": "You are interacting with a chat interface that has a pre-defined system prompt. This means the AI has been given a specific role, personality, or set of rules to follow.\n\nHow to start:\n- Simply type \"Hello\" or ask a question to see how it responds.\n- The AI will adhere to its hidden instructions while chatting with you.",
455455
"studentViewInfoAlert": "This view is visible to students in the \"Prompt Information\" section.",
456456
"promptName": "Prompt name",
457457
"promptInstructions": "User instructions",
@@ -468,7 +468,9 @@
468468
"modelSourceMaterialInstructions": "Source material instructions for the model",
469469
"promptDescription": "Prompt description",
470470
"myPrompt": "My prompt",
471-
"missingPromptName": "Prompt name is missing"
471+
"missingPromptName": "Prompt name is missing",
472+
"description": "Description",
473+
"languageModel": "AI Instructions"
472474
},
473475
"tooltip": {
474476
"copied": "Copied!"

‎src/client/locales/fi.json‎

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -453,7 +453,7 @@
453453
"courseSourceMaterials": "Muokkaa kurssin materiaaleja",
454454
"edit": "Muokkaa",
455455
"preview": "Esikatsele",
456-
"defaultChatInstructions": "Olet vuorovaikutuksessa chat-käyttöliittymän kanssa, jossa on ennalta määritetty järjestelmäkehote. Tämä tarkoittaa, että tekoälylle on annettu tietty rooli, persoonallisuus tai säännöt, joita seurata.\n\n**Kuinka aloittaa:**\n* Kirjoita yksinkertaisesti **\"Moi\"** tai kysy kysymys nähdäksesi, miten se vastaa.\n* Tekoäly noudattaa piilotettuja ohjeitaan jutellessaan kanssasi.",
456+
"defaultChatInstructions": "Olet vuorovaikutuksessa chat-käyttöliittymän kanssa, jossa on ennalta määritetty järjestelmäkehote. Tämä tarkoittaa, että tekoälylle on annettu tietty rooli, persoonallisuus tai säännöt, joita seurata.\n\nKuinka aloittaa:\n- Kirjoita yksinkertaisesti \"Moi\" tai kysy kysymys nähdäksesi, miten se vastaa.\n- Tekoäly noudattaa piilotettuja ohjeitaan jutellessaan kanssasi.",
457457
"studentViewInfoAlert": "Tämä näkymä näkyy opiskelijoille kohdassa \"Alustuksen tiedot\".",
458458
"promptName": "Alustuksen nimi",
459459
"promptInstructions": "Alustuksen käyttöohjeet",
@@ -470,7 +470,9 @@
470470
"modelSourceMaterialInstructions": "Kielimallin lähdemateriaaliohjeistus",
471471
"promptDescription": "Alustuksen kuvaus",
472472
"myPrompt": "Oma alustukseni",
473-
"missingPromptName": "Alustukselta puuttuu nimi"
473+
"missingPromptName": "Alustukselta puuttuu nimi",
474+
"description": "Kuvaus",
475+
"languageModel": "Tekoälyn ohjeistus"
474476
},
475477
"tooltip": {
476478
"copied": "Kopioitu!"

‎src/client/locales/sv.json‎

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -424,7 +424,7 @@
424424
"unknownRagMessage": "Om svaret inte finns i källmaterialet, tala om för användaren direkt att inget svar är tillgängligt från källorna.",
425425
"edit": "Redigera",
426426
"preview": "Förhandsgranska",
427-
"defaultChatInstructions": "Du interagerar med ett chattgränssnitt som har en fördefinierad systemprompt. Detta innebär att AI:n har tilldelats en specifik roll, personlighet eller uppsättning regler att följa.\n\n**Hur du börjar:**\n* Skriv helt enkelt **\"Hej\"** eller ställ en fråga för att se hur den svarar.\n* AI:n kommer att följa sina dolda instruktioner medan den chattar med dig.",
427+
"defaultChatInstructions": "Du interagerar med ett chattgränssnitt som har en fördefinierad systemprompt. Detta innebär att AI:n har tilldelats en specifik roll, personlighet eller uppsättning regler att följa.\n\nHur du börjar:\n- Skriv helt enkelt \"Hej\" eller ställ en fråga för att se hur den svarar.\n- AI:n kommer att följa sina dolda instruktioner medan den chattar med dig.",
428428
"studentViewInfoAlert": "Denna vy visas för studenter under avsnittet \"Promptinformation\".",
429429
"promptName": "Promptnamn",
430430
"promptInstructions": "Användarinstruktioner",
@@ -441,7 +441,9 @@
441441
"modelSourceMaterialInstructions": "Källmaterialsinstruktioner för modellen",
442442
"promptDescription": "Promptbeskrivning",
443443
"myPrompt": "Min prompt",
444-
"missingPromptName": "Prompten saknar namn"
444+
"missingPromptName": "Prompten saknar namn",
445+
"description": "Beskrivning",
446+
"languageModel": "AI-instruktioner"
445447
},
446448
"tooltip": {
447449
"copied": "Kopierad!"

0 commit comments

Comments
 (0)