diff --git a/frontend/app/components/Dashboard/components/DashboardMetricSelection/DashboardMetricSelection.tsx b/frontend/app/components/Dashboard/components/DashboardMetricSelection/DashboardMetricSelection.tsx
index 1c4518d2a..b86476b03 100644
--- a/frontend/app/components/Dashboard/components/DashboardMetricSelection/DashboardMetricSelection.tsx
+++ b/frontend/app/components/Dashboard/components/DashboardMetricSelection/DashboardMetricSelection.tsx
@@ -11,7 +11,7 @@ function WidgetCategoryItem({ category, isSelected, onClick, selectedWidgetIds }
     });
     return (
         <div
-            className={cn("rounded p-4 border cursor-pointer", { 'bg-active-blue border-color-teal':isSelected, 'bg-white': !isSelected })}
+            className={cn("rounded p-4 border cursor-pointer", { 'bg-active-blue border-blue':isSelected, 'bg-white': !isSelected })}
             onClick={() => onClick(category)}
         >
             <div className="font-medium text-lg mb-2 capitalize">{category.name}</div>
@@ -32,14 +32,14 @@ interface IProps {
 
 function DashboardMetricSelection(props: IProps) {
     const { dashboardStore } = useStore();
-    let widgetCategories: any[] = useObserver(() => dashboardStore.widgetCategories);
+    const widgetCategories: any[] = useObserver(() => dashboardStore.widgetCategories);
     const [activeCategory, setActiveCategory] = React.useState<any>();
     const [selectAllCheck, setSelectAllCheck] = React.useState(false);
     const selectedWidgetIds = useObserver(() => dashboardStore.selectedWidgets.map((widget: any) => widget.metricId));
 
     useEffect(() => {
-        dashboardStore?.fetchTemplates().then(templates => {
-            setActiveCategory(dashboardStore.widgetCategories[0]);
+        dashboardStore?.fetchTemplates(true).then((categories) => {
+            setActiveCategory(categories[0]);
         });
     }, []);
 
@@ -61,7 +61,7 @@ function DashboardMetricSelection(props: IProps) {
         <div>
             <div className="grid grid-cols-12 gap-4 my-3 items-end">
                 <div className="col-span-3">
-                    <div className="uppercase color-gray-medium text-lg">Categories</div>
+                    <div className="uppercase color-gray-medium text-lg">Type</div>
                 </div>
 
                 <div className="col-span-9 flex items-center">
@@ -117,7 +117,7 @@ function DashboardMetricSelection(props: IProps) {
                                     cn(
                                         "relative rounded border col-span-1 cursor-pointer",
                                         "flex flex-col items-center justify-center bg-white",
-                                        "hover:bg-active-blue hover:shadow-border-main text-center h-full py-12",
+                                        "hover:bg-active-blue hover:shadow-border-main text-center py-16",
                                     )
                                 }
                                 onClick={props.handleCreateNew}
diff --git a/frontend/app/components/Dashboard/components/DashboardModal/DashboardModal.tsx b/frontend/app/components/Dashboard/components/DashboardModal/DashboardModal.tsx
index b2f656475..c1788d344 100644
--- a/frontend/app/components/Dashboard/components/DashboardModal/DashboardModal.tsx
+++ b/frontend/app/components/Dashboard/components/DashboardModal/DashboardModal.tsx
@@ -54,7 +54,7 @@ function DashboardModal(props) {
                         </h1>
                     </div>
                     <div>
-                        <span className="text-xl">Past 7 days data</span>
+                        <span className="text-md">Past 7 days data</span>
                     </div>
                 </div>
                 { !isDashboardExists && (
diff --git a/frontend/app/components/Dashboard/components/DashboardView/DashboardView.tsx b/frontend/app/components/Dashboard/components/DashboardView/DashboardView.tsx
index 46ffee36c..039083c3a 100644
--- a/frontend/app/components/Dashboard/components/DashboardView/DashboardView.tsx
+++ b/frontend/app/components/Dashboard/components/DashboardView/DashboardView.tsx
@@ -54,7 +54,7 @@ function DashboardView(props: RouteComponentProps<Props>) {
 
     useEffect(() => {
         if (!dashboardId) dashboardStore.selectDefaultDashboard();
-        console.log(dashboardId)
+
         if (queryParams.has('modal')) {
             onAddWidgets();
             trimQuery();
diff --git a/frontend/app/components/Dashboard/components/WidgetForm/WidgetForm.tsx b/frontend/app/components/Dashboard/components/WidgetForm/WidgetForm.tsx
index a66126577..977745777 100644
--- a/frontend/app/components/Dashboard/components/WidgetForm/WidgetForm.tsx
+++ b/frontend/app/components/Dashboard/components/WidgetForm/WidgetForm.tsx
@@ -63,9 +63,9 @@ function WidgetForm(props: Props) {
         metricStore.save(metric, dashboardId).then((metric) => {
             if (wasCreating) {
                 if (parseInt(dashboardId) > 0) {
-                    history.push(withSiteId(dashboardMetricDetails(parseInt(dashboardId), metric.metricId), siteId));
+                    history.replace(withSiteId(dashboardMetricDetails(parseInt(dashboardId), metric.metricId), siteId));
                 } else {
-                    history.push(withSiteId(metricDetails(metric.metricId), siteId));
+                    history.replace(withSiteId(metricDetails(metric.metricId), siteId));
                 }
 
             }
diff --git a/frontend/app/components/shared/SessionSettings/SessionSettings.tsx b/frontend/app/components/shared/SessionSettings/SessionSettings.tsx
index c35086f6a..e70604896 100644
--- a/frontend/app/components/shared/SessionSettings/SessionSettings.tsx
+++ b/frontend/app/components/shared/SessionSettings/SessionSettings.tsx
@@ -7,7 +7,7 @@ import DefaultPlaying from './components/DefaultPlaying';
 import DefaultTimezone from './components/DefaultTimezone';
 import CaptureRate from './components/CaptureRate';
 
-function SessionSettings(props) {
+function SessionSettings() {
     return useObserver(() => (
         <div className="bg-white box-shadow h-screen" style={{ width: '450px'}}>
             <div className="px-6 pt-6">
diff --git a/frontend/app/mstore/dashboardStore.ts b/frontend/app/mstore/dashboardStore.ts
index fb76af79b..18a49a996 100644
--- a/frontend/app/mstore/dashboardStore.ts
+++ b/frontend/app/mstore/dashboardStore.ts
@@ -60,7 +60,7 @@ export interface IDashboardSotre {
     selectDefaultDashboard(): Promise<IDashboard>
 
     saveMetric(metric: IWidget, dashboardId?: string): Promise<any>
-    fetchTemplates(): Promise<any>
+    fetchTemplates(hardRefresh: boolean): Promise<any>
     deleteDashboardWidget(dashboardId: string, widgetId: string): Promise<any>
     addWidgetToDashboard(dashboard: IDashboard, metricIds: any): Promise<any>
 
@@ -354,9 +354,9 @@ export default class DashboardStore implements IDashboardSotre {
         })
     }
 
-    fetchTemplates(): Promise<any> {
+    fetchTemplates(hardRefresh): Promise<any> {
         return new Promise((resolve, reject) => {
-            if (this.widgetCategories.length > 0) {
+            if (this.widgetCategories.length > 0 && !hardRefresh) {
                 resolve(this.widgetCategories)
             } else {
                 metricService.getTemplates().then(response => {
diff --git a/frontend/tailwind.config.js b/frontend/tailwind.config.js
index 6faa9f8ed..04fbd65df 100644
--- a/frontend/tailwind.config.js
+++ b/frontend/tailwind.config.js
@@ -107,6 +107,7 @@ module.exports = {
 		borderColor: {
 			default: '#DDDDDD',
 			"gray-light-shade": colors["gray-light-shade"],
+			"blue": colors["active-blue-border"],
 		},
     extend: {
 		boxShadow: {