From fceb906b642cc8b78d9c1d38ee217d8e7b891dc3 Mon Sep 17 00:00:00 2001
From: Tajim <com.tajim@gmail.com>
Date: Thu, 27 Aug 2026 12:50:05 +0600
Subject: [PATCH 1/4] refactor(home): relocate FAQ to guide with pagination and
 make blog cards compact on mobile

---
 resources/js/components/BlogCard.vue    | 115 ++++++-----
 resources/js/components/FAQSection.vue  | 255 ------------------------
 resources/js/pages/ContributorGuide.vue | 204 ++++++++++++++++++-
 3 files changed, 264 insertions(+), 310 deletions(-)
 delete mode 100644 resources/js/components/FAQSection.vue

diff --git a/resources/js/components/BlogCard.vue b/resources/js/components/BlogCard.vue
index 50e58c0..7f7bd34 100644
--- a/resources/js/components/BlogCard.vue
+++ b/resources/js/components/BlogCard.vue
@@ -28,12 +28,12 @@ const formattedDate = computed(() => {
 
 <template>
     <div
-        class="group flex flex-col overflow-hidden rounded-xl border border-slate-200 bg-white shadow-xs transition-all duration-300 hover:-translate-y-0.5 hover:shadow-md dark:border-gray-700 dark:bg-gray-900 dark:hover:shadow-gray-900/50"
+        class="group flex flex-row items-center overflow-hidden rounded-xl border border-slate-200 bg-white p-3 shadow-xs transition-all duration-300 hover:-translate-y-0.5 hover:shadow-md sm:flex-col sm:p-0 dark:border-gray-700 dark:bg-gray-900 dark:hover:shadow-gray-900/50"
     >
         <!-- Featured Image Container -->
         <Link
             :href="'/blogs/' + blog.slug"
-            class="relative block aspect-[16/9] overflow-hidden bg-slate-100 dark:bg-gray-800"
+            class="relative block h-20 w-20 shrink-0 overflow-hidden rounded-lg bg-slate-100 sm:aspect-[16/9] sm:h-auto sm:w-full sm:rounded-none dark:bg-gray-800"
         >
             <img
                 :src="blog.featured_image || 'https://placehold.co/600x400'"
@@ -43,70 +43,81 @@ const formattedDate = computed(() => {
             />
             <div
                 v-if="blog.category"
-                class="absolute top-2.5 left-2.5 rounded-md bg-indigo-600 px-2 py-0.5 text-[10px] font-bold tracking-wider text-white uppercase shadow-xs"
+                class="absolute top-2.5 left-2.5 hidden rounded-md bg-indigo-600 px-2 py-0.5 text-[10px] font-bold tracking-wider text-white uppercase shadow-xs sm:block"
             >
                 {{ blog.category }}
             </div>
         </Link>
 
         <!-- Card Body -->
-        <div class="flex flex-1 flex-col p-4">
-            <!-- News Meta (Author & Date) -->
-            <div
-                class="mb-1.5 flex items-center gap-1.5 text-xs text-slate-500 dark:text-gray-400"
-            >
-                <span class="text-slate-400 dark:text-gray-500">Author</span>
-                <Link
-                    v-if="blog.user?.username"
-                    :href="`/u/${blog.user.username}`"
-                    class="font-medium text-indigo-600 underline transition-colors hover:underline dark:text-indigo-400"
-                >
-                    {{ blog.user?.name }}
-                </Link>
-                <span
-                    v-else
-                    class="font-medium text-slate-700 dark:text-gray-300"
+        <div class="flex min-w-0 flex-1 flex-col justify-between pl-3 sm:p-4">
+            <div>
+                <!-- News Meta (Author & Date & Mobile Category) -->
+                <div
+                    class="mb-1 flex flex-wrap items-center gap-1.5 text-[11px] text-slate-500 sm:mb-1.5 sm:text-xs dark:text-gray-400"
                 >
-                    {{ blog.user?.name }}
-                </span>
+                    <span
+                        v-if="blog.category"
+                        class="rounded bg-indigo-50 px-1.5 py-0.5 text-[9px] font-bold text-indigo-600 sm:hidden dark:bg-indigo-950/60 dark:text-indigo-400"
+                    >
+                        {{ blog.category }}
+                    </span>
 
-                <span
-                    v-if="formattedDate"
-                    class="text-slate-300 dark:text-gray-600"
-                    >•</span
-                >
+                    <span class="text-slate-400 dark:text-gray-500"
+                        >Author</span
+                    >
+                    <Link
+                        v-if="blog.user?.username"
+                        :href="`/u/${blog.user.username}`"
+                        class="font-medium text-indigo-600 underline transition-colors hover:underline dark:text-indigo-400"
+                    >
+                        {{ blog.user?.name }}
+                    </Link>
+                    <span
+                        v-else
+                        class="font-medium text-slate-700 dark:text-gray-300"
+                    >
+                        {{ blog.user?.name }}
+                    </span>
 
-                <time
-                    v-if="formattedDate"
-                    :datetime="blog.created_at"
-                    class="text-slate-400 dark:text-gray-500"
-                >
-                    {{ formattedDate }}
-                </time>
-            </div>
+                    <span
+                        v-if="formattedDate"
+                        class="text-slate-300 dark:text-gray-600"
+                        >•</span
+                    >
 
-            <!-- Title -->
-            <Link :href="'/blogs/' + blog.slug" class="group/title block">
-                <h3
-                    class="line-clamp-2 text-base leading-snug font-bold text-slate-900 transition duration-150 group-hover/title:text-indigo-600 dark:text-gray-100 dark:group-hover/title:text-indigo-400"
-                >
-                    {{ blog.title }}
-                </h3>
-            </Link>
+                    <time
+                        v-if="formattedDate"
+                        :datetime="blog.created_at"
+                        class="text-slate-400 dark:text-gray-500"
+                    >
+                        {{ formattedDate }}
+                    </time>
+                </div>
 
-            <!-- Excerpt -->
-            <p
-                class="mt-1.5 mb-3 line-clamp-2 text-xs leading-relaxed text-slate-600 dark:text-gray-400"
-            >
-                {{ blog.excerpt }}
-            </p>
+                <!-- Title -->
+                <Link :href="'/blogs/' + blog.slug" class="group/title block">
+                    <h3
+                        class="line-clamp-2 text-xs leading-snug font-bold text-slate-900 transition duration-150 group-hover/title:text-indigo-600 sm:text-base dark:text-gray-100 dark:group-hover/title:text-indigo-400"
+                    >
+                        {{ blog.title }}
+                    </h3>
+                </Link>
+
+                <!-- Excerpt (hidden on mobile to save vertical space) -->
+                <p
+                    class="mt-1.5 mb-3 line-clamp-2 hidden text-xs leading-relaxed text-slate-600 sm:block dark:text-gray-400"
+                >
+                    {{ blog.excerpt }}
+                </p>
+            </div>
 
             <!-- Footer Action & Interaction Stats -->
             <div
-                class="mt-auto flex items-center justify-between border-t border-slate-100 pt-3 dark:border-gray-800"
+                class="mt-1 flex items-center justify-between pt-1 sm:mt-auto sm:border-t sm:border-slate-100 sm:pt-3 dark:sm:border-gray-800"
             >
                 <div
-                    class="flex items-center gap-3 text-xs text-slate-400 dark:text-gray-500"
+                    class="flex items-center gap-3 text-[11px] text-slate-400 sm:text-xs dark:text-gray-500"
                 >
                     <span
                         class="inline-flex items-center gap-1"
@@ -134,9 +145,9 @@ const formattedDate = computed(() => {
 
                 <Link
                     :href="'/blogs/' + blog.slug"
-                    class="inline-flex items-center gap-1 text-xs font-semibold text-indigo-600 transition hover:text-indigo-700 dark:text-indigo-400 dark:hover:text-indigo-300"
+                    class="inline-flex items-center gap-1 text-[11px] font-semibold text-indigo-600 transition hover:text-indigo-700 sm:text-xs dark:text-indigo-400 dark:hover:text-indigo-300"
                 >
-                    <span>বিস্তারিত পড়ুন</span>
+                    <span>Read</span>
                     <ArrowRight
                         class="h-3.5 w-3.5 transform transition-transform duration-200 group-hover:translate-x-1"
                     />
diff --git a/resources/js/components/FAQSection.vue b/resources/js/components/FAQSection.vue
deleted file mode 100644
index 4f637da..0000000
--- a/resources/js/components/FAQSection.vue
+++ /dev/null
@@ -1,255 +0,0 @@
-<script setup lang="ts">
-import { Link } from '@inertiajs/vue3';
-import { ChevronDown, HelpCircle, Plus, Minus } from 'lucide-vue-next';
-import { ref, computed } from 'vue';
-
-// Single active accordion index
-const openIndex = ref(0);
-
-// Two-step expand toggle
-const INITIAL_COUNT = 4;
-const isExpanded = ref(false);
-
-const faqs = [
-    {
-        question: 'HSCStack কী এবং এটি কাদের জন্য?',
-        answer: 'HSCStack হলো বাংলাদেশের HSC ও SSC শিক্ষার্থীদের জন্য তৈরি একটি ওপেন রিসোর্স প্ল্যাটফর্ম। এখানে চ্যাপ্টার ও সাবজেক্ট অনুযায়ী প্রয়োজনীয় ক্লাস নোট, পিডিএফ, ছবি, ভিডিও এবং পরীক্ষার প্রশ্নপত্র একসাথে ফ্রি-তে খুঁজে পাওয়া যায়।',
-        type: 'text',
-    },
-    {
-        question: 'ওয়েবসাইট সম্পর্কিত নতুন আপডেট বা ঘোষণা কোথায় পাওয়া যাবে?',
-        answer: 'প্ল্যাটফর্মের সাম্প্রতিক ফিচার, কনটেন্ট আপডেট এবং গুরুত্বপূর্ণ সকল ঘোষণা পেতে ফলো করুন আমাদের অফিশিয়াল ',
-        linkText: 'Facebook পেজ',
-        linkUrl: 'https://facebook.com/hscstackbd',
-        answerAfter: '।',
-        type: 'externalLink',
-    },
-    {
-        question: 'ওয়েবসাইটটি কীভাবে অর্থায়ন করা হয়?',
-        answer: 'এটি একটি অলাভজনক উদ্যোগ। আমাদের কনট্রিবিউটর এবং শিক্ষার্থীরাই মূলত আমাদের আর্থিক অনুদান দিয়ে থাকেন। আমাদের সাপোর্ট করতে ভিজিট করুন ',
-        linkText: 'আমাদের সাপোর্ট পেজ',
-        linkUrl: '/support',
-        answerAfter: '।',
-        type: 'link',
-    },
-    {
-        question: 'এটি কে বা কারা পরিচালনা করে?',
-        answer: 'এটি কোনো বাণিজ্যিক প্রতিষ্ঠান নয়; দেশজুড়ে ছড়িয়ে থাকা একদল উদ্যমী শিক্ষার্থী স্বেচ্ছাশ্রমে প্ল্যাটফর্মটি পরিচালনা ও কনটেন্ট কিউরেট করে থাকে। আমাদের টিম সম্পর্কে আরও জানতে পড়ুন ',
-        linkText: 'আমাদের কথা',
-        linkUrl: '/about-us',
-        answerAfter: '।',
-        type: 'link',
-    },
-    {
-        question: 'HSCStack কি ওপেন সোর্স?',
-        answer: 'হ্যাঁ! HSCStack সম্পূর্ণ ওপেন সোর্স একটি প্ল্যাটফর্ম। কোডবেসে কাজ করা, বাক ফিক্স করা কিংবা নতুন ফিচার যোগ করার জন্য আমাদের ',
-        linkText: 'GitHub রিপোজিটরি',
-        linkUrl: 'https://github.com/hscstack/platform',
-        answerAfter: ' ভিজিট করতে পারো।',
-        type: 'externalLink',
-    },
-    {
-        question: 'রিসোর্স দেখার জন্য কি কোনো অ্যাকাউন্ট তৈরি করতে হবে?',
-        answer: 'না, রিসোর্স খোঁজা, পড়া বা ডাউনলোড করার জন্য কোনো অ্যাকাউন্ট খোলার প্রয়োজন নেই। যেকোনো শিক্ষার্থী ফ্রিতে সরাসরি রিসোর্সগুলো ব্রাউজ ও ব্যবহার করতে পারবে।',
-        type: 'text',
-    },
-    {
-        question: 'আমি কি আমার তৈরি নোট বা রিসোর্স আপলোড করতে পারব?',
-        answer: 'কনটেন্টের মান এবং নির্ভুলতা নিশ্চিত করতে রিসোর্স আপলোডের সুবিধাটি শুধুমাত্র ভেরিফাইড মেম্বারদের জন্য নির্ধারিত। মেম্বারশিপের আবেদন করতে ',
-        linkText: 'এখানে ক্লিক করুন',
-        linkUrl: '/join',
-        answerAfter: '।',
-        type: 'link',
-    },
-    {
-        question: 'এখানে কী কী ধরনের স্টাডি মেটেরিয়াল পাওয়া যাবে?',
-        answer: 'এখানে অধ্যায়ভিত্তিক হ্যান্ডরিটেন নোটস, লেকচার শিট, সাজেস্টভ প্রশ্ন ব্যাঙ্ক, ডায়াগ্রাম এবং বিভিন্ন প্রয়োজনীয় টিউটোরিয়াল ও প্র্যাক্টিক্যাল গাইড পাওয়া যাবে।',
-        type: 'text',
-    },
-    {
-        question: 'ওয়েবসাইটটি ফোনে অ্যাপ হিসেবে ব্যবহার করা যাবে?',
-        answer: 'হ্যাঁ, প্ল্যাটফর্মটি PWA (Progressive Web App) সাপোর্টেড। ব্রাউজারের "Add to Home Screen" বা ইনস্টল পপআপ থেকে এক ক্লিকেই অ্যাপের মতো ফোনে ইনস্টল করে নেওয়া যায়।',
-        type: 'text',
-    },
-    {
-        question:
-            'ডেভেলপমেন্টে সাহায্য করতে বা কোড কন্ট্রিবিউট করতে চাইলে করণীয় কী?',
-        answer: 'HSCStack-এর ওপেন ডেভেলপমেন্ট টিমে যোগ দিতে আমাদের ',
-        linkText: 'আবেদন ফর্মে',
-        linkUrl: '/join',
-        answerAfter:
-            ' অ্যাপ্লাই করতে পারো। আবেদন গৃহীত হলে কোর ডেভেলপার হিসেবে কোডবেসে কাজ করার সুযোগ মিলবে।',
-        type: 'link',
-    },
-];
-
-const visibleFaqs = computed(() => {
-    return isExpanded.value ? faqs : faqs.slice(0, INITIAL_COUNT);
-});
-
-const toggleExpand = () => {
-    isExpanded.value = !isExpanded.value;
-
-    if (!isExpanded.value && openIndex.value >= INITIAL_COUNT) {
-        openIndex.value = null;
-    }
-};
-
-const toggleFaq = (index) => {
-    openIndex.value = openIndex.value === index ? null : index;
-};
-
-const isOpen = (index) => openIndex.value === index;
-</script>
-
-<template>
-    <section class="mx-auto max-w-7xl px-4 pb-16 sm:px-6 sm:pb-20">
-        <!-- Section Header -->
-        <div class="mb-8 text-center sm:mb-10">
-            <div
-                class="mx-auto mb-3 flex h-11 w-11 items-center justify-center rounded-2xl bg-indigo-50 text-indigo-600 shadow-xs ring-1 ring-indigo-500/10 dark:bg-indigo-500/10 dark:text-indigo-400 dark:ring-indigo-500/20"
-            >
-                <HelpCircle class="h-5 w-5" />
-            </div>
-            <h2
-                class="text-2xl font-black tracking-tight text-slate-900 sm:text-3xl lg:text-4xl dark:text-gray-100"
-            >
-                সাধারণ জিজ্ঞাসা
-            </h2>
-            <p
-                class="mx-auto mt-2 max-w-md text-xs leading-relaxed font-medium text-slate-500 sm:text-sm dark:text-gray-400"
-            >
-                HSCStack এবং রিসোর্স সম্পর্কিত আপনার বিভিন্ন প্রশ্নের উত্তর এক
-                নজরে দেখে নিন।
-            </p>
-        </div>
-
-        <!-- Accordion Cards Container -->
-        <div class="mx-auto max-w-2xl space-y-3">
-            <TransitionGroup
-                enter-active-class="transition-all duration-500 cubic-bezier(0.16, 1, 0.3, 1)"
-                enter-from-class="opacity-0 translate-y-4 scale-95"
-                enter-to-class="opacity-100 translate-y-0 scale-100"
-                leave-active-class="transition-all duration-300 cubic-bezier(0.7, 0, 0.84, 0)"
-                leave-from-class="opacity-100 translate-y-0 scale-100"
-                leave-to-class="opacity-0 translate-y-2 scale-95"
-            >
-                <div
-                    v-for="(faq, index) in visibleFaqs"
-                    :key="faq.question"
-                    class="group overflow-hidden rounded-2xl border transition-all duration-300"
-                    :class="[
-                        isOpen(index)
-                            ? 'border-indigo-200 bg-white shadow-lg ring-1 shadow-indigo-500/5 ring-indigo-500/10 dark:border-indigo-500/30 dark:bg-gray-900 dark:shadow-indigo-500/5 dark:ring-indigo-500/10'
-                            : 'border-slate-200/80 bg-white/80 hover:border-slate-300 hover:bg-white dark:border-gray-700/80 dark:bg-gray-900/80 dark:hover:border-gray-600 dark:hover:bg-gray-900',
-                    ]"
-                >
-                    <!-- Header / Trigger Button -->
-                    <button
-                        type="button"
-                        @click="toggleFaq(index)"
-                        class="flex w-full items-center justify-between gap-3 p-4 text-left focus:outline-none sm:p-5"
-                    >
-                        <span
-                            class="text-xs leading-snug font-bold transition-colors duration-200 sm:text-sm lg:text-base"
-                            :class="
-                                isOpen(index)
-                                    ? 'text-indigo-600 dark:text-indigo-400'
-                                    : 'text-slate-800 group-hover:text-slate-900 dark:text-gray-200 dark:group-hover:text-gray-100'
-                            "
-                        >
-                            {{ faq.question }}
-                        </span>
-
-                        <div
-                            class="cubic-bezier(0.34, 1.56, 0.64, 1) flex h-7 w-7 shrink-0 items-center justify-center rounded-xl transition-all duration-500 sm:h-8 sm:w-8"
-                            :class="[
-                                isOpen(index)
-                                    ? 'rotate-180 bg-indigo-600 text-white shadow-xs'
-                                    : 'bg-slate-100 text-slate-400 group-hover:bg-slate-200 group-hover:text-slate-600 dark:bg-gray-800 dark:text-gray-500 dark:group-hover:bg-gray-700 dark:group-hover:text-gray-300',
-                            ]"
-                        >
-                            <ChevronDown class="h-4 w-4 stroke-[2.5]" />
-                        </div>
-                    </button>
-
-                    <!-- Ultra-Smooth Accordion Body (CSS Grid Rows Trick) -->
-                    <div
-                        class="cubic-bezier(0.16, 1, 0.3, 1) grid transition-[grid-template-rows,opacity] duration-500"
-                        :class="[
-                            isOpen(index)
-                                ? 'grid-rows-[1fr] opacity-100'
-                                : 'grid-rows-[0fr] opacity-0',
-                        ]"
-                    >
-                        <div class="overflow-hidden">
-                            <div
-                                class="cubic-bezier(0.16, 1, 0.3, 1) border-t border-slate-100 px-4 pt-3 pb-4 text-xs leading-relaxed font-medium text-slate-600 transition-transform duration-500 sm:px-5 sm:pb-5 sm:text-sm dark:border-gray-800 dark:text-gray-400"
-                                :class="[
-                                    isOpen(index)
-                                        ? 'translate-y-0'
-                                        : '-translate-y-2',
-                                ]"
-                            >
-                                <!-- Internal Link -->
-                                <template v-if="faq.type === 'link'">
-                                    {{ faq.answer }}
-                                    <Link
-                                        :href="faq.linkUrl"
-                                        class="font-bold text-indigo-600 hover:underline dark:text-indigo-400"
-                                    >
-                                        {{ faq.linkText }}
-                                    </Link>
-                                    {{ faq.answerAfter }}
-                                </template>
-
-                                <!-- External Link -->
-                                <template
-                                    v-else-if="faq.type === 'externalLink'"
-                                >
-                                    {{ faq.answer }}
-                                    <a
-                                        :href="faq.linkUrl"
-                                        target="_blank"
-                                        rel="noopener noreferrer"
-                                        class="inline-flex items-center gap-0.5 font-bold text-indigo-600 hover:underline dark:text-indigo-400"
-                                    >
-                                        {{ faq.linkText }}
-                                    </a>
-                                    {{ faq.answerAfter }}
-                                </template>
-
-                                <!-- Plain Text -->
-                                <template v-else>
-                                    {{ faq.answer }}
-                                </template>
-                            </div>
-                        </div>
-                    </div>
-                </div>
-            </TransitionGroup>
-
-            <!-- Toggle Expand / Collapse Button -->
-            <div v-if="faqs.length > INITIAL_COUNT" class="pt-4 text-center">
-                <button
-                    type="button"
-                    @click="toggleExpand"
-                    class="inline-flex items-center gap-2 rounded-2xl border border-slate-200 bg-white px-5 py-3 text-xs font-bold text-slate-700 shadow-xs transition-all duration-300 hover:border-indigo-300 hover:bg-slate-50 hover:text-indigo-600 hover:shadow-md hover:shadow-indigo-500/5 focus:outline-none active:scale-95 sm:text-sm dark:border-gray-700 dark:bg-gray-900 dark:text-gray-300 dark:hover:border-indigo-500/50 dark:hover:bg-gray-800 dark:hover:text-indigo-400"
-                >
-                    <template v-if="!isExpanded">
-                        <Plus class="h-4 w-4 stroke-[2.5]" />
-                        <span
-                            >আরও প্রশ্ন দেখুন ({{
-                                faqs.length - INITIAL_COUNT
-                            }})</span
-                        >
-                    </template>
-                    <template v-else>
-                        <Minus class="h-4 w-4 stroke-[2.5]" />
-                        <span>কম প্রশ্ন দেখুন</span>
-                    </template>
-                </button>
-            </div>
-        </div>
-    </section>
-</template>
diff --git a/resources/js/pages/ContributorGuide.vue b/resources/js/pages/ContributorGuide.vue
index 1ba6d25..0503ccf 100644
--- a/resources/js/pages/ContributorGuide.vue
+++ b/resources/js/pages/ContributorGuide.vue
@@ -8,10 +8,12 @@ import {
     HelpCircle,
     MessageCircle,
     Layers,
+    ChevronDown,
 } from 'lucide-vue-next';
-import { ref, onMounted, onUnmounted } from 'vue';
+import { ref, computed, onMounted, onUnmounted } from 'vue';
 
 const quickLinks = [
+    { num: '00', id: 'faq', label: 'FAQ' },
     { num: '01', id: 'getting-started', label: 'Start Here' },
     { num: '02', id: 'dashboard', label: 'Dashboard' },
     { num: '03', id: 'manage-contents', label: 'Manage Contents' },
@@ -22,7 +24,103 @@ const quickLinks = [
     { num: '08', id: 'troubleshooting', label: 'Toast Messages' },
 ];
 
-const activeId = ref('getting-started');
+const activeId = ref('faq');
+const openFaqIndex = ref<number | null>(0);
+const INITIAL_FAQ_COUNT = 4;
+const isFaqExpanded = ref(false);
+
+const visibleFaqs = computed(() => {
+    return isFaqExpanded.value ? faqs : faqs.slice(0, INITIAL_FAQ_COUNT);
+});
+
+const toggleFaqExpand = () => {
+    isFaqExpanded.value = !isFaqExpanded.value;
+
+    if (
+        !isFaqExpanded.value &&
+        openFaqIndex.value !== null &&
+        openFaqIndex.value >= INITIAL_FAQ_COUNT
+    ) {
+        openFaqIndex.value = null;
+    }
+};
+
+const toggleFaq = (index: number) => {
+    openFaqIndex.value = openFaqIndex.value === index ? null : index;
+};
+
+const faqs = [
+    {
+        question: 'HSCStack কী এবং এটি কাদের জন্য?',
+        answer: 'HSCStack হলো বাংলাদেশের HSC ও SSC শিক্ষার্থীদের জন্য তৈরি একটি ওপেন রিসোর্স প্ল্যাটফর্ম। এখানে চ্যাপ্টার ও সাবজেক্ট অনুযায়ী প্রয়োজনীয় ক্লাস নোট, পিডিএফ, ছবি, ভিডিও এবং পরীক্ষার প্রশ্নপত্র একসাথে ফ্রি-তে খুঁজে পাওয়া যায়।',
+        type: 'text',
+    },
+    {
+        question: 'ওয়েবসাইট সম্পর্কিত নতুন আপডেট বা ঘোষণা কোথায় পাওয়া যাবে?',
+        answer: 'প্ল্যাটফর্মের সাম্প্রতিক ফিচার, কনটেন্ট আপডেট এবং গুরুত্বপূর্ণ সকল ঘোষণা পেতে ফলো করুন আমাদের অফিশিয়াল ',
+        linkText: 'Facebook পেজ',
+        linkUrl: 'https://facebook.com/hscstackbd',
+        answerAfter: '।',
+        type: 'externalLink',
+    },
+    {
+        question: 'ওয়েবসাইটটি কীভাবে অর্থায়ন করা হয়?',
+        answer: 'এটি একটি অলাভজনক উদ্যোগ। আমাদের কনট্রিবিউটর এবং শিক্ষার্থীরাই মূলত আমাদের আর্থিক অনুদান দিয়ে থাকেন। আমাদের সাপোর্ট করতে ভিজিট করুন ',
+        linkText: 'আমাদের সাপোর্ট পেজ',
+        linkUrl: '/support',
+        answerAfter: '।',
+        type: 'link',
+    },
+    {
+        question: 'এটি কে বা কারা পরিচালনা করে?',
+        answer: 'এটি কোনো বাণিজ্যিক প্রতিষ্ঠান নয়; দেশজুড়ে ছড়িয়ে থাকা একদল উদ্যমী শিক্ষার্থী স্বেচ্ছাশ্রমে প্ল্যাটফর্মটি পরিচালনা ও কনটেন্ট কিউরেট করে থাকে। আমাদের টিম সম্পর্কে আরও জানতে পড়ুন ',
+        linkText: 'আমাদের কথা',
+        linkUrl: '/about-us',
+        answerAfter: '।',
+        type: 'link',
+    },
+    {
+        question: 'HSCStack কি ওপেন সোর্স?',
+        answer: 'হ্যাঁ! HSCStack সম্পূর্ণ ওপেন সোর্স একটি প্ল্যাটফর্ম। কোডবেসে কাজ করা, বাক ফিক্স করা কিংবা নতুন ফিচার যোগ করার জন্য আমাদের ',
+        linkText: 'GitHub রিপোজিটরি',
+        linkUrl: 'https://github.com/hscstack/platform',
+        answerAfter: ' ভিজিট করতে পারো।',
+        type: 'externalLink',
+    },
+    {
+        question: 'রিসোর্স দেখার জন্য কি কোনো অ্যাকাউন্ট তৈরি করতে হবে?',
+        answer: 'না, রিসোর্স খোঁজা, পড়া বা ডাউনলোড করার জন্য কোনো অ্যাকাউন্ট খোলার প্রয়োজন নেই। যেকোনো শিক্ষার্থী ফ্রিতে সরাসরি রিসোর্সগুলো ব্রাউজ ও ব্যবহার করতে পারবে।',
+        type: 'text',
+    },
+    {
+        question: 'আমি কি আমার তৈরি নোট বা রিসোর্স আপলোড করতে পারব?',
+        answer: 'কনটেন্টের মান এবং নির্ভুলতা নিশ্চিত করতে রিসোর্স আপলোডের সুবিধাটি শুধুমাত্র ভেরিফাইড মেম্বারদের জন্য নির্ধারিত। মেম্বারশিপের আবেদন করতে ',
+        linkText: 'এখানে ক্লিক করুন',
+        linkUrl: '/join',
+        answerAfter: '।',
+        type: 'link',
+    },
+    {
+        question: 'এখানে কী কী ধরনের স্টাডি মেটেরিয়াল পাওয়া যাবে?',
+        answer: 'এখানে অধ্যায়ভিত্তিক হ্যান্ডরিটেন নোটস, লেকচার শিট, সাজেস্টভ প্রশ্ন ব্যাঙ্ক, ডায়াগ্রাম এবং বিভিন্ন প্রয়োজনীয় টিউটোরিয়াল ও প্র্যাক্টিক্যাল গাইড পাওয়া যাবে।',
+        type: 'text',
+    },
+    {
+        question: 'ওয়েবসাইটটি ফোনে অ্যাপ হিসেবে ব্যবহার করা যাবে?',
+        answer: 'হ্যাঁ, প্ল্যাটফর্মটি PWA (Progressive Web App) সাপোর্টেড। ব্রাউজারের "Add to Home Screen" বা ইনস্টল পপআপ থেকে এক ক্লিকেই অ্যাপের মতো ফোনে ইনস্টল করে নেওয়া যায়।',
+        type: 'text',
+    },
+    {
+        question:
+            'ডেভেলপমেন্টে সাহায্য করতে বা কোড কন্ট্রিবিউট করতে চাইলে করণীয় কী?',
+        answer: 'HSCStack-এর ওপেন ডেভেলপমেন্ট টিমে যোগ দিতে আমাদের ',
+        linkText: 'আবেদন ফর্মে',
+        linkUrl: '/join',
+        answerAfter:
+            ' অ্যাপ্লাই করতে পারো। আবেদন গৃহীত হলে কোর ডেভেলপার হিসেবে কোডবেসে কাজ করার সুযোগ মিলবে।',
+        type: 'link',
+    },
+];
 let observer: IntersectionObserver | null = null;
 let isManualClick = false;
 let clickTimeout: ReturnType<typeof setTimeout> | null = null;
@@ -159,7 +257,7 @@ onUnmounted(() => {
                 </div>
                 <span
                     class="text-[11px] font-bold text-slate-400 dark:text-gray-500"
-                    >8 Chapters</span
+                    >9 Sections</span
                 >
             </div>
 
@@ -198,6 +296,106 @@ onUnmounted(() => {
         <div
             class="space-y-12 rounded-2xl border border-slate-200 bg-white p-5 shadow-sm sm:p-10 dark:border-gray-700 dark:bg-gray-900"
         >
+            <!-- Section 00: FAQ (Frequently Asked Questions) -->
+            <section
+                id="faq"
+                class="scroll-mt-44 space-y-5 border-b border-slate-100 pb-12 dark:border-gray-800"
+            >
+                <div class="flex items-center gap-2">
+                    <span
+                        class="inline-flex items-center justify-center rounded-lg bg-indigo-100 px-2.5 py-1 text-xs font-black text-indigo-700 dark:bg-indigo-500/20 dark:text-indigo-300"
+                        >00</span
+                    >
+                    <h2
+                        class="text-xl font-black tracking-tight text-slate-950 sm:text-2xl dark:text-gray-100"
+                    >
+                        Frequently Asked Questions (FAQ)
+                    </h2>
+                </div>
+                <p
+                    class="text-sm leading-relaxed font-normal text-slate-600 sm:text-base dark:text-gray-400"
+                >
+                    HSCStack প্ল্যাটফর্ম সম্পর্কিত সাধারণ প্রশ্ন ও উত্তর:
+                </p>
+
+                <div class="space-y-3 pt-2">
+                    <div
+                        v-for="(faq, index) in visibleFaqs"
+                        :key="index"
+                        class="overflow-hidden rounded-xl border border-slate-200 bg-slate-50/50 transition-colors dark:border-gray-800 dark:bg-gray-800/40"
+                    >
+                        <button
+                            type="button"
+                            @click="toggleFaq(index)"
+                            class="flex w-full items-center justify-between gap-4 p-4 text-left font-bold text-slate-900 transition hover:text-indigo-600 dark:text-gray-100 dark:hover:text-indigo-400"
+                        >
+                            <span class="text-sm sm:text-base">{{
+                                faq.question
+                            }}</span>
+                            <ChevronDown
+                                class="h-4 w-4 shrink-0 transition-transform duration-200"
+                                :class="{
+                                    'rotate-180 text-indigo-600 dark:text-indigo-400':
+                                        openFaqIndex === index,
+                                }"
+                            />
+                        </button>
+
+                        <div
+                            v-show="openFaqIndex === index"
+                            class="border-t border-slate-100 px-4 pt-3 pb-4 text-sm leading-relaxed text-slate-600 dark:border-gray-800 dark:text-gray-300"
+                        >
+                            <template v-if="faq.type === 'text'">
+                                {{ faq.answer }}
+                            </template>
+                            <template v-else-if="faq.type === 'link'">
+                                {{ faq.answer }}
+                                <Link
+                                    :href="faq.linkUrl"
+                                    class="font-bold text-indigo-600 underline hover:text-indigo-700 dark:text-indigo-400"
+                                >
+                                    {{ faq.linkText }}
+                                </Link>
+                                {{ faq.answerAfter }}
+                            </template>
+                            <template v-else-if="faq.type === 'externalLink'">
+                                {{ faq.answer }}
+                                <a
+                                    :href="faq.linkUrl"
+                                    target="_blank"
+                                    rel="noopener noreferrer"
+                                    class="font-bold text-indigo-600 underline hover:text-indigo-700 dark:text-indigo-400"
+                                >
+                                    {{ faq.linkText }}
+                                </a>
+                                {{ faq.answerAfter }}
+                            </template>
+                        </div>
+                    </div>
+
+                    <!-- Expand / Collapse Toggle -->
+                    <div
+                        v-if="faqs.length > INITIAL_FAQ_COUNT"
+                        class="pt-2 text-center"
+                    >
+                        <button
+                            type="button"
+                            @click="toggleFaqExpand"
+                            class="inline-flex items-center gap-2 rounded-xl border border-slate-200 bg-white px-4 py-2 text-xs font-bold text-slate-700 shadow-xs transition hover:border-indigo-300 hover:bg-indigo-50/50 hover:text-indigo-600 active:scale-95 dark:border-gray-700 dark:bg-gray-800 dark:text-gray-200 dark:hover:border-indigo-500/40 dark:hover:bg-indigo-500/10 dark:hover:text-indigo-300"
+                        >
+                            <span v-if="!isFaqExpanded"
+                                >Show all {{ faqs.length }} questions</span
+                            >
+                            <span v-else>Show less</span>
+                            <ChevronDown
+                                class="h-3.5 w-3.5 transition-transform duration-200"
+                                :class="{ 'rotate-180': isFaqExpanded }"
+                            />
+                        </button>
+                    </div>
+                </div>
+            </section>
+
             <!-- Section 01: Welcome & Getting Started -->
             <section id="getting-started" class="scroll-mt-44 space-y-5">
                 <div class="flex items-center gap-2">

From 5aea2a7aa897c08038cacba60c12228f43043c17 Mon Sep 17 00:00:00 2001
From: Tajim <com.tajim@gmail.com>
Date: Thu, 27 Aug 2026 12:50:14 +0600
Subject: [PATCH 2/4] feat(subjects): add english_name, custom slug support,
 and bilingual homepage search

---
 .../Requests/Subject/StoreSubjectRequest.php  |  9 +++-
 .../Requests/Subject/UpdateSubjectRequest.php | 13 ++++-
 ...836_add_english_name_to_subjects_table.php | 28 +++++++++++
 resources/js/pages/Home.vue                   | 33 +++++++-----
 tests/Feature/SubjectManagementTest.php       | 50 +++++++++++++++++++
 5 files changed, 118 insertions(+), 15 deletions(-)
 create mode 100644 database/migrations/2026_08_27_062836_add_english_name_to_subjects_table.php

diff --git a/app/Http/Requests/Subject/StoreSubjectRequest.php b/app/Http/Requests/Subject/StoreSubjectRequest.php
index 2fa988b..7975107 100644
--- a/app/Http/Requests/Subject/StoreSubjectRequest.php
+++ b/app/Http/Requests/Subject/StoreSubjectRequest.php
@@ -18,8 +18,12 @@ public function authorize(): bool
 
     protected function prepareForValidation(): void
     {
+        $slug = $this->filled('slug')
+            ? Str::slug($this->slug)
+            : Str::slug($this->course.'-'.($this->english_name ?: $this->name));
+
         $this->merge([
-            'slug' => Str::slug($this->course.'-'.$this->name),
+            'slug' => $slug,
         ]);
     }
 
@@ -32,7 +36,8 @@ public function rules(): array
     {
         return [
             'name' => ['required', 'string', 'max:100', 'min:3', 'unique:subjects,name'],
-            'slug' => ['required', 'string', 'unique:subjects,slug'],
+            'english_name' => ['nullable', 'string', 'max:100'],
+            'slug' => ['required', 'string', 'max:100', 'unique:subjects,slug'],
             'tailwind_format' => ['required', 'string', 'max:100'],
             'icon' => ['required', 'string', 'max:50'],
             'sort_order' => ['required', 'integer'],
diff --git a/app/Http/Requests/Subject/UpdateSubjectRequest.php b/app/Http/Requests/Subject/UpdateSubjectRequest.php
index 1cbf8d2..7b0a070 100644
--- a/app/Http/Requests/Subject/UpdateSubjectRequest.php
+++ b/app/Http/Requests/Subject/UpdateSubjectRequest.php
@@ -4,6 +4,7 @@
 
 use Illuminate\Contracts\Validation\ValidationRule;
 use Illuminate\Foundation\Http\FormRequest;
+use Illuminate\Support\Str;
 use Illuminate\Validation\Rule;
 
 class UpdateSubjectRequest extends FormRequest
@@ -16,6 +17,15 @@ public function authorize(): bool
         return true;
     }
 
+    protected function prepareForValidation(): void
+    {
+        if ($this->filled('slug')) {
+            $this->merge([
+                'slug' => Str::slug($this->slug),
+            ]);
+        }
+    }
+
     /**
      * Get the validation rules that apply to the request.
      *
@@ -27,10 +37,11 @@ public function rules(): array
 
         return [
             'name' => ['sometimes', 'string', 'max:100', 'min:3', Rule::unique('subjects', 'name')->ignore($subject->id)],
+            'english_name' => ['nullable', 'string', 'max:100'],
             'tailwind_format' => ['sometimes', 'string', 'max:100'],
             'icon' => ['sometimes', 'string', 'max:50'],
             'sort_order' => ['sometimes', 'integer'],
-            'slug' => ['sometimes', 'string'],
+            'slug' => ['sometimes', 'string', 'max:100', Rule::unique('subjects', 'slug')->ignore($subject->id)],
             'course' => ['sometimes', 'string', 'in:ssc,hsc'],
         ];
     }
diff --git a/database/migrations/2026_08_27_062836_add_english_name_to_subjects_table.php b/database/migrations/2026_08_27_062836_add_english_name_to_subjects_table.php
new file mode 100644
index 0000000..b9232be
--- /dev/null
+++ b/database/migrations/2026_08_27_062836_add_english_name_to_subjects_table.php
@@ -0,0 +1,28 @@
+<?php
+
+use Illuminate\Database\Migrations\Migration;
+use Illuminate\Database\Schema\Blueprint;
+use Illuminate\Support\Facades\Schema;
+
+return new class extends Migration
+{
+    /**
+     * Run the migrations.
+     */
+    public function up(): void
+    {
+        Schema::table('subjects', function (Blueprint $table) {
+            $table->string('english_name', 100)->nullable()->after('name');
+        });
+    }
+
+    /**
+     * Reverse the migrations.
+     */
+    public function down(): void
+    {
+        Schema::table('subjects', function (Blueprint $table) {
+            $table->dropColumn('english_name');
+        });
+    }
+};
diff --git a/resources/js/pages/Home.vue b/resources/js/pages/Home.vue
index cb912ae..d0205e9 100644
--- a/resources/js/pages/Home.vue
+++ b/resources/js/pages/Home.vue
@@ -4,7 +4,6 @@ import { ref, computed } from 'vue';
 import AIBanner from '@/components/AIBanner.vue';
 import BlogCard from '@/components/BlogCard.vue';
 import CourseSwitcher from '@/components/CourseSwitcher.vue';
-import FAQSection from '@/components/FAQSection.vue';
 import HomeHeader from '@/components/HomeHeader.vue';
 import NoticeDialog from '@/components/NoticeDialog.vue';
 import PwaInstallPrompt from '@/components/PwaInstallPrompt.vue';
@@ -16,12 +15,30 @@ const props = defineProps({
     featured_blogs: Array,
 });
 
-const subjects = props.subjects;
+const subjects = props.subjects as Array<{
+    id: number;
+    name: string;
+    english_name?: string | null;
+    slug: string;
+    course?: string;
+    tailwind_format: string;
+    icon: string;
+    nodes_count?: number;
+}>;
 const searchQuery = ref('');
 
 const filteredSubjects = computed(() => {
-    return subjects.filter((subject) =>
-        subject.name.toLowerCase().includes(searchQuery.value.toLowerCase()),
+    const q = searchQuery.value.toLowerCase().trim();
+    if (!q) {
+        return subjects;
+    }
+
+    return subjects.filter(
+        (subject) =>
+            (subject.name && subject.name.toLowerCase().includes(q)) ||
+            (subject.english_name &&
+                subject.english_name.toLowerCase().includes(q)) ||
+            (subject.slug && subject.slug.toLowerCase().includes(q)),
     );
 });
 </script>
@@ -113,12 +130,4 @@ const filteredSubjects = computed(() => {
             </div>
         </div>
     </main>
-    <!--
-    <RepositoryStas
-        :total-subjects="subjectCount"
-        :total-resources="resourceCount"
-        :total-users="contributorCount"
-    /> -->
-
-    <FAQSection />
 </template>
diff --git a/tests/Feature/SubjectManagementTest.php b/tests/Feature/SubjectManagementTest.php
index a76ed3d..4390ec8 100644
--- a/tests/Feature/SubjectManagementTest.php
+++ b/tests/Feature/SubjectManagementTest.php
@@ -7,6 +7,7 @@
 
     $response = $this->actingAs($admin)->post('/admin/subjects', [
         'name' => 'Platform Testing',
+        'english_name' => 'Testing Platform Subject',
         'course' => 'hsc',
         'tailwind_format' => 'bg-slate-500',
         'icon' => 'book-open',
@@ -17,6 +18,7 @@
 
     $this->assertDatabaseHas('subjects', [
         'name' => 'Platform Testing',
+        'english_name' => 'Testing Platform Subject',
         'course' => 'hsc',
         'tailwind_format' => 'bg-slate-500',
         'icon' => 'book-open',
@@ -29,6 +31,7 @@
 
     $subject = Subject::create([
         'name' => 'Platform Testing',
+        'english_name' => 'Testing Platform Subject',
         'slug' => 'platform-testing',
         'course' => 'hsc',
         'tailwind_format' => 'bg-slate-500',
@@ -38,6 +41,7 @@
 
     $response = $this->actingAs($admin)->patch("/admin/subjects/edit/{$subject->id}", [
         'name' => 'Platform Testing Updated',
+        'english_name' => 'Testing Platform Updated',
         'course' => 'ssc',
         'tailwind_format' => 'bg-slate-600',
         'icon' => 'book-open',
@@ -49,6 +53,7 @@
     $this->assertDatabaseHas('subjects', [
         'id' => $subject->id,
         'name' => 'Platform Testing Updated',
+        'english_name' => 'Testing Platform Updated',
         'course' => 'ssc',
         'sort_order' => 2,
     ]);
@@ -75,6 +80,51 @@
     ]);
 });
 
+test('admin can create a subject with custom slug', function () {
+    $admin = adminUserWithPermissions(['view admin', 'create subjects']);
+
+    $response = $this->actingAs($admin)->post('/admin/subjects', [
+        'name' => 'Custom Slug Subject',
+        'english_name' => 'Custom Slug Eng',
+        'slug' => 'my-special-custom-slug',
+        'course' => 'hsc',
+        'tailwind_format' => 'bg-slate-500',
+        'icon' => 'book-open',
+        'sort_order' => 1,
+    ]);
+
+    $response->assertRedirect(route('admin.subjects.index'));
+
+    $this->assertDatabaseHas('subjects', [
+        'name' => 'Custom Slug Subject',
+        'slug' => 'my-special-custom-slug',
+    ]);
+});
+
+test('admin can update a subject with custom slug', function () {
+    $admin = adminUserWithPermissions(['view admin', 'edit subjects']);
+
+    $subject = Subject::create([
+        'name' => 'Existing Subject',
+        'slug' => 'existing-subject-slug',
+        'course' => 'hsc',
+        'tailwind_format' => 'bg-slate-500',
+        'icon' => 'book-open',
+        'sort_order' => 1,
+    ]);
+
+    $response = $this->actingAs($admin)->patch("/admin/subjects/edit/{$subject->id}", [
+        'slug' => 'updated-custom-slug',
+    ]);
+
+    $response->assertRedirect(route('admin.subjects.index'));
+
+    $this->assertDatabaseHas('subjects', [
+        'id' => $subject->id,
+        'slug' => 'updated-custom-slug',
+    ]);
+});
+
 test('invalid subject creation is rejected by validation', function () {
     $admin = adminUserWithPermissions(['view admin', 'create subjects']);
 

From 6444b1fab0404fdfb0dbe1587006224675989b0b Mon Sep 17 00:00:00 2001
From: Tajim <com.tajim@gmail.com>
Date: Thu, 27 Aug 2026 12:50:23 +0600
Subject: [PATCH 3/4] fix(admin): unify deterministic hierarchical navigation,
 replace full page reloads with Link, and fix redirect loops

---
 app/Http/Controllers/Admin/NodeController.php |  27 ++-
 .../Controllers/Admin/ResourceController.php  |  50 ++++-
 resources/js/pages/admin/Node.vue             |  38 ++--
 resources/js/pages/admin/NodeCreateOrEdit.vue | 188 +++++++++--------
 resources/js/pages/admin/NoticeEdit.vue       |  13 +-
 .../js/pages/admin/ResourceCreateOrEdit.vue   |   6 +
 .../js/pages/admin/SubjectCreateOrEdit.vue    | 194 ++++++++++++++----
 .../pages/admin/resources/BulkImageCreate.vue |   6 +
 .../pages/admin/resources/BulkVideoCreate.vue |   6 +
 .../js/pages/admin/users/CreateOrEdit.vue     |  19 +-
 10 files changed, 367 insertions(+), 180 deletions(-)

diff --git a/app/Http/Controllers/Admin/NodeController.php b/app/Http/Controllers/Admin/NodeController.php
index 685fef1..21beb8c 100644
--- a/app/Http/Controllers/Admin/NodeController.php
+++ b/app/Http/Controllers/Admin/NodeController.php
@@ -62,21 +62,30 @@ public function create(Subject $subject, Request $request)
                 ->firstOrFail();
         }
 
+        $prev = url()->previous();
+        $redirect = (! empty($prev) && ! str_contains($prev, '/create') && ! str_contains($prev, '/edit'))
+            ? $prev
+            : route('admin.nodes.index', ['subject' => $subject->slug]);
+
         return Inertia::render('admin/NodeCreateOrEdit', [
             'subject' => $subject,
             'parent' => $parent,
-            'redirect' => url()->previous(),
+            'redirect' => $redirect,
         ]);
     }
 
     public function edit(Node $node)
     {
+        $prev = url()->previous();
+        $redirect = (! empty($prev) && ! str_contains($prev, '/create') && ! str_contains($prev, '/edit'))
+            ? $prev
+            : route('admin.nodes.index', ['subject' => $node->subject->slug]);
 
         return Inertia::render('admin/NodeCreateOrEdit', [
             'subject' => $node->subject,
             'node' => $node,
             'parent' => $node->parent,
-            'redirect' => url()->previous(),
+            'redirect' => $redirect,
         ]);
     }
 
@@ -118,7 +127,9 @@ public function store(StoreNodeRequest $request, Subject $subject)
             'sort_order' => $validated['sort_order'] ?? 0,
         ]);
 
-        $redirect = $validated['redirect'] ? $validated['redirect'] : explode('/create', url()->previous())[0];
+        $redirect = (! empty($validated['redirect']) && ! str_contains($validated['redirect'], '/create') && ! str_contains($validated['redirect'], '/edit'))
+            ? $validated['redirect']
+            : route('admin.nodes.index', ['subject' => $subject->slug]);
 
         return redirect($redirect)->with('success', 'Node created successfully.');
     }
@@ -151,12 +162,8 @@ public function update(UpdateNodeRequest $request, Subject $subject, Node $node)
 
             $slug = Str::slug($rawSlug);
 
-            $parentId = array_key_exists('parent_id', $validated)
-                ? $validated['parent_id']
-                : $node->parent_id;
-
             $exists = Node::where('subject_id', $subject->id)
-                ->where('parent_id', $parentId)
+                ->where('parent_id', $node->parent_id)
                 ->where('slug', $slug)
                 ->where('id', '!=', $node->id)
                 ->exists();
@@ -176,7 +183,9 @@ public function update(UpdateNodeRequest $request, Subject $subject, Node $node)
 
         $node->save();
 
-        $redirect = $validated['redirect'] ?? explode('/edit', url()->previous())[0];
+        $redirect = (! empty($validated['redirect']) && ! str_contains($validated['redirect'], '/create') && ! str_contains($validated['redirect'], '/edit'))
+            ? $validated['redirect']
+            : route('admin.nodes.index', ['subject' => $subject->slug]);
 
         return redirect($redirect)->with('success', 'Node updated successfully.');
     }
diff --git a/app/Http/Controllers/Admin/ResourceController.php b/app/Http/Controllers/Admin/ResourceController.php
index 6ad53f1..08429b0 100644
--- a/app/Http/Controllers/Admin/ResourceController.php
+++ b/app/Http/Controllers/Admin/ResourceController.php
@@ -22,8 +22,13 @@ public function create(Request $request)
     {
         $node = Node::findOrFail($request->node_id);
 
+        $prev = url()->previous();
+        $redirect = (! empty($prev) && ! str_contains($prev, '/create') && ! str_contains($prev, '/edit') && ! str_contains($prev, '/resources/'))
+            ? $prev
+            : '/admin/subjects';
+
         return Inertia::render('admin/ResourceCreateOrEdit', [
-            'redirect' => url()->previous(),
+            'redirect' => $redirect,
             'node' => $node,
         ]);
     }
@@ -32,8 +37,13 @@ public function edit(Resource $resource)
     {
         $node = $resource->node;
 
+        $prev = url()->previous();
+        $redirect = (! empty($prev) && ! str_contains($prev, '/create') && ! str_contains($prev, '/edit') && ! str_contains($prev, '/resources/'))
+            ? $prev
+            : '/admin/subjects';
+
         return Inertia::render('admin/ResourceCreateOrEdit', [
-            'redirect' => url()->previous(),
+            'redirect' => $redirect,
             'node' => $node,
             'resource' => $resource,
         ]);
@@ -51,7 +61,9 @@ public function store(StoreResourceRequest $request)
 
         Resource::create($validated);
 
-        $redirect = $validated['redirect'] ?? explode('/resources', url()->previous())[0];
+        $redirect = (! empty($validated['redirect']) && ! str_contains($validated['redirect'], '/create') && ! str_contains($validated['redirect'], '/edit'))
+            ? $validated['redirect']
+            : '/admin/subjects';
 
         return redirect($redirect)->with('success', 'Resource created successfully.');
     }
@@ -74,7 +86,9 @@ public function update(UpdateResourceRequest $request, Resource $resource)
 
         $resource->update($validated);
 
-        $redirect = $validated['redirect'] ?? '/admin/subjects';
+        $redirect = (! empty($validated['redirect']) && ! str_contains($validated['redirect'], '/create') && ! str_contains($validated['redirect'], '/edit'))
+            ? $validated['redirect']
+            : '/admin/subjects';
 
         return redirect($redirect)
             ->with('success', 'Resource updated successfully.');
@@ -93,7 +107,13 @@ public function destroy(Resource $resource)
 
     public function createBulkImages(Request $request)
     {
-        $redirect = $request->input('redirect', url()->previous());
+        $redirect = $request->input('redirect');
+        if (empty($redirect) || str_contains($redirect, '/create') || str_contains($redirect, '/edit')) {
+            $prev = url()->previous();
+            $redirect = (! empty($prev) && ! str_contains($prev, '/create') && ! str_contains($prev, '/edit'))
+                ? $prev
+                : '/admin/subjects';
+        }
         $node = Node::findOrFail($request->node_id);
 
         return Inertia::render('admin/resources/BulkImageCreate', [
@@ -118,12 +138,22 @@ public function storeBulkImages(BulkImageStoreRequest $request)
             }
         });
 
-        return redirect($validated['redirect'])->with('success', 'Bulk images uploaded successfully.');
+        $redirect = (! empty($validated['redirect']) && ! str_contains($validated['redirect'], '/create') && ! str_contains($validated['redirect'], '/edit'))
+            ? $validated['redirect']
+            : '/admin/subjects';
+
+        return redirect($redirect)->with('success', 'Bulk images uploaded successfully.');
     }
 
     public function createBulkVideos(Request $request)
     {
-        $redirect = $request->input('redirect', url()->previous());
+        $redirect = $request->input('redirect');
+        if (empty($redirect) || str_contains($redirect, '/create') || str_contains($redirect, '/edit')) {
+            $prev = url()->previous();
+            $redirect = (! empty($prev) && ! str_contains($prev, '/create') && ! str_contains($prev, '/edit'))
+                ? $prev
+                : '/admin/subjects';
+        }
         $node = Node::findOrFail($request->node_id);
 
         return Inertia::render('admin/resources/BulkVideoCreate', [
@@ -220,6 +250,10 @@ public function storeBulkVideos(BulkVideoStoreRequest $request)
             }
         });
 
-        return redirect($validated['redirect'])->with('success', 'Bulk Videos uploaded successfully.');
+        $redirect = (! empty($validated['redirect']) && ! str_contains($validated['redirect'], '/create') && ! str_contains($validated['redirect'], '/edit'))
+            ? $validated['redirect']
+            : '/admin/subjects';
+
+        return redirect($redirect)->with('success', 'Bulk Videos uploaded successfully.');
     }
 }
diff --git a/resources/js/pages/admin/Node.vue b/resources/js/pages/admin/Node.vue
index f5924bf..8d9e937 100644
--- a/resources/js/pages/admin/Node.vue
+++ b/resources/js/pages/admin/Node.vue
@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { Head, Link } from '@inertiajs/vue3';
+import { Head, Link, usePage } from '@inertiajs/vue3';
 import { Plus, FolderPlus, ArrowLeft, ChevronDown } from 'lucide-vue-next';
 import { computed, ref, onMounted, onUnmounted } from 'vue';
 import NodeRow from '@/components/admin/NodeRow.vue';
@@ -8,6 +8,7 @@ import EmptyState from '@/components/EmptyState.vue';
 import { usePermissions } from '@/lib/usePermissions';
 
 const { can } = usePermissions();
+const page = usePage();
 
 const props = defineProps({
     subject: Object,
@@ -23,31 +24,20 @@ const totalItemsCount = computed(
     () => (props.nodes?.length ?? 0) + (props.resources?.length ?? 0),
 );
 
-const handleBack = () => {
-    const url = new URL(window.location.href);
-    const segments = url.pathname.split('/').filter(Boolean);
-
-    // Already at /admin/subjects
-    if (segments.join('/') === 'admin/subjects') {
-        return;
-    }
+const backUrl = computed(() => {
+    const rawPath = (page.url || '').split('?')[0];
+    const segments = rawPath.split('/').filter(Boolean);
 
+    // If at top-level /admin/subjects/{subject}/nodes -> go to /admin/subjects
     const nodesIndex = segments.indexOf('nodes');
-
-    // At /admin/subjects/{subject}/nodes
-    if (nodesIndex === segments.length - 1) {
-        window.location.href = '/admin/subjects';
-
-        return;
+    if (nodesIndex === -1 || nodesIndex === segments.length - 1) {
+        return '/admin/subjects';
     }
 
-    // Remove the last nested node slug
+    // Step up one folder level
     segments.pop();
-
-    window.location.href = '/' + segments.join('/');
-};
-
-const currentUrl = typeof window !== 'undefined' ? window.location.href : '';
+    return '/' + segments.join('/');
+});
 
 const closeDropdown = (e) => {
     if (dropdownRef.value && !dropdownRef.value.contains(e.target)) {
@@ -68,13 +58,13 @@ onUnmounted(() => document.removeEventListener('click', closeDropdown));
             class="mb-3.5 flex shrink-0 items-center justify-between gap-3 border-b border-slate-100 pb-3 dark:border-gray-800"
         >
             <div class="flex min-w-0 items-center gap-2.5">
-                <button
-                    @click="handleBack"
+                <Link
+                    :href="backUrl"
                     class="inline-flex h-8 w-8 shrink-0 items-center justify-center rounded-lg border border-slate-200 bg-white text-slate-500 shadow-2xs transition-colors hover:bg-slate-50 hover:text-slate-700 dark:border-gray-700 dark:bg-gray-800 dark:text-gray-400 dark:hover:bg-gray-700 dark:hover:text-gray-200"
                     title="Go back"
                 >
                     <ArrowLeft class="h-4 w-4" :stroke-width="2.2" />
-                </button>
+                </Link>
 
                 <div class="flex min-w-0 flex-wrap items-center gap-2">
                     <h3
diff --git a/resources/js/pages/admin/NodeCreateOrEdit.vue b/resources/js/pages/admin/NodeCreateOrEdit.vue
index 07e067b..4279f52 100644
--- a/resources/js/pages/admin/NodeCreateOrEdit.vue
+++ b/resources/js/pages/admin/NodeCreateOrEdit.vue
@@ -1,7 +1,7 @@
 <script setup lang="ts">
-import { Head, useForm } from '@inertiajs/vue3';
+import { Head, Link, useForm } from '@inertiajs/vue3';
 import { FolderOpen, ChevronDown, ChevronRight } from 'lucide-vue-next';
-import { ref } from 'vue';
+import { ref, computed } from 'vue';
 
 const props = defineProps({
     subject: Object,
@@ -10,7 +10,23 @@ const props = defineProps({
     node: Object,
 });
 
-const showSlug = ref(false);
+const showAdvanced = ref(false);
+
+const cancelUrl = computed(() => {
+    if (
+        props.redirect &&
+        !props.redirect.includes('/create') &&
+        !props.redirect.includes('/edit')
+    ) {
+        return props.redirect;
+    }
+
+    if (props.subject?.slug) {
+        return `/admin/subjects/${props.subject.slug}/nodes`;
+    }
+
+    return '/admin/subjects';
+});
 
 const form = useForm({
     name: props.node?.name || '',
@@ -40,10 +56,6 @@ const submitForm = () => {
         });
     }
 };
-
-const goBack = () => {
-    window.history.back();
-};
 </script>
 
 <template>
@@ -67,6 +79,12 @@ const goBack = () => {
                     >
                 </p>
             </div>
+            <Link
+                :href="cancelUrl"
+                class="inline-flex items-center self-start rounded-lg bg-slate-100 px-4 py-2 text-sm font-medium text-slate-600 transition hover:bg-slate-200 sm:self-center dark:bg-gray-800 dark:text-gray-400 dark:hover:bg-gray-700"
+            >
+                &larr; Back
+            </Link>
         </div>
 
         <form @submit.prevent="submitForm" class="space-y-8">
@@ -108,89 +126,93 @@ const goBack = () => {
                 </div>
             </div>
 
-            <div class="grid grid-cols-1 gap-6 md:grid-cols-3">
-                <div class="md:col-span-2">
-                    <label
-                        for="name"
-                        class="mb-1.5 block text-sm font-semibold text-slate-700 dark:text-gray-300"
-                        >Folder Name</label
-                    >
-                    <input
-                        v-model="form.name"
-                        type="text"
-                        id="name"
-                        placeholder="e.g., Chapter 1: Introduction"
-                        class="w-full rounded-lg border px-4 py-2.5 transition outline-none"
-                        :class="getInputClass(form.errors.name)"
-                        required
-                    />
-                    <p
-                        v-if="form.errors.name"
-                        class="mt-1 text-sm text-rose-600"
-                    >
-                        {{ form.errors.name }}
-                    </p>
-                </div>
+            <!-- Folder Name -->
+            <div>
+                <label
+                    for="name"
+                    class="mb-1.5 block text-sm font-semibold text-slate-700 dark:text-gray-300"
+                    >Folder Name</label
+                >
+                <input
+                    v-model="form.name"
+                    type="text"
+                    id="name"
+                    placeholder="e.g., Chapter 1: Introduction"
+                    class="w-full rounded-lg border px-4 py-2.5 transition outline-none"
+                    :class="getInputClass(form.errors.name)"
+                    required
+                />
+                <p v-if="form.errors.name" class="mt-1 text-sm text-rose-600">
+                    {{ form.errors.name }}
+                </p>
+            </div>
 
-                <div>
-                    <label
-                        for="sort_order"
-                        class="mb-1.5 block text-sm font-semibold text-slate-700 dark:text-gray-300"
-                        >Order Priority</label
-                    >
-                    <input
-                        v-model.number="form.sort_order"
-                        type="number"
-                        id="sort_order"
-                        placeholder="0"
-                        class="w-full rounded-lg border px-4 py-2.5 transition outline-none"
-                        :class="getInputClass(form.errors.sort_order)"
+            <!-- Advanced Settings (Order Priority, Custom Slug) -->
+            <div class="pt-1">
+                <button
+                    type="button"
+                    @click="showAdvanced = !showAdvanced"
+                    class="inline-flex items-center gap-1.5 text-xs font-semibold text-slate-500 transition hover:text-blue-600 dark:text-gray-400 dark:hover:text-blue-400"
+                >
+                    <component
+                        :is="
+                            showAdvanced ||
+                            form.errors.slug ||
+                            form.errors.sort_order
+                                ? ChevronDown
+                                : ChevronRight
+                        "
+                        class="h-3.5 w-3.5"
                     />
-                    <p
-                        v-if="form.errors.sort_order"
-                        class="mt-1 text-sm text-rose-600"
-                    >
-                        {{ form.errors.sort_order }}
-                    </p>
-                    <p class="mt-1.5 text-xs text-slate-400 dark:text-gray-500">
-                        Lower numbers will appear first in the list.
-                    </p>
-                </div>
+                    <span>Advanced settings</span>
+                </button>
 
-                <div class="pt-1 md:col-span-3">
-                    <button
-                        type="button"
-                        @click="showSlug = !showSlug"
-                        class="inline-flex items-center gap-1 text-xs font-semibold text-slate-500 transition hover:text-blue-600 dark:text-gray-400 dark:hover:text-blue-400"
-                    >
-                        <component
-                            :is="
-                                showSlug || form.errors.slug
-                                    ? ChevronDown
-                                    : ChevronRight
-                            "
-                            class="h-3.5 w-3.5"
+                <div
+                    v-if="
+                        showAdvanced ||
+                        form.errors.slug ||
+                        form.errors.sort_order
+                    "
+                    class="mt-3 space-y-4 rounded-xl border border-slate-200/80 bg-slate-50/50 p-4 sm:p-5 dark:border-gray-700 dark:bg-gray-800/50"
+                >
+                    <!-- Order Priority -->
+                    <div>
+                        <label
+                            for="sort_order"
+                            class="mb-1.5 block text-xs font-semibold text-slate-700 dark:text-gray-300"
+                        >
+                            Order Priority
+                        </label>
+                        <input
+                            v-model.number="form.sort_order"
+                            type="number"
+                            id="sort_order"
+                            placeholder="0"
+                            class="w-full rounded-lg border px-3.5 py-2 text-sm transition outline-none"
+                            :class="getInputClass(form.errors.sort_order)"
                         />
-                        <span
-                            >Change slug?
-                            <span
-                                class="font-normal text-slate-400 dark:text-gray-500"
-                                >(advanced)</span
-                            ></span
+                        <p
+                            v-if="form.errors.sort_order"
+                            class="mt-1 text-xs text-rose-600"
+                        >
+                            {{ form.errors.sort_order }}
+                        </p>
+                        <p
+                            class="mt-1 text-[11px] text-slate-400 dark:text-gray-500"
                         >
-                    </button>
+                            Lower numbers will appear first in the list.
+                        </p>
+                    </div>
 
-                    <div
-                        v-if="showSlug || form.errors.slug"
-                        class="mt-3 space-y-1.5 rounded-xl border border-slate-200/80 bg-slate-50/50 p-4 dark:border-gray-700 dark:bg-gray-800/50"
-                    >
+                    <!-- Custom URL Slug -->
+                    <div>
                         <label
                             for="slug"
-                            class="block text-xs font-semibold text-slate-700 dark:text-gray-300"
+                            class="mb-1.5 block text-xs font-semibold text-slate-700 dark:text-gray-300"
                         >
                             Custom URL Slug
                             <span
-                                class="text-[11px] font-normal text-slate-400 dark:text-gray-500"
+                                class="font-normal text-slate-400 dark:text-gray-500"
                                 >(Optional)</span
                             >
                         </label>
@@ -209,7 +231,7 @@ const goBack = () => {
                             {{ form.errors.slug }}
                         </p>
                         <p
-                            class="text-[11px] text-slate-400 dark:text-gray-500"
+                            class="mt-1 text-[11px] text-slate-400 dark:text-gray-500"
                         >
                             Leave empty to automatically generate from the
                             folder name.
@@ -221,12 +243,12 @@ const goBack = () => {
             <div
                 class="flex justify-end space-x-3 border-t border-slate-100 pt-4 dark:border-gray-800"
             >
-                <button
-                    @click="goBack"
+                <Link
+                    :href="cancelUrl"
                     class="rounded-lg border border-slate-300 px-5 py-2.5 text-sm font-semibold text-slate-700 transition hover:bg-slate-50 dark:border-gray-600 dark:text-gray-300 dark:hover:bg-gray-800"
                 >
                     Cancel
-                </button>
+                </Link>
                 <button
                     type="submit"
                     :disabled="form.processing"
diff --git a/resources/js/pages/admin/NoticeEdit.vue b/resources/js/pages/admin/NoticeEdit.vue
index 6338a28..bc888e2 100644
--- a/resources/js/pages/admin/NoticeEdit.vue
+++ b/resources/js/pages/admin/NoticeEdit.vue
@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { Head, useForm } from '@inertiajs/vue3';
+import { Head, Link, useForm } from '@inertiajs/vue3';
 import { Loader2, Save, Trash2, Upload } from 'lucide-vue-next';
 import { computed, ref } from 'vue';
 
@@ -46,10 +46,6 @@ const handleRemoveImage = () => {
     }
 };
 
-const goBack = () => {
-    window.history.back();
-};
-
 const submitForm = () => {
     form.post('/admin/notice', {
         preserveScroll: true,
@@ -356,13 +352,12 @@ const submitForm = () => {
             <div
                 class="flex justify-end gap-3 border-t border-slate-100 pt-6 lg:col-span-3 dark:border-gray-800"
             >
-                <button
-                    type="button"
-                    @click="goBack"
+                <Link
+                    href="/admin"
                     class="rounded-xl border border-slate-200 px-5 py-2.5 text-sm font-semibold text-slate-700 transition hover:bg-slate-50 dark:border-gray-700 dark:text-gray-300 dark:hover:bg-gray-800"
                 >
                     Cancel
-                </button>
+                </Link>
                 <button
                     type="submit"
                     :disabled="form.processing"
diff --git a/resources/js/pages/admin/ResourceCreateOrEdit.vue b/resources/js/pages/admin/ResourceCreateOrEdit.vue
index 73f159e..f1e0eb5 100644
--- a/resources/js/pages/admin/ResourceCreateOrEdit.vue
+++ b/resources/js/pages/admin/ResourceCreateOrEdit.vue
@@ -105,6 +105,12 @@ const submitForm = () => {
                     Upload assets or link content for the curriculum structure.
                 </p>
             </div>
+            <Link
+                :href="redirect || '/admin/subjects'"
+                class="inline-flex items-center self-start rounded-lg bg-slate-100 px-4 py-2 text-sm font-medium text-slate-600 transition hover:bg-slate-200 sm:self-center dark:bg-gray-800 dark:text-gray-400 dark:hover:bg-gray-700"
+            >
+                &larr; Back
+            </Link>
         </div>
 
         <form @submit.prevent="submitForm" class="space-y-6">
diff --git a/resources/js/pages/admin/SubjectCreateOrEdit.vue b/resources/js/pages/admin/SubjectCreateOrEdit.vue
index 07426a5..b81ee0b 100644
--- a/resources/js/pages/admin/SubjectCreateOrEdit.vue
+++ b/resources/js/pages/admin/SubjectCreateOrEdit.vue
@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { Head, useForm } from '@inertiajs/vue3';
+import { Head, Link, useForm } from '@inertiajs/vue3';
 import {
     Atom,
     FlaskConical,
@@ -11,8 +11,10 @@ import {
     BarChart3,
     Search,
     Check,
+    ChevronDown,
+    ChevronRight,
 } from 'lucide-vue-next';
-import { computed } from 'vue';
+import { ref, computed } from 'vue';
 
 const icons = {
     Atom,
@@ -29,8 +31,12 @@ const props = defineProps({
     subject: Object,
 });
 
+const showAdvanced = ref(false);
+
 const form = useForm({
     name: props.subject?.name || '',
+    english_name: props.subject?.english_name || '',
+    slug: props.subject?.slug || '',
     course: props.subject?.course || 'hsc',
     tailwind_format: props.subject?.tailwind_format || 'bg-red-50 text-red-600',
     icon: props.subject?.icon || 'BookOpen',
@@ -54,10 +60,6 @@ const tailwindPresets = [
 
 const activeIconComponent = computed(() => icons[form.icon] || BookOpen);
 
-const goBack = () => {
-    window.history.back();
-};
-
 const submitForm = () => {
     if (props.subject) {
         form.patch(`/admin/subjects/edit/${props.subject.id}`, {
@@ -80,7 +82,7 @@ const submitForm = () => {
                 <h1
                     class="text-2xl font-bold text-slate-900 dark:text-gray-100"
                 >
-                    {{ props.subject ? 'Edit' : 'Create' }} New Subject
+                    {{ props.subject ? 'Edit' : 'Create New' }} Subject
                 </h1>
                 <p class="mt-1 text-sm text-slate-500 dark:text-gray-400">
                     {{
@@ -90,17 +92,17 @@ const submitForm = () => {
                     }}
                 </p>
             </div>
-            <button
-                type="button"
-                @click="goBack"
+            <Link
+                href="/admin/subjects"
                 class="inline-flex items-center self-start rounded-lg bg-slate-100 px-4 py-2 text-sm font-medium text-slate-600 transition hover:bg-slate-200 sm:self-center dark:bg-gray-800 dark:text-gray-400 dark:hover:bg-gray-700"
             >
                 &larr; Back
-            </button>
+            </Link>
         </div>
 
         <form @submit.prevent="submitForm" class="space-y-8">
-            <div class="grid grid-cols-1 gap-6 md:grid-cols-3">
+            <!-- Primary Inputs (Clean & Minimal) -->
+            <div class="grid grid-cols-1 gap-6 sm:grid-cols-2">
                 <div>
                     <label
                         for="name"
@@ -111,12 +113,12 @@ const submitForm = () => {
                         v-model="form.name"
                         type="text"
                         id="name"
-                        placeholder="e.g. Physics..."
+                        placeholder="e.g. পদার্থবিজ্ঞান ১ম পত্র"
                         class="w-full rounded-lg border px-4 py-2.5 transition outline-none"
                         :class="
                             form.errors.name
                                 ? 'border-rose-500 focus:ring-rose-500/20'
-                                : 'border-slate-300 focus:border-blue-500 focus:ring-blue-500/20 dark:border-gray-600'
+                                : 'border-slate-300 focus:border-blue-500 focus:ring-blue-500/20 dark:border-gray-600 dark:bg-gray-900'
                         "
                     />
                     <p
@@ -153,30 +155,147 @@ const submitForm = () => {
                         {{ form.errors.course }}
                     </p>
                 </div>
+            </div>
 
-                <div>
-                    <label
-                        for="sort_order"
-                        class="mb-1.5 block text-sm font-semibold text-slate-700 dark:text-gray-300"
-                        >Sort Order</label
-                    >
-                    <input
-                        v-model.number="form.sort_order"
-                        type="number"
-                        id="sort_order"
-                        class="w-full rounded-lg border px-4 py-2.5 transition outline-none"
-                        :class="
+            <!-- Advanced Settings (English Name, Sort Order, Custom Slug) -->
+            <div class="pt-1">
+                <button
+                    type="button"
+                    @click="showAdvanced = !showAdvanced"
+                    class="inline-flex items-center gap-1.5 text-xs font-semibold text-slate-500 transition hover:text-indigo-600 dark:text-gray-400 dark:hover:text-indigo-400"
+                >
+                    <component
+                        :is="
+                            showAdvanced ||
+                            form.errors.slug ||
+                            form.errors.english_name ||
                             form.errors.sort_order
-                                ? 'border-rose-500 focus:ring-rose-500/20'
-                                : 'border-slate-300 focus:border-blue-500 focus:ring-blue-500/20 dark:border-gray-600'
+                                ? ChevronDown
+                                : ChevronRight
                         "
+                        class="h-3.5 w-3.5"
                     />
-                    <p
-                        v-if="form.errors.sort_order"
-                        class="mt-1 text-sm text-rose-600"
-                    >
-                        {{ form.errors.sort_order }}
-                    </p>
+                    <span>Advanced settings</span>
+                </button>
+
+                <div
+                    v-if="
+                        showAdvanced ||
+                        form.errors.slug ||
+                        form.errors.english_name ||
+                        form.errors.sort_order
+                    "
+                    class="mt-3 space-y-4 rounded-xl border border-slate-200/80 bg-slate-50/50 p-4 sm:p-5 dark:border-gray-700 dark:bg-gray-800/50"
+                >
+                    <div class="grid grid-cols-1 gap-4 sm:grid-cols-2">
+                        <!-- English Name -->
+                        <div>
+                            <label
+                                for="english_name"
+                                class="mb-1.5 block text-xs font-semibold text-slate-700 dark:text-gray-300"
+                            >
+                                English Name (Search Keyword)
+                                <span
+                                    class="font-normal text-slate-400 dark:text-gray-500"
+                                    >(Optional)</span
+                                >
+                            </label>
+                            <input
+                                v-model="form.english_name"
+                                type="text"
+                                id="english_name"
+                                placeholder="e.g. Physics 1st Paper, Bangla"
+                                class="w-full rounded-lg border px-3.5 py-2 text-sm transition outline-none"
+                                :class="
+                                    form.errors.english_name
+                                        ? 'border-rose-500 focus:ring-rose-500/20'
+                                        : 'border-slate-300 focus:border-blue-500 focus:ring-blue-500/20 dark:border-gray-600 dark:bg-gray-900'
+                                "
+                            />
+                            <p
+                                v-if="form.errors.english_name"
+                                class="mt-1 text-xs text-rose-600"
+                            >
+                                {{ form.errors.english_name }}
+                            </p>
+                            <p
+                                class="mt-1 text-[11px] text-slate-400 dark:text-gray-500"
+                            >
+                                Optimizes homepage search when students type in
+                                English.
+                            </p>
+                        </div>
+
+                        <!-- Sort Order -->
+                        <div>
+                            <label
+                                for="sort_order"
+                                class="mb-1.5 block text-xs font-semibold text-slate-700 dark:text-gray-300"
+                            >
+                                Sort Order
+                            </label>
+                            <input
+                                v-model.number="form.sort_order"
+                                type="number"
+                                id="sort_order"
+                                class="w-full rounded-lg border px-3.5 py-2 text-sm transition outline-none"
+                                :class="
+                                    form.errors.sort_order
+                                        ? 'border-rose-500 focus:ring-rose-500/20'
+                                        : 'border-slate-300 focus:border-blue-500 focus:ring-blue-500/20 dark:border-gray-600 dark:bg-gray-900'
+                                "
+                            />
+                            <p
+                                v-if="form.errors.sort_order"
+                                class="mt-1 text-xs text-rose-600"
+                            >
+                                {{ form.errors.sort_order }}
+                            </p>
+                            <p
+                                class="mt-1 text-[11px] text-slate-400 dark:text-gray-500"
+                            >
+                                Lower numbers appear first in the catalog.
+                            </p>
+                        </div>
+                    </div>
+
+                    <!-- Custom URL Slug -->
+                    <div>
+                        <label
+                            for="slug"
+                            class="mb-1.5 block text-xs font-semibold text-slate-700 dark:text-gray-300"
+                        >
+                            Custom URL Slug
+                            <span
+                                class="font-normal text-slate-400 dark:text-gray-500"
+                                >(Optional)</span
+                            >
+                        </label>
+                        <input
+                            v-model="form.slug"
+                            type="text"
+                            id="slug"
+                            placeholder="e.g., hsc-physics-1st-paper (leave blank to auto-generate)"
+                            class="w-full rounded-lg border px-3.5 py-2 text-sm transition outline-none"
+                            :class="
+                                form.errors.slug
+                                    ? 'border-rose-500 focus:ring-rose-500/20'
+                                    : 'border-slate-300 focus:border-blue-500 focus:ring-blue-500/20 dark:border-gray-600 dark:bg-gray-900'
+                            "
+                        />
+                        <p
+                            v-if="form.errors.slug"
+                            class="mt-1 text-xs text-rose-600"
+                        >
+                            {{ form.errors.slug }}
+                        </p>
+                        <p
+                            class="mt-1 text-[11px] text-slate-400 dark:text-gray-500"
+                        >
+                            Leave empty to automatically generate from the
+                            course and name.
+                        </p>
+                    </div>
                 </div>
             </div>
 
@@ -287,13 +406,12 @@ const submitForm = () => {
             <div
                 class="flex justify-end space-x-3 border-t border-slate-100 pt-4 dark:border-gray-800"
             >
-                <button
-                    type="button"
-                    @click="goBack"
+                <Link
+                    href="/admin/subjects"
                     class="rounded-lg border border-slate-300 px-5 py-2.5 text-sm font-semibold text-slate-700 transition hover:bg-slate-50 dark:border-gray-600 dark:text-gray-300 dark:hover:bg-gray-800"
                 >
                     Cancel
-                </button>
+                </Link>
                 <button
                     type="submit"
                     :disabled="form.processing"
diff --git a/resources/js/pages/admin/resources/BulkImageCreate.vue b/resources/js/pages/admin/resources/BulkImageCreate.vue
index 93a41c0..092a674 100644
--- a/resources/js/pages/admin/resources/BulkImageCreate.vue
+++ b/resources/js/pages/admin/resources/BulkImageCreate.vue
@@ -149,6 +149,12 @@ const submitForm = () => {
                     once.
                 </p>
             </div>
+            <Link
+                :href="redirect || '/admin/subjects'"
+                class="inline-flex items-center self-start rounded-lg bg-slate-100 px-4 py-2 text-sm font-medium text-slate-600 transition hover:bg-slate-200 sm:self-center dark:bg-gray-800 dark:text-gray-400 dark:hover:bg-gray-700"
+            >
+                &larr; Back
+            </Link>
         </div>
 
         <form @submit.prevent="submitForm" class="space-y-6">
diff --git a/resources/js/pages/admin/resources/BulkVideoCreate.vue b/resources/js/pages/admin/resources/BulkVideoCreate.vue
index 674ce32..d63adb1 100644
--- a/resources/js/pages/admin/resources/BulkVideoCreate.vue
+++ b/resources/js/pages/admin/resources/BulkVideoCreate.vue
@@ -51,6 +51,12 @@ const submitForm = () => {
                     create resources preserving playlist order.
                 </p>
             </div>
+            <Link
+                :href="redirect || '/admin/subjects'"
+                class="inline-flex items-center self-start rounded-lg bg-slate-100 px-4 py-2 text-sm font-medium text-slate-600 transition hover:bg-slate-200 sm:self-center dark:bg-gray-800 dark:text-gray-400 dark:hover:bg-gray-700"
+            >
+                &larr; Back
+            </Link>
         </div>
 
         <form @submit.prevent="submitForm" class="space-y-6">
diff --git a/resources/js/pages/admin/users/CreateOrEdit.vue b/resources/js/pages/admin/users/CreateOrEdit.vue
index 158f1be..f04604b 100644
--- a/resources/js/pages/admin/users/CreateOrEdit.vue
+++ b/resources/js/pages/admin/users/CreateOrEdit.vue
@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { Head, useForm } from '@inertiajs/vue3';
+import { Head, Link, useForm } from '@inertiajs/vue3';
 import { UserPlus, Loader2, Save } from 'lucide-vue-next';
 import { watch } from 'vue';
 
@@ -43,10 +43,6 @@ watch(
     },
 );
 
-const goBack = () => {
-    window.history.back();
-};
-
 const submitForm = () => {
     if (props.user) {
         form.post(`/admin/users/${props.user.id}`, {
@@ -81,6 +77,12 @@ const submitForm = () => {
                     }}
                 </p>
             </div>
+            <Link
+                href="/admin/users"
+                class="inline-flex items-center self-start rounded-lg bg-slate-100 px-4 py-2 text-sm font-medium text-slate-600 transition hover:bg-slate-200 sm:self-center dark:bg-gray-800 dark:text-gray-400 dark:hover:bg-gray-700"
+            >
+                &larr; Back
+            </Link>
         </div>
 
         <form @submit.prevent="submitForm" class="max-w-3xl space-y-6">
@@ -477,13 +479,12 @@ const submitForm = () => {
             <div
                 class="flex justify-end space-x-3 border-t border-gray-300 pt-6 dark:border-gray-600"
             >
-                <button
-                    type="button"
-                    @click="goBack"
+                <Link
+                    href="/admin/users"
                     class="rounded-lg border border-gray-300 px-5 py-2.5 text-sm font-semibold text-slate-700 transition hover:bg-slate-50 dark:border-gray-600 dark:text-gray-300 dark:hover:bg-gray-800"
                 >
                     Cancel
-                </button>
+                </Link>
                 <button
                     type="submit"
                     :disabled="form.processing"

From 55894cd79f8e781368c412ba6987c39c91179d85 Mon Sep 17 00:00:00 2001
From: Tajim <com.tajim@gmail.com>
Date: Thu, 27 Aug 2026 12:53:30 +0600
Subject: [PATCH 4/4] style: fix eslint unused imports and formatting

---
 resources/js/components/UserListItem.vue | 2 +-
 resources/js/pages/Home.vue              | 1 +
 resources/js/pages/User/Show.vue         | 1 -
 resources/js/pages/admin/Node.vue        | 2 ++
 4 files changed, 4 insertions(+), 2 deletions(-)

diff --git a/resources/js/components/UserListItem.vue b/resources/js/components/UserListItem.vue
index 937d50b..5337bb2 100644
--- a/resources/js/components/UserListItem.vue
+++ b/resources/js/components/UserListItem.vue
@@ -1,7 +1,7 @@
 <script setup lang="ts">
 import { Link } from '@inertiajs/vue3';
-import VerifiedBadge from '@/components/VerifiedBadge.vue';
 import { computed } from 'vue';
+import VerifiedBadge from '@/components/VerifiedBadge.vue';
 
 const props = withDefaults(
     defineProps<{
diff --git a/resources/js/pages/Home.vue b/resources/js/pages/Home.vue
index d0205e9..4378b5e 100644
--- a/resources/js/pages/Home.vue
+++ b/resources/js/pages/Home.vue
@@ -29,6 +29,7 @@ const searchQuery = ref('');
 
 const filteredSubjects = computed(() => {
     const q = searchQuery.value.toLowerCase().trim();
+
     if (!q) {
         return subjects;
     }
diff --git a/resources/js/pages/User/Show.vue b/resources/js/pages/User/Show.vue
index a66ca85..c799078 100644
--- a/resources/js/pages/User/Show.vue
+++ b/resources/js/pages/User/Show.vue
@@ -5,7 +5,6 @@ import {
     ArrowBigUp,
     ArrowRight,
     ArrowUpRight,
-    BadgeCheck,
     BookOpen,
     Calendar,
     CheckCircle2,
diff --git a/resources/js/pages/admin/Node.vue b/resources/js/pages/admin/Node.vue
index 8d9e937..98bd5f8 100644
--- a/resources/js/pages/admin/Node.vue
+++ b/resources/js/pages/admin/Node.vue
@@ -30,12 +30,14 @@ const backUrl = computed(() => {
 
     // If at top-level /admin/subjects/{subject}/nodes -> go to /admin/subjects
     const nodesIndex = segments.indexOf('nodes');
+
     if (nodesIndex === -1 || nodesIndex === segments.length - 1) {
         return '/admin/subjects';
     }
 
     // Step up one folder level
     segments.pop();
+
     return '/' + segments.join('/');
 });