Skip to content

Commit

Permalink
upload blog functionality (#348)
Browse files Browse the repository at this point in the history
* fixed alignment issue

* created blog functionality

* fixes
  • Loading branch information
ShivanshPlays authored Oct 27, 2024
1 parent 41df7c9 commit 66aaa88
Show file tree
Hide file tree
Showing 9 changed files with 378 additions and 74 deletions.
66 changes: 66 additions & 0 deletions context/blogContext.jsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,66 @@
import React, { createContext, useContext, useEffect, useState } from "react";

// Create the context with undefined as initial value
const BlogContext = createContext(undefined);

// BlogProvider to wrap components where Blog state is required
export const BlogProvider = ({ children }) => {
const [blogItems, setBlogItems] = useState([]);

// Function to handle uploading a new blog
useEffect(() => {
if (!localStorage.getItem("blogs") === undefined) {
const storedBlogs = localStorage.getItem("blogs");
if (storedBlogs) {
setBlogItems(JSON.parse(storedBlogs));
}
}
}, []);

const handleUpload = (title, author, content, image) => {
// Create a new blog item object
const newBlogItem = {
// id: Date.now(), // You can replace this with a better ID system
title,
author,
content,
image,
date: new Date().toLocaleDateString("en-US", {
weekday: "long",
year: "numeric",
month: "long",
day: "numeric",
}),
};

// Update the state with the new blog item
setBlogItems((prevItems) => [
...prevItems,
newBlogItem,
]);

console.log(blogItems)
localStorage.setItem("blogs", JSON.stringify(blogItems));
};

// Function to remove an item from the Blog by its ID
const handleRemove = (id) => {
setBlogItems((prevItems) => prevItems.filter((item) => item.id !== id));
localStorage.setItem("blogs", JSON.stringify(updatedBlogs));
};

return (
<BlogContext.Provider value={{ blogItems, handleUpload, handleRemove }}>
{children}
</BlogContext.Provider>
);
};

// Custom hook to use the BlogContext in any component
export const useBlog = () => {
const context = useContext(BlogContext);
if (!context) {
throw new Error("useBlog must be used within a BlogProvider");
}
return context;
};
6 changes: 6 additions & 0 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -34,11 +34,13 @@
"gsap": "^3.12.5",
"lodash": "^4.17.21",
"lucide-react": "^0.453.0",
"nodemailer": "^6.9.15",
"react": "^18.2.0",
"react-chartjs-2": "^5.2.0",
"react-countup": "^6.5.3",
"react-dom": "^18.2.0",
"react-hook-form": "^7.53.0",
"react-hot-toast": "^2.4.1",
"react-icons": "^5.2.1",
"react-responsive": "^10.0.0",
"react-router-dom": "^6.24.1",
Expand All @@ -48,16 +50,20 @@
"react-visibility-sensor": "^5.1.1",
"slick-carousel": "^1.8.1",
"styled-components": "^4.0.0",
"tailwind": "^4.0.0",
"zod": "^3.23.8"
},
"devDependencies": {
"@types/react": "^18.2.66",
"@types/react-dom": "^18.2.22",
"@vitejs/plugin-react-swc": "^3.5.0",
"autoprefixer": "^10.4.20",
"eslint": "^8.57.0",
"eslint-plugin-react": "^7.34.1",
"eslint-plugin-react-hooks": "^4.6.0",
"eslint-plugin-react-refresh": "^0.4.6",
"postcss": "^8.4.47",
"tailwindcss": "^3.4.14",
"vite": "^5.2.0"
}
}
6 changes: 6 additions & 0 deletions postcss.config.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,6 @@
export default {
plugins: {
tailwindcss: {},
autoprefixer: {},
},
}
119 changes: 64 additions & 55 deletions src/App.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -27,8 +27,11 @@ const Services = lazy(() => import("./views/Services.jsx"));
// import FItFlexChatBot from "./components/FItFlexChatBot.jsx";
import ProgressBar from "./components/ProgressBar.jsx";
import DietRecommendation from "./components/DietRecommendation.jsx";
import AOS from 'aos';
import 'aos/dist/aos.css';
import AOS from "aos";
import "aos/dist/aos.css";
import UploadBlog from "./views/uploadBlog.jsx";
import { BlogProvider } from "../context/blogContext.jsx";
// import BlogProvider from "../context/blogContext.jsx";

function App() {
const [mode, setMode] = useState("light");
Expand All @@ -52,63 +55,69 @@ function App() {
AOS.init({
offset: 80,
});
}, [])
}, []);

