feat: create a error fallback page with icon

Author: bhavabhuthi

components/error/error.tsx

@@ -0,0 +1,12 @@
+import { Icon } from 'opub-ui';
+
+import { Icons } from '../icons';
+
+export function ErrorPage() {
+  return (
+    <div className="text font-Medium flex h-[680px] w-full flex-col items-center justify-center gap-4 text-600">
+      <Icon source={Icons.errorPage} size={100} />
+      Error fetching information. Please try again later.
+    </div>
+  );
+}

components/error/index.ts

@@ -0,0 +1 @@
+export { ErrorPage } from './error';

components/icons.tsx

@@ -13,6 +13,7 @@ import {
   IconDatabase,
   IconDatabaseCog,
   IconDatabaseEdit,
+  IconDatabaseOff,
   IconDatabasePlus,
   IconDownload,
   IconFilePlus,
@@ -41,41 +42,42 @@ import {
 export const Icons: {
   [key: string]: React.FC<any>;
 } = {
-  back: IconArrowLeft,
-  logo: IconFolder,
-  datasetSettings: IconDatabaseCog,
-  datasetEdit: IconDatabaseEdit,
-  userList: IconUsers,
-  dataset: IconDatabase,
+  access: IconShieldCheck,
   addDataset: IconDatabasePlus,
-  userSettings: IconUserCog,
+  alert: IconAlertCircleFilled,
   arrowRight: IconArrowRight,
-  search: IconSearch,
-  notification: IconBellFilled,
-  info: IconInfoCircle,
-  construction: IconBarrierBlock,
-  link: IconLink,
+  back: IconArrowLeft,
+  check: IconCircleCheckFilled,
   collapse: IconLayoutSidebarLeftCollapse,
-  expand: IconLayoutSidebarLeftExpand,
+  construction: IconBarrierBlock,
+  cross: IconX,
+  dataset: IconDatabase,
+  datasetEdit: IconDatabaseEdit,
+  datasetSettings: IconDatabaseCog,
+  delete: IconTrash,
   distribution: IconFilePlus,
+  download: IconDownload,
   dropzone: IconCloudUpload,
-  check: IconCircleCheckFilled,
-  delete: IconTrash,
-  terminal: IconTerminal,
-  cross: IconX,
+  errorPage: IconDatabaseOff,
+  expand: IconLayoutSidebarLeftExpand,
+  facebook: IconBrandFacebookFilled,
+  fileUpload: IconFileUpload,
+  github: IconBrandGithubFilled,
+  info: IconInfoCircle,
+  link: IconLink,
+  linkedin: IconBrandLinkedin,
+  logo: IconFolder,
   menu: IconMenu2,
-  access: IconShieldCheck,
+  notification: IconBellFilled,
   openAccess: IconShieldCheck,
+  pencil: IconPencil,
+  plus: IconPlus,
   registeredAccess: IconShieldStar,
   restrictedAccess: IconShieldLock,
+  search: IconSearch,
   share: IconShare3,
-  pencil: IconPencil,
-  fileUpload: IconFileUpload,
-  plus: IconPlus,
+  terminal: IconTerminal,
   twitter: IconBrandTwitterFilled,
-  facebook: IconBrandFacebookFilled,
-  linkedin: IconBrandLinkedin,
-  github: IconBrandGithubFilled,
-  download: IconDownload,
-  alert: IconAlertCircleFilled,
+  userList: IconUsers,
+  userSettings: IconUserCog,
 };