From 013886a2ffb78667895dccb88e45766730bce894 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Jan=20Z=C3=ADpek?= <jan@zipek.cz>
Date: Sun, 31 Mar 2024 09:59:05 +0200
Subject: [PATCH] Alerts page icons

---
 .../alerts/components/AlertsTable/AlertsTable.tsx | 15 ++++++++++++---
 .../ContactPointsTable/ContactPointsTable.tsx     |  5 ++++-
 2 files changed, 16 insertions(+), 4 deletions(-)

diff --git a/client/src/pages/alerts/components/AlertsTable/AlertsTable.tsx b/client/src/pages/alerts/components/AlertsTable/AlertsTable.tsx
index d37f4f5..f12b78a 100644
--- a/client/src/pages/alerts/components/AlertsTable/AlertsTable.tsx
+++ b/client/src/pages/alerts/components/AlertsTable/AlertsTable.tsx
@@ -4,6 +4,7 @@ import { DataTable } from '@/components/DataTable'
 import { useState } from 'preact/hooks'
 import { useMutation, useQuery } from 'react-query'
 import { AlertFormModal } from './components/AlertFormModal'
+import { EditIcon, PlusIcon, RefreshIcon } from '@/icons'
 
 export const AlertsTable = () => {
 	const alerts = useQuery('/alerts', () => getAlerts())
@@ -23,8 +24,14 @@ export const AlertsTable = () => {
 		<div className="alerts">
 			<div className="section-title">
 				<h2>Alerts</h2>
-				<button onClick={() => alerts.refetch()}>Refresh</button>
-				<button onClick={() => setShowNew(true)}>Add alert</button>
+				<div>
+					<button onClick={() => alerts.refetch()}>
+						<RefreshIcon /> Refresh
+					</button>{' '}
+					<button onClick={() => setShowNew(true)}>
+						<PlusIcon /> Add alert
+					</button>
+				</div>
 			</div>
 
 			<div className="box-shadow">
@@ -45,7 +52,9 @@ export const AlertsTable = () => {
 							className: 'actions',
 							render: (c) => (
 								<div>
-									<button onClick={() => setEdited(c)}>Edit</button>
+									<button onClick={() => setEdited(c)}>
+										<EditIcon /> Edit
+									</button>{' '}
 									<button onClick={() => setShowDelete(c)}>Delete</button>
 								</div>
 							),
diff --git a/client/src/pages/alerts/components/ContactPointsTable/ContactPointsTable.tsx b/client/src/pages/alerts/components/ContactPointsTable/ContactPointsTable.tsx
index d27b99e..441b98f 100644
--- a/client/src/pages/alerts/components/ContactPointsTable/ContactPointsTable.tsx
+++ b/client/src/pages/alerts/components/ContactPointsTable/ContactPointsTable.tsx
@@ -8,6 +8,7 @@ import { useMutation, useQuery } from 'react-query'
 import { ContactPointFormModal } from './components/ContactPointFormModal'
 import { DataTable } from '@/components/DataTable'
 import { ConfirmModal } from '@/components/ConfirmModal'
+import { PlusIcon } from '@/icons'
 
 export const ContactPointsTable = () => {
 	const contactPoints = useQuery('/contact-points', () => getContactPoints())
@@ -27,7 +28,9 @@ export const ContactPointsTable = () => {
 		<div className="contact-points">
 			<div className="section-title">
 				<h2>Contact Points</h2>
-				<button onClick={() => setShowNew(true)}>Add contact point</button>
+				<button onClick={() => setShowNew(true)}>
+					<PlusIcon /> Add contact point
+				</button>
 			</div>
 
 			<div className="box-shadow">