return (
<>
<Suspense fallback={<Loader />}>
<BrowserRouter>
<ProgressBar />
<Navbar mode={mode} toggleMode={toggleMode} />
<Routes>
<Route
path="/"
element={<Home mode={mode} textcolor={textcolor} />}
/>
<Route
path="/home"
element={<Home mode={mode} textcolor={textcolor} />}
/>
<Route path="/contact" element={<Contact mode={mode} />} />
<Route
path="/about"
element={<About mode={mode} textcolor={textcolor} />}
/>
<Route
path="/plans"
element={<Plans mode={mode} textcolor={textcolor} />}
/>
<Route
path="/plans/:plansId"
element={<Plans mode={mode} textcolor={textcolor} />}
/>
<Route
path="/workout/:workoutId"
element={<Workout mode={mode} textcolor={textcolor} />}
/>
<Route path="/progress" element={<Profile />} />
<Route path="/profile" element={<Profile />} />
<Route path="/login" element={<Login />} />
<Route path="/register" element={<Register />} />
<Route path="/*" element={<NotFound />} />
<Route path="/healthtips" element={<HealthTips />} />
<Route
path="/blog"
element={<Blog mode={mode} textcolor={textcolor} />}
/>
<Route
path="/services"
element={<Services mode={mode} textcolor={textcolor} />}
/>
<Route path="/privacy-policy" element={<PrivacyPolicy />} />
<Route path="/dietrecommendation" element={<DietRecommendation />} />
<Route path="/terms-of-use" element={<TermsOfUse />} />
</Routes>
<Footer />
<BackToTopButton />

{/* <FItFlexChatBot/> */}
</BrowserRouter>
<BlogProvider>
<BrowserRouter>
<ProgressBar />
<Navbar mode={mode} toggleMode={toggleMode} />
<Routes>
<Route
path="/"
element={<Home mode={mode} textcolor={textcolor} />}
/>
<Route
path="/home"
element={<Home mode={mode} textcolor={textcolor} />}
/>
<Route path="/contact" element={<Contact mode={mode} />} />
<Route
path="/about"
element={<About mode={mode} textcolor={textcolor} />}
/>
<Route
path="/plans"
element={<Plans mode={mode} textcolor={textcolor} />}
/>
<Route
path="/plans/:plansId"
element={<Plans mode={mode} textcolor={textcolor} />}
/>
<Route
path="/workout/:workoutId"
element={<Workout mode={mode} textcolor={textcolor} />}
/>
<Route path="/progress" element={<Profile />} />
<Route path="/profile" element={<Profile />} />
<Route path="/login" element={<Login />} />
<Route path="/register" element={<Register />} />
<Route path="/*" element={<NotFound />} />
<Route path="/healthtips" element={<HealthTips />} />
<Route
path="/blog"
element={<Blog mode={mode} textcolor={textcolor} />}
/>
<Route
path="/services"
element={<Services mode={mode} textcolor={textcolor} />}
/>
<Route path="/privacy-policy" element={<PrivacyPolicy />} />
<Route
path="/dietrecommendation"
element={<DietRecommendation />}
/>
<Route path="/terms-of-use" element={<TermsOfUse />} />
<Route path="/uploadBlog" element={<UploadBlog />} />
</Routes>
<Footer />
<BackToTopButton />

{/* <FItFlexChatBot/> */}
</BrowserRouter>
</BlogProvider>
</Suspense>
</>
);
Expand Down
4 changes: 3 additions & 1 deletion src/fonts/index.css
Original file line number Diff line number Diff line change
Expand Up @@ -12,4 +12,6 @@
/* src: url('./EdgeOfTheGalaxyItalic-ZVJB3.off') format('opentype'), */
/* url('./EdgeOfTheGalaxyPoster-3zRAp.otf') format('opentype'), */
/* url('./EdgeOfTheGalaxyPosterItalic-x3o1m.otf') format('opentype'), */
}
}


14 changes: 13 additions & 1 deletion src/index.css
Original file line number Diff line number Diff line change
@@ -1,8 +1,20 @@
@tailwind base;
@tailwind components;
@tailwind utilities;


*{
margin: 0;
padding: 0;
}

body {
overflow-x: hidden;
}
}

@font-face {
font-family: 'Future2';
src: url('/fonts/Future2.ttf') format('truetype'); /* Adjust path if needed */
font-weight: normal;
font-style: normal;
}
Loading

0 comments on commit 66aaa88

Please sign in to comment.