Rsr2425 commited on
Commit
a2e4e8f
·
1 Parent(s): f5e46c1

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
- setUrl('');
18
  } catch (error) {
19
  console.error('Error:', error);
20
  }
21
  };
22
 
 
 
 
 
 
 
 
23
  return (
24
- <Box sx={{ mb: 4, display: 'flex', gap: 2 }}>
25
- <TextField
26
- fullWidth
27
- label="Source Documentation"
28
- value={url}
29
- onChange={(e) => setUrl(e.target.value)}
30
- />
31
- <Button variant="contained" onClick={handleSubmit}>
32
- Pull Source Docs
33
- </Button>
 
 
 
 
 
 
 
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 when button is clicked', async () => {
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 8000:8000 \
19
  simplify
20
 
21
  echo "Services started!"
22
- echo "Frontend available at: http://localhost"
23
- echo "Backend available at: http://localhost:8000"
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"