BAEL-4842 - Use React and Spring Boot to Build a Simple CRUD App

Updating PR to reduce complexity of react components
Fixing react test

spring-boot-modules/spring-boot-react/frontend/src/App.test.js

@@ -3,6 +3,6 @@ import App from './App';
 
 test('renders learn react link', () => {
   render(<App />);
-  const linkElement = screen.getByText(/learn react/i);
+  const linkElement = screen.getByText(/Clients/i);
   expect(linkElement).toBeInTheDocument();
 });

spring-boot-modules/spring-boot-react/frontend/src/ClientEdit.js

@@ -35,20 +35,20 @@ class ClientEdit extends Component {
         this.setState({item});
     }
 
-    async handleSubmit(event) {
+async handleSubmit(event) {
-        event.preventDefault();
+    event.preventDefault();
-        const {item} = this.state;
+    const {item} = this.state;
 
-        await fetch('/clients' + (item.id ? '/' + item.id : ''), {
+    await fetch('/clients' + (item.id ? '/' + item.id : ''), {
-            method: (item.id) ? 'PUT' : 'POST',
+        method: (item.id) ? 'PUT' : 'POST',
-            headers: {
+        headers: {
-                'Accept': 'application/json',
+            'Accept': 'application/json',
-                'Content-Type': 'application/json'
+            'Content-Type': 'application/json'
-            },
+        },
-            body: JSON.stringify(item),
+        body: JSON.stringify(item),
-        });
+    });
-        this.props.history.push('/clients');
+    this.props.history.push('/clients');
-    }
+}
 
     render() {
         const {item} = this.state;

spring-boot-modules/spring-boot-react/frontend/src/ClientList.js

@@ -7,16 +7,14 @@ class ClientList extends Component {
 
     constructor(props) {
         super(props);
-        this.state = {clients: [], isLoading: true};
+        this.state = {clients: []};
         this.remove = this.remove.bind(this);
     }
 
     componentDidMount() {
-        this.setState({isLoading: true});
-
         fetch('/clients')
             .then(response => response.json())
-            .then(data => this.setState({clients: data, isLoading: false}));
+            .then(data => this.setState({clients: data}));
     }
 
     async remove(id) {
@@ -33,11 +31,7 @@ class ClientList extends Component {
     }
 
     render() {
-        const {clients, isLoading} = this.state;
+        const {clients} = this.state;
-
-        if (isLoading) {
-            return <p>Loading...</p>;
-        }
 
         const clientList = clients.map(client => {
             return <tr key={client.id}>

spring-boot-modules/spring-boot-react/pom.xml

@@ -25,16 +25,19 @@
         <dependency>
             <groupId>org.springframework.boot</groupId>
             <artifactId>spring-boot-starter-web</artifactId>
+            <version>2.4.3</version>
         </dependency>
 
         <dependency>
             <groupId>org.springframework.boot</groupId>
             <artifactId>spring-boot-starter-data-jpa</artifactId>
+            <version>2.4.3</version>
         </dependency>
 
         <dependency>
             <groupId>com.h2database</groupId>
             <artifactId>h2</artifactId>
+            <version>1.4.200</version>
             <scope>runtime</scope>
         </dependency>
 
@@ -47,6 +50,7 @@
         <dependency>
             <groupId>org.springframework.boot</groupId>
             <artifactId>spring-boot-starter-test</artifactId>
+            <version>2.4.3</version>
             <scope>test</scope>
         </dependency>
     </dependencies>
@@ -55,6 +59,7 @@
         <plugins>
             <plugin>
                 <artifactId>maven-resources-plugin</artifactId>
+                <version>3.1.0</version>
                 <executions>
                     <execution>
                         <id>copy-resources</id>