feat(notifications): Implement functional header notification dropdown

This commit replaces the static notification dropdown in the header with a fully functional component that fetches live data from the API.

Key features include:
- Fetches and displays the latest notifications.
- Shows a badge with the count of unseen notifications.
- Opens a modal with notification details upon clicking an item.
- Marks notifications as seen when they are viewed.

Additionally, this commit includes several related improvements:
- refactor: Replaced the global loading component with a custom Tailwind CSS spinner for a consistent look and feel.
- feat: Enhanced the DatePicker component to optionally include a time picker.
- style: Improved the layout of the notification details page by moving the message to a dedicated section and capitalizing the 'priority' and 'type' fields for better readability.

src/utils/shared.ts

@@ -72,3 +72,13 @@ export const getEnumAsArray = <T extends object>(target: T): ILabelValue[] => {
     value,
   }));
 };
+export const truncateString = (
+  str: string,
+  startLength: number = 10,
+  endLength: number = 10,
+): string => {
+  if (str.length <= startLength + endLength) {
+    return str;
+  }
+  return str.slice(0, startLength) + "..." + str.slice(-endLength);
+};