Fixes #7: update server.py and index.html to display board + tests

server.py

@@ -23,7 +23,7 @@ def loadCompetitions():
 
 @app.route('/')
 def index():
-    return render_template('index.html')
+    return render_template('index.html', clubs=clubs)
 
 @app.route('/showSummary',methods=['POST'])
 def showSummary():

templates/index.html

@@ -21,5 +21,22 @@ <h1>Welcome to the GUDLFT Registration Portal!</h1>
         <input type="email" name="email" id=""/>
         <button type="submit">Enter</button>
     </form>
+    <h2>Clubs Points Summary</h2>
+<table style="border-collapse: collapse; width: 30%; background-color: #f5f5f5; color: #333;">
+    <thead>
+        <tr style="background-color: #e0e0e0;">
+            <th style="border: 1px solid #ccc; padding: 6px;">Club</th>
+            <th style="border: 1px solid #ccc; padding: 6px;">Points</th>
+        </tr>
+    </thead>
+    <tbody>
+        {% for club in clubs %}
+        <tr style="text-align: center;">
+            <td style="border: 1px solid #ccc; padding: 6px;">{{ club['name'] }}</td>
+            <td style="border: 1px solid #ccc; padding: 6px;">{{ club['points'] }}</td>
+        </tr>
+        {% endfor %}
+    </tbody>
+</table>
 </body>
 </html>

tests/unit/test_board_with_clubs_and_their_points.py

@@ -0,0 +1,21 @@
+import server
+
+"""
+Unit test file to check if the index page displays the clubs and their points correctly
+Test 1: The page loads successfully (status code 200)
+Test 2: Each club name and its points appear in the HTML
+"""
+
+def test_index_page_loads(client):
+    response = client.get('/')
+    assert response.status_code == 200
+    assert b"Clubs Points Summary" in response.data
+
+
+def test_index_page_displays_clubs_points(client):
+    response = client.get('/')
+    data = response.data.decode()
+
+    for club in server.clubs:
+        assert club["name"] in data
+        assert club["points"] in data