Update app.py

app.py

@@ -5,15 +5,46 @@ import streamlit.components.v1 as components
 # Load the dataset
 dataset = load_dataset("awacke1/DatasetOfDatasetsUSA")
 
-# Assuming the dataset has a column 'url' that contains the link to the datasets
-# and a column 'title' for the text to display
-links_html = "<ul>"
-for item in dataset['train']:  # Replace 'train' with the correct split if necessary
-    cityOrState=item['cityOrState']
-    link=item['link']
-    linkType=item['linkType']
-    links_html += f"<li><a href='{link}' target='_blank'>{cityOrState} - {linkType}</a></li>"
-links_html += "</ul>"
+# Initialize session state for record navigation
+if 'index' not in st.session_state:
+    st.session_state.index = 0
+
+# Define the maximum index as the length of the dataset - 1
+max_index = len(dataset['train']) - 1
+
+# Navigation buttons
+col1, col2, col3, col4, col5 = st.columns(5)
+with col1:
+    if st.button('⏮️'):
+        st.session_state.index = 0
+with col2:
+    if st.button('◀️') and st.session_state.index > 0:
+        st.session_state.index -= 1
+with col3:
+    st.write(f"Record {st.session_state.index + 1} of {max_index + 1}")
+with col4:
+    if st.button('▶️') and st.session_state.index < max_index:
+        st.session_state.index += 1
+with col5:
+    if st.button('⏭️'):
+        st.session_state.index = max_index
+
+# Assuming the dataset has the columns 'cityOrState', 'link', and 'linkType'
+item = dataset['train'][st.session_state.index]
+cityOrState = item['cityOrState']
+link = item['link']
+linkType = item['linkType']
+
+# Build the HTML for the current record
+links_html = f"""
+<ul style="list-style: none; padding: 0;">
+    <li style="margin: 10px 0; padding: 10px; background-color: #f0f0f0; border-radius: 8px; box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);">
+        <a href="{link}" target="_blank" style="text-decoration: none; color: #333;">
+            <strong>{cityOrState}</strong> - {linkType} 🔗
+        </a>
+    </li>
+</ul>
+"""
 
 # Use Streamlit components to render the HTML
-components.html(links_html)
+components.html(links_html, height=100)