about page

frontend/src/api/meta.js

@@ -5,6 +5,7 @@ const prefix = baseURL + "debug";
 
 const debugURLs = {
   version: `${prefix}/version`,
+  debug: `${prefix}`,
   lastRecipe: `${prefix}/last-recipe-json`,
   demo: `${prefix}/is-demo`,
 };
@@ -14,6 +15,12 @@ export const metaAPI = {
     let response = await apiReq.get(debugURLs.version);
     return response.data;
   },
+
+  async getDebugInfo() {
+    const response = await apiReq.get(debugURLs.debug);
+    return response.data;
+  },
+
   async getLastJson() {
     let response = await apiReq.get(debugURLs.lastRecipe);
     return response.data;

frontend/src/components/Admin/AdminSidebar.vue

@@ -74,7 +74,7 @@
       </v-list>
 
       <v-list nav dense class="fixedBottom">
-        <v-list-item href="">
+        <v-list-item to="/admin/about">
           <v-list-item-icon class="mr-3 pt-1">
             <v-icon :color="newVersionAvailable ? 'red--text' : ''">
               mdi-information
@@ -87,6 +87,7 @@
             </v-list-item-title>
             <v-list-item-subtitle>
               <a
+                @click.prevent
                 href="https://github.com/hay-kot/mealie/releases/latest"
                 target="_blank"
                 :class="newVersionAvailable ? 'red--text' : 'green--text'"

frontend/src/pages/Admin/About/index.vue

@@ -0,0 +1,91 @@
+<template>
+  <div>
+    <v-card class="mt-3">
+      <v-card-title class="headline">
+        About Mealie
+      </v-card-title>
+      <v-divider></v-divider>
+      <v-card-text>
+        <v-list-item-group color="primary">
+          <v-list-item v-for="property in prettyInfo" :key="property.name">
+            <v-list-item-icon>
+              <v-icon> {{ property.icon || "mdi-account" }} </v-icon>
+            </v-list-item-icon>
+            <v-list-item-content>
+              <v-list-item-title class="pl-4 flex row justify-space-between">
+                <div>{{ property.name }}</div>
+                <div>{{ property.value }}</div>
+              </v-list-item-title>
+            </v-list-item-content>
+          </v-list-item>
+        </v-list-item-group>
+      </v-card-text>
+      <v-divider></v-divider>
+    </v-card>
+  </div>
+</template>
+
+<script>
+import { api } from "@/api";
+export default {
+  data() {
+    return {
+      prettyInfo: [],
+    };
+  },
+  async mounted() {
+    await this.getInfo();
+  },
+  methods: {
+    async getInfo() {
+      const debugInfo = await api.meta.getDebugInfo();
+
+      this.prettyInfo = [
+        {
+          name: "Version",
+          icon: "mdi-information",
+          value: debugInfo.version,
+        },
+        {
+          name: "Application Mode",
+          icon: "mdi-dev-to",
+          value: debugInfo.production ? "Production" : "Development",
+        },
+        {
+          name: "Demo Status",
+          icon: "mdi-test-tube",
+          value: debugInfo.demoStatus ? "Demo" : "Not Demo",
+        },
+        {
+          name: "API Port",
+          icon: "mdi-api",
+          value: debugInfo.apiPort,
+        },
+        {
+          name: "API Docs",
+          icon: "mdi-file-document",
+          value: debugInfo.apiDocs ? "Enabled" : "Disabled",
+        },
+        {
+          name: "Database Type",
+          icon: "mdi-database",
+          value: debugInfo.dbType,
+        },
+        {
+          name: "SQLite File",
+          icon: "mdi-file-cabinet",
+          value: debugInfo.sqliteFile,
+        },
+        {
+          name: "Default Group",
+          icon: "mdi-account-group",
+          value: debugInfo.defaultGroup,
+        },
+      ];
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+</style>

frontend/src/routes/admin.js

@@ -6,6 +6,7 @@ import Migration from "@/pages/Admin/Migration";
 import Profile from "@/pages/Admin/Profile";
 import ManageUsers from "@/pages/Admin/ManageUsers";
 import Settings from "@/pages/Admin/Settings";
+import About from "@/pages/Admin/About";
 import { store } from "../store";
 
 export default {
@@ -50,5 +51,9 @@ export default {
       path: "settings",
       component: Settings,
     },
+    {
+      path: "about",
+      component: About,
+    },
   ],
 };

mealie/routes/debug_routes.py

@@ -8,11 +8,12 @@ from mealie.schema.debug import AppInfo, DebugInfo
 router = APIRouter(prefix="/api/debug", tags=["Debug"])
 
 
-@router.get("/")
+@router.get("")
 async def get_debug_info(current_user=Depends(get_current_user)):
     """ Returns general information about the application for debugging """
 
     return DebugInfo(
+        production=settings.PRODUCTION,
         version=APP_VERSION,
         demo_status=settings.IS_DEMO,
         api_port=settings.API_PORT,
@@ -26,7 +27,11 @@ async def get_debug_info(current_user=Depends(get_current_user)):
 @router.get("/version")
 async def get_mealie_version():
     """ Returns the current version of mealie"""
-    return AppInfo(version=APP_VERSION, demo_status=settings.IS_DEMO)
+    return AppInfo(
+        version=APP_VERSION,
+        demo_status=settings.IS_DEMO,
+        production=settings.PRODUCTION,
+    )
 
 
 @router.get("/last-recipe-json")

mealie/schema/debug.py

@@ -3,6 +3,7 @@ from fastapi_camelcase import CamelModel
 
 
 class AppInfo(CamelModel):
+    production: bool
     version: str
     demo_status: bool