Merge pull request #18 from YogPanjarale/main

Made basic Blog
:thisisfine:

Author: YogPanjarale

frontend/package.json

@@ -9,6 +9,7 @@
   },
   "dependencies": {
     "@heroicons/react": "^1.0.1",
+    "firebase-admin": "^9.11.0",
     "graphql-code-generator": "^0.18.2",
     "next": "11.0.1",
     "react": "17.0.2",

frontend/pages/api/blog/[slug].ts

@@ -0,0 +1,34 @@
+import type { NextApiRequest, NextApiResponse } from 'next'
+import admin from '../../../src/firebase/admin';
+import { Content } from '../../blog/[slug]';
+type Data = {
+  slug: string,
+  content?: any,
+  error?: string
+}
+
+const api = async (req: NextApiRequest, res: NextApiResponse<Data>) => {
+  const firestore = admin.firestore();
+  const slug = req.query.slug as string;
+  try {
+
+    const blog = await getBlog(slug)
+    res.status(200).json({ slug: slug, content: blog })
+  } catch (error) {
+    res.status(404).json(
+      { error: error.message == "Cannot read property 'data' of undefined" ? "blog not found" : error.message, slug: slug });
+  }
+}
+export default api;
+export const getBlog = async (slug:string):Promise<Content> =>{
+  const firestore = admin.firestore();
+  const doc = await firestore.collection('blogs').where("slug", "==", slug).get();
+    const blog = doc.docs[0].data();
+    if (blog.user) {
+      blog.user = (await firestore.collection('users').doc(blog.user).get()).data();
+    }
+    if (blog.time) {
+      blog.time = new Date(blog.time._seconds * 1000).toString();
+    }
+  return blog as Content;
+}

frontend/pages/blog/[slug].tsx

@@ -0,0 +1,75 @@
+import { getBlog } from "../api/blog/[slug]";
+
+export interface Root {
+	slug: string;
+	content: Content;
+}
+
+export interface Content {
+	time: string;
+	content: string;
+	slug: string;
+	user: User;
+	title:string
+}
+
+export interface User {
+	profile: string;
+	name: string;
+}
+
+const Blog = ({ content, found }: { content?: Content; found: boolean }) => {
+	console.log(content);
+	if (found) {
+		return (
+			<figure className="md:flex flex-col bg-gray-100 rounded-xl p-8">
+				<div className="pt-6 text-left space-y-4">
+					<h1 className="text-2xl font-semibold text-gray-800 ">{content.title}</h1>
+					<blockquote>
+						<p className="text-lg font-normal">
+							“{content.content}”
+						</p>
+					</blockquote>
+
+					<figcaption className="font-medium flex flex-row justify-start">
+						<img
+							className="w-12 h-12 rounded-full mx-1"
+							src={content.user.profile}
+							alt={content.user.name}
+							width="64"
+							height="96"
+						/>
+						<div>
+							<div className="text-cyan-600">
+								{content.user.name}
+							</div>
+							<div className="text-gray-500">
+								{new Date(content.time).toDateString()}
+							</div>
+						</div>
+					</figcaption>
+				</div>
+			</figure>
+		);
+	}
+	return (
+		<div className="flex justify-center align-middle">
+			Aritcle Not Found
+		</div>
+	);
+};
+export async function getServerSideProps(context) {
+	const slug = context.params.slug;
+	try {
+		const blog = await getBlog(slug);
+		return {
+			props: {
+				found: true,
+				content: blog,
+			}, // will be passed to the page component as props
+		};
+	} catch (error) {
+		return { props: { found: false } };
+	}
+}
+export default Blog;

frontend/src/firebase/admin.ts

@@ -0,0 +1,12 @@
+import * as admin from 'firebase-admin';
+  
+var serviceAccount =JSON.parse(process.env.FIREBASE_SERVICE_ACCOUNT as string)
+// console.log(serviceAccount,typeof serviceAccount);
+if (admin.apps.length<=0){
+    admin.initializeApp({
+      credential: admin.credential.cert(serviceAccount),
+      databaseURL: "https://farm-helper-app-mqtt.firebaseio.com/"
+    });
+}
+
+export default admin