Minor UI update
Browse files
frontend/src/components/DocumentInput.tsx
CHANGED
@@ -1,8 +1,9 @@
|
|
1 |
-
import { TextField, Button, Box } from '@mui/material';
|
2 |
import { useState } from 'react';
|
3 |
|
4 |
function DocumentInput() {
|
5 |
const [url, setUrl] = useState('');
|
|
|
6 |
|
7 |
const handleSubmit = async () => {
|
8 |
try {
|
@@ -14,23 +15,37 @@ function DocumentInput() {
|
|
14 |
body: JSON.stringify({ url }),
|
15 |
});
|
16 |
if (!response.ok) throw new Error('Network response was not ok');
|
17 |
-
|
18 |
} catch (error) {
|
19 |
console.error('Error:', error);
|
20 |
}
|
21 |
};
|
22 |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
23 |
return (
|
24 |
-
<Box sx={{ mb: 4
|
25 |
-
<
|
26 |
-
|
27 |
-
|
28 |
-
|
29 |
-
|
30 |
-
|
31 |
-
|
32 |
-
|
33 |
-
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
34 |
</Box>
|
35 |
);
|
36 |
}
|
|
|
1 |
+
import { TextField, Button, Box, Alert } from '@mui/material';
|
2 |
import { useState } from 'react';
|
3 |
|
4 |
function DocumentInput() {
|
5 |
const [url, setUrl] = useState('');
|
6 |
+
const [showSuccess, setShowSuccess] = useState(false);
|
7 |
|
8 |
const handleSubmit = async () => {
|
9 |
try {
|
|
|
15 |
body: JSON.stringify({ url }),
|
16 |
});
|
17 |
if (!response.ok) throw new Error('Network response was not ok');
|
18 |
+
setShowSuccess(true);
|
19 |
} catch (error) {
|
20 |
console.error('Error:', error);
|
21 |
}
|
22 |
};
|
23 |
|
24 |
+
const handleUrlChange = (e: React.ChangeEvent<HTMLInputElement>) => {
|
25 |
+
setUrl(e.target.value);
|
26 |
+
if (showSuccess) {
|
27 |
+
setShowSuccess(false);
|
28 |
+
}
|
29 |
+
};
|
30 |
+
|
31 |
return (
|
32 |
+
<Box sx={{ mb: 4 }}>
|
33 |
+
<Box sx={{ display: 'flex', gap: 2, mb: 2 }}>
|
34 |
+
<TextField
|
35 |
+
fullWidth
|
36 |
+
label="Source Documentation"
|
37 |
+
value={url}
|
38 |
+
onChange={handleUrlChange}
|
39 |
+
/>
|
40 |
+
<Button variant="contained" onClick={handleSubmit}>
|
41 |
+
Pull Source Docs
|
42 |
+
</Button>
|
43 |
+
</Box>
|
44 |
+
{showSuccess && (
|
45 |
+
<Alert severity="success" sx={{ mt: 1 }}>
|
46 |
+
Source documentation imported successfully!
|
47 |
+
</Alert>
|
48 |
+
)}
|
49 |
</Box>
|
50 |
);
|
51 |
}
|
frontend/src/tests/components/DocumentInput.test.tsx
CHANGED
@@ -11,7 +11,7 @@ describe('DocumentInput', () => {
|
|
11 |
mockFetch.mockResolvedValue({ ok: true, json: () => Promise.resolve({}) });
|
12 |
});
|
13 |
|
14 |
-
test('submits URL
|
15 |
render(<DocumentInput />);
|
16 |
|
17 |
const input = screen.getByLabelText('Source Documentation');
|
@@ -27,5 +27,35 @@ describe('DocumentInput', () => {
|
|
27 |
headers: { 'Content-Type': 'application/json' },
|
28 |
body: JSON.stringify({ url: 'https://example.com' }),
|
29 |
});
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
30 |
});
|
31 |
});
|
|
|
11 |
mockFetch.mockResolvedValue({ ok: true, json: () => Promise.resolve({}) });
|
12 |
});
|
13 |
|
14 |
+
test('submits URL and shows success message while keeping URL in input', async () => {
|
15 |
render(<DocumentInput />);
|
16 |
|
17 |
const input = screen.getByLabelText('Source Documentation');
|
|
|
27 |
headers: { 'Content-Type': 'application/json' },
|
28 |
body: JSON.stringify({ url: 'https://example.com' }),
|
29 |
});
|
30 |
+
|
31 |
+
// Check if success message is shown
|
32 |
+
expect(screen.getByText('Source documentation imported successfully!')).toBeInTheDocument();
|
33 |
+
|
34 |
+
// Verify URL is still in the input
|
35 |
+
expect(input).toHaveValue('https://example.com');
|
36 |
+
});
|
37 |
+
|
38 |
+
test('hides success message when starting to type new URL', async () => {
|
39 |
+
render(<DocumentInput />);
|
40 |
+
|
41 |
+
// First submit a URL
|
42 |
+
const input = screen.getByLabelText('Source Documentation');
|
43 |
+
const button = screen.getByText('Pull Source Docs');
|
44 |
+
|
45 |
+
await act(async () => {
|
46 |
+
await fireEvent.change(input, { target: { value: 'https://example.com' } });
|
47 |
+
await fireEvent.click(button);
|
48 |
+
});
|
49 |
+
|
50 |
+
// Verify success message is shown
|
51 |
+
expect(screen.getByText('Source documentation imported successfully!')).toBeInTheDocument();
|
52 |
+
|
53 |
+
// Start typing new URL
|
54 |
+
await act(async () => {
|
55 |
+
await fireEvent.change(input, { target: { value: 'https://new' } });
|
56 |
+
});
|
57 |
+
|
58 |
+
// Verify success message is hidden
|
59 |
+
expect(screen.queryByText('Source documentation imported successfully!')).not.toBeInTheDocument();
|
60 |
});
|
61 |
});
|
run_local.sh
CHANGED
@@ -15,12 +15,12 @@ docker run -d \
|
|
15 |
--env-file .env \
|
16 |
--name simplify \
|
17 |
-p 80:80 \
|
18 |
-
-p
|
19 |
simplify
|
20 |
|
21 |
echo "Services started!"
|
22 |
-
echo "Frontend available at: http://localhost"
|
23 |
-
echo "Backend available at: http://localhost:
|
24 |
echo ""
|
25 |
echo "To view logs: docker logs -f simplify"
|
26 |
echo "To stop: docker stop simplify"
|
|
|
15 |
--env-file .env \
|
16 |
--name simplify \
|
17 |
-p 80:80 \
|
18 |
+
-p 7860:7860 \
|
19 |
simplify
|
20 |
|
21 |
echo "Services started!"
|
22 |
+
echo "Frontend available at: http://localhost:7860"
|
23 |
+
echo "Backend available at: http://localhost:7860"
|
24 |
echo ""
|
25 |
echo "To view logs: docker logs -f simplify"
|
26 |
echo "To stop: docker stop simplify"
|