diff --git a/src/components/EditNews.vue b/src/components/EditNews.vue
index cd71703..b865104 100644
--- a/src/components/EditNews.vue
+++ b/src/components/EditNews.vue
@@ -100,7 +100,7 @@
             let currentUrl = window.location.href;
             let langValue = currentUrl.split("/")[4].split("lang=")[1];
             let spliturl = currentUrl.split("/")[4].split("edit=")[1].split(`lang=${langValue}`)[0].split(`&`)[0];
-            console.log(spliturl);
+            console.log(spliturl, langValue);
             let formData = new FormData();
             formData.append('slug', spliturl);
             fetch(`https://apisp.dev2.cicdhosting.com/_dedicated/dwd/edit-news/?action=news_${langValue}`, {
diff --git a/src/pages/editor/add-news.astro b/src/pages/editor/add-news.astro
index 67b99df..6e095e1 100644
--- a/src/pages/editor/add-news.astro
+++ b/src/pages/editor/add-news.astro
@@ -1,6 +1,6 @@
 ---
 import Layout from "../../layouts/Layout.astro";
-// import ImageUpload from "../../components/ImageUpload.vue";
+import ImageUpload from "../../components/ImageUpload.vue";
 ---
 
 <Layout title="Add News | Barta India">
@@ -8,13 +8,14 @@ import Layout from "../../layouts/Layout.astro";
         <div>
             <section class="container mx-auto px-4 md:max-w-3xl mt-40 space-y-4 shadow-xl rounded-xl p-4">
                 <h1 class="text-center text-2xl underline decoration-4 decoration-[#580a0a]">Genarate New News</h1>
+                <p style="display: none;" id="genStatus" class="text-green-500 font-bold">News Genarate Succesfully</p>
                 <form id="newsPara" class="flex flex-col space-y-4" enctype="multipart/form-data">
-                    <label for="language">Language<span class="text-[#580a0a] font-bold">*</span></label>
+                    <!-- <label for="language">Language<span class="text-[#580a0a] font-bold">*</span></label>
                     <select required onchange="qryWithLang();" name="language" id="language" class="border-2 border-[#580a0a] focus:outline-none focus:border-4 focus:border-[#580a0a] rounded-xl p-2">
                         <option value="0">-Select-</option>
                         <option value="english">English</option>    
                         <option value="bengali">Bengali</option>
-                    </select>
+                    </select> -->
                     <div class="flex flex-col">
                         <label for="category">Category<span class="text-[#580a0a] font-bold">*</span></label>
                         <select name="category" id="category" class="border-2 border-[#580a0a] focus:outline-none focus:border-4 focus:border-[#580a0a] rounded-xl p-2">
@@ -28,106 +29,23 @@ import Layout from "../../layouts/Layout.astro";
                     </div>
                     <div class="flex flex-col ">
                         <label for="preText">News Paragraph</label>
-                        <textarea onchange="buttonVisibility();" required name="preText" id="preText" cols="30" maxlength="1000000" rows="10" class="border-2 border-[#580a0a] focus:outline-none focus:border-4 focus:border-[#580a0a] rounded-xl"></textarea>
+                        <textarea required name="preText" id="preText" cols="30" maxlength="1000000" rows="10" class="border-2 border-[#580a0a] focus:outline-none focus:border-4 focus:border-[#580a0a] rounded-xl"></textarea>
                     </div>
                     <div class="flex flex-col">
-                        <textarea required name="systemMessage" id="systemMessage" cols="30" rows="3" class="border-2 border-[#580a0a] focus:outline-none focus:border-4 focus:border-[#580a0a] rounded-xl"></textarea>
+                        <textarea required name="systemMessage" id="systemMessage" cols="30" rows="3" class="border-2 border-[#580a0a] focus:outline-none focus:border-4 focus:border-[#580a0a] rounded-xl">provide meta_title within 60 characters, meta_description within  160 characters, short_description within 280 characters, heading within 170 characters in en, bn, hi, zh, es ar all in a json structure no use comma after line ending</textarea>
                     </div>
                     <div>
-                        <button id="genButton" style="display: none;" onclick="submitNewsPara(event);" class="bg-[#580a0a] text-white px-4 py-2 rounded-lg" >Genarate</button>
-                        <button id="genButton2" style="display: block;" class="bg-[#580a0a] text-white px-4 py-2 rounded-lg opacity-50 cursor-not-allowed" >Genarate</button>
+                        <button id="genButton" onclick="submitNewsPara(event);" class="bg-[#580a0a] text-white px-4 py-2 rounded-lg" >Genarate</button>
                     </div>
                     <!-- <input id="message" type="text" value="" class="border-2 border-[#580a0a] p-2 focus:outline-none focus:border-4 focus:border-[#580a0a] rounded-xl"/> -->
                 </form>
             </section>
-            <section id="formSection" style="display: none;" class="container mx-auto md:max-w-3xl px-4 shadow-xl rounded-xl p-6">
-                <div class="flex justify-center">
-                    <h1 class="text-xl my-6 p-2 border-2 bg-[#580a0a] text-white rounded-full">Add News to Barta-India's Page</h1>
-                </div>
-                <p>All(<span class="text-[#580a0a] font-bold">*</span>) are mandatory fields</p>
-                <form id="newsForm" class="flex flex-col space-y-4">
-                    <div class="flex flex-col">
-                        <label for="status">Status<span class="text-[#580a0a] font-bold">*</span></label>
-                        <select name="status" id="status" class="border-2 border-[#580a0a] focus:outline-none focus:border-4 focus:border-[#580a0a] rounded-xl p-2" required>
-                            <option value="null">-Select-</option>
-                            <option value="published">Published</option>
-                            <option value="draft">Draft</option>
-                            <option value="archived">Archived</option>
-                        </select>
-                    </div>
-                    <div class="flex flex-col">
-                        <label for="language">Language<span class="text-[#580a0a] font-bold">*</span></label>
-                        <select name="language" id="language" class="border-2 border-[#580a0a] focus:outline-none focus:border-4 focus:border-[#580a0a] rounded-xl p-2" required>
-                            <option value="null">-Select-</option>
-                            <option value="bengali">Bengali</option>
-                            <option value="english">English</option>
-                        </select>
-                    </div>
-                    <div class="flex flex-col">
-                        <label for="category">Category<span class="text-[#580a0a] font-bold">*</span></label>
-                        <select name="category" id="category" class="border-2 border-[#580a0a] focus:outline-none focus:border-4 focus:border-[#580a0a] rounded-xl p-2">
-                            <option value="null">-Select-</option>
-                            <option value="national">National</option>
-                            <option value="politics">Politics</option>
-                            <option value="local">Local</option>
-                            <option value="technology">Technology</option>
-                            <option value="world">World</option>
-                        </select>
-                    </div>
-                    <div class="flex flex-col">
-                        <label for="title">Title<span class="text-[#580a0a] font-bold">*</span></label>
-                        <input name="title" id="title" class="border-2 border-[#580a0a] focus:outline-none focus:border-4 focus:border-[#580a0a] rounded-xl p-2" type="text" required>
-                    </div>
-                    <div class="flex flex-col">
-                        <label for="slug">Slug<span class="text-[#580a0a] font-bold">*</span></label>
-                        <input oninput="updateSlug();" name="slug" id="slug" class="border-2 border-[#580a0a] focus:outline-none focus:border-4 focus:border-[#580a0a] rounded-xl p-2" type="text" required>
-                    </div>
-                    <div class="flex flex-col">
-                        <label for="heading">Heading<span class="text-[#580a0a] font-bold">*</span></label>
-                        <input name="heading"  id="heading" class="border-2 border-[#580a0a] focus:outline-none focus:border-4 focus:border-[#580a0a] rounded-xl p-2" type="text" required>
-                    </div>
-                    <div class="flex flex-col">
-                        <label for="meta_title">Meta Title<span class="text-[#580a0a] font-bold">*</span></label>
-                        <input name="meta_title" id="meta_title" class="border-2 border-[#580a0a] focus:outline-none focus:border-4 focus:border-[#580a0a] rounded-xl p-2" type="text" placeholder="max: length 60 characters & try to use common words" required>
-                    </div>
-                    <div class="flex flex-col">
-                        <label for="meta_description">Meta Description<span class="text-[#580a0a] font-bold">*</span></label>
-                        <input name="meta_description" id="meta_description" class="border-2 border-[#580a0a] focus:outline-none focus:border-4 focus:border-[#580a0a] rounded-xl p-2" type="text" placeholder="max: length 160 characters & try to use common words" required>
-                    </div>
-                    <div class="flex flex-col">
-                        <label for="in_brief">In Brief<span class="text-[#580a0a] font-bold">*</span></label>
-                        <input name="in_brief" id="in_brief" class="border-2 border-[#580a0a] focus:outline-none focus:border-4 focus:border-[#580a0a] rounded-xl p-2" type="text" placeholder="max: length 280 characters & try to descibe" required>
-                    </div>
-                    <div class="flex flex-col">
-                        <label class="text-lg" for="content">News Description<span class="text-[#580a0a] font-bold">*</span></label>
-                        <textarea class="border-2 p-2 border-[#580a0a] focus:outline-none focus:border-4 focus:border-[#580a0a] rounded-xl" name="content" id="content" cols="30" rows="10" required></textarea>
-                    </div>
-                    <div class="flex flex-col">
-                        <label for="upldFile">Upload File</label>
-                        <input id="upldFile" class="border-2 border-[#580a0a] focus:outline-none focus:border-4 focus:border-[#580a0a] rounded-xl" type="file">
-                    </div>
-                    <div class="flex float-right">
-                        <button onclick="callApi(event);" class="bg-[#580a0a] text-white px-4 py-2 rounded-lg">Save</button>
-                    </div>
-                </form>
-            </section>
             <section class="bg-white rounded-full px-6 py-4" id="loadingSection" style="display: none;">
                 <div class="flex flex-col justify-center place-items-center">
                     <div class="load-aimate animate-spin "></div>
                     <p>Processing...</p>
                 </div>
             </section>
-            <!-- <section class="container mx-auto">
-                <div>
-                    <dialog id="d" class="w-[50%]">
-                        <form method="dialog">
-                            <p>Modal Content Modal Content Lorem ipsum dolor sit, amet consectetur adipisicing elit. Hic consequatur aspernatur, explicabo sequi perspiciatis quisquam voluptates tenetur placeat numquam consectetur! Tempore expedita facilis tempora labore at illo beatae eligendi magnam.</p>
-                            <button>ok</button>
-                        </form>
-                    </dialog>
-                    <button onclick="d.showModal()">Open</button>
-                </div>
-            </section> -->
         </div>
     </main>
 </Layout>
@@ -135,25 +53,12 @@ import Layout from "../../layouts/Layout.astro";
 <script is:inline>
     function qryWithLang(){
         let langValue = document.getElementById('language').value;
-        document.getElementById('systemMessage').value = `need title, heading not more than 160 characters, meta_title not more than 60 characters, meta_description not more than 160 characters, short_description not more than 280 characters, long_description below 2000 characters, all are ${langValue} language all in a json structure`;
+        document.getElementById('systemMessage').value = `provide meta_title within 60 characters, meta_description within  160 characters, short_description within 280 characters, heading within 170 characters in en, bn, hi, zh,  es,  pt, ru, fr, ur, ar all in a json structure no use comma after line ending`;
         // give me long description below 2000 characters, title, heading not more than 160 characters, short desciption not more than 280 characters, meta_title not more than 60 characters and try to use common words, meta_description not more than 160 characters and try to use common words, all text are convert to ${langValue} language, give me all in a json structure`
         // provide   meta_title within 60 characters, meta_description within  160 characters, short_description within 280 characters in English, bengali and hindi all in a json structure
+        // need title, heading not more than 160 characters, meta_title not more than 60 characters, meta_description not more than 160 characters, short_description not more than 280 characters, long_description below 2000 characters, all are ${langValue} language all in a json structure
         // provide meta_title within 60 characters, meta_description within  160 characters, short_description within 280 characters in English, bengali and hindi all in a json structure
-    }
-    function buttonVisibility() {
-      var preTextValue = document.getElementById('preText').value.trim();
-      var systemMessageValue = document.getElementById('systemMessage').value.trim();
-      var languageValue = document.getElementById('language').value;
-      var categoryValue = document.getElementById('category').value;
-      var genButton = document.getElementById('genButton');
-      var genButton2 = document.getElementById('genButton2');
-      if (preTextValue.length > 0 && systemMessageValue.length > 0 && languageValue !== null) {
-        genButton.style.display = 'block';
-        genButton2.style.display = 'none';
-      } else {
-        genButton.style.display = 'none';
-        genButton2.style.display = 'block';
-      }
+        // provide meta_title within 60 characters, meta_description within  160 characters, short_description within 280 characters in English, bengali, hindi, Mandarin,  Spanish,  Portuguese, Russian, French, all in a json structure
     }
 
     function submitNewsPara(event) {
@@ -161,46 +66,39 @@ import Layout from "../../layouts/Layout.astro";
         let genButton = document.getElementById('genButton');
         let langInput = document.getElementById('language');
         let loadSection = document.getElementById('loadingSection');
-        let newsData = document.getElementById('newsPara'); 
-            loadSection.style.display = 'block';
-            genButton.disabled = true;
-            langInput.disabled = true;
-            genButton.style.cursor = 'not-allowed';
-
+        let newsData = document.getElementById('newsPara');
         let formData = new FormData(newsData);
-        fetch(`https://apisp.dev2.cicdhosting.com/_dedicated/dwd/`, {
+        loadSection.style.display = 'block';
+        fetch(`https://apisp.dev2.cicdhosting.com/_dedicated/dwd/multi-lang/`, {
             method: 'POST',
             body: formData,
         })
         .then(data => data.json())
         .then(data => {
-            // if (data === 200) {
-            //     counter++;
-            // } else {
-                // formSection genButton brightness-50
-                console.log(data)
-            // }
+            console.log(data);
             let newsData = data.choices[0].message.content;
             if(newsData){
-                document.getElementById('formSection').style.display = 'block';
+                document.getElementById('genStatus').style.display = 'block';
                 loadSection.style.display = 'none';
-                genButton.disabled = false;
-                genButton.style.cursor = 'pointer';
-                langInput.disabled = false;
-                // document.getElementById('loadingSection').classList.remove = 'brightness-50';
-                // document.getElementById('genButton').classList.remove = 'disabled';
             }
             let jsonObject = JSON.parse(newsData);
-            document.getElementById('title').value = jsonObject.title;
-            document.getElementById('slug').value = jsonObject.title;
-            document.getElementById('heading').value = jsonObject.heading;
-            document.getElementById('meta_title').value = jsonObject.meta_title;
-            document.getElementById('meta_description').value = jsonObject.meta_description;
-            document.getElementById('in_brief').value = jsonObject.short_description;
-            document.getElementById('content').value = jsonObject.long_description;
-            if(jsonObject.long_description){
-                // document.getElementById('content').value = jsonObject.long_description;
-            }
+            // Sample array
+
+            // Using forEach to log each element
+            // jsonObject.forEach(function(arrayData) {
+            //     console.log('Array Data', arrayData);
+            // });
+
+            // console.log(jsonObject.en)
+            // console.log(jsonObject.bn)
+            
+            // document.getElementById('title').value = jsonObject.title;
+            // document.getElementById('slug').value = jsonObject.title;
+            // document.getElementById('heading').value = jsonObject.heading;
+            // document.getElementById('meta_title').value = jsonObject.meta_title;
+            // document.getElementById('meta_description').value = jsonObject.meta_description;
+            // document.getElementById('in_brief').value = jsonObject.short_description;
+            // document.getElementById('content').value = jsonObject.long_description;
         })  
         .catch(error => {
             console.error('Error occurred', error);
diff --git a/src/pages/editor/multi-lang.astro b/src/pages/editor/multi-lang.astro
deleted file mode 100644
index cf86387..0000000
--- a/src/pages/editor/multi-lang.astro
+++ /dev/null
@@ -1,158 +0,0 @@
----
-import Layout from "../../layouts/Layout.astro";
-import ImageUpload from "../../components/ImageUpload.vue";
----
-
-<Layout title="Add News | Barta India">
-    <main>
-        <div>
-            <section class="container mx-auto px-4 md:max-w-3xl mt-40 space-y-4 shadow-xl rounded-xl p-4">
-                <h1 class="text-center text-2xl underline decoration-4 decoration-[#580a0a]">Genarate New News</h1>
-                <form id="newsPara" class="flex flex-col space-y-4" enctype="multipart/form-data">
-                    <!-- <label for="language">Language<span class="text-[#580a0a] font-bold">*</span></label>
-                    <select required onchange="qryWithLang();" name="language" id="language" class="border-2 border-[#580a0a] focus:outline-none focus:border-4 focus:border-[#580a0a] rounded-xl p-2">
-                        <option value="0">-Select-</option>
-                        <option value="english">English</option>    
-                        <option value="bengali">Bengali</option>
-                    </select> -->
-                    <div class="flex flex-col">
-                        <label for="category">Category<span class="text-[#580a0a] font-bold">*</span></label>
-                        <select name="category" id="category" class="border-2 border-[#580a0a] focus:outline-none focus:border-4 focus:border-[#580a0a] rounded-xl p-2">
-                            <option value="0">-Select-</option>
-                            <option value="national">National</option>
-                            <option value="politics">Politics</option>
-                            <option value="local">Local</option>
-                            <option value="technology">Technology</option>
-                            <option value="world">World</option>
-                        </select>
-                    </div>
-                    <div class="flex flex-col ">
-                        <label for="preText">News Paragraph</label>
-                        <textarea required name="preText" id="preText" cols="30" maxlength="1000000" rows="10" class="border-2 border-[#580a0a] focus:outline-none focus:border-4 focus:border-[#580a0a] rounded-xl">white tiger</textarea>
-                    </div>
-                    <div class="flex flex-col">
-                        <textarea required name="systemMessage" id="systemMessage" cols="30" rows="3" class="border-2 border-[#580a0a] focus:outline-none focus:border-4 focus:border-[#580a0a] rounded-xl">provide meta_title within 60 characters, meta_description within  160 characters, short_description within 280 characters, heading within 170 characters in en, bn, hi, zh, es ar all in a json structure no use comma after line ending</textarea>
-                    </div>
-                    <div>
-                        <button id="genButton" onclick="submitNewsPara(event);" class="bg-[#580a0a] text-white px-4 py-2 rounded-lg" >Genarate</button>
-                    </div>
-                    <!-- <input id="message" type="text" value="" class="border-2 border-[#580a0a] p-2 focus:outline-none focus:border-4 focus:border-[#580a0a] rounded-xl"/> -->
-                </form>
-            </section>
-        </div>
-    </main>
-</Layout>
-
-<script is:inline>
-    function qryWithLang(){
-        let langValue = document.getElementById('language').value;
-        document.getElementById('systemMessage').value = `provide meta_title within 60 characters, meta_description within  160 characters, short_description within 280 characters, heading within 170 characters in en, bn, hi, zh,  es,  pt, ru, fr, ur, ar all in a json structure no use comma after line ending`;
-        // give me long description below 2000 characters, title, heading not more than 160 characters, short desciption not more than 280 characters, meta_title not more than 60 characters and try to use common words, meta_description not more than 160 characters and try to use common words, all text are convert to ${langValue} language, give me all in a json structure`
-        // provide   meta_title within 60 characters, meta_description within  160 characters, short_description within 280 characters in English, bengali and hindi all in a json structure
-        // need title, heading not more than 160 characters, meta_title not more than 60 characters, meta_description not more than 160 characters, short_description not more than 280 characters, long_description below 2000 characters, all are ${langValue} language all in a json structure
-        // provide meta_title within 60 characters, meta_description within  160 characters, short_description within 280 characters in English, bengali and hindi all in a json structure
-        // provide meta_title within 60 characters, meta_description within  160 characters, short_description within 280 characters in English, bengali, hindi, Mandarin,  Spanish,  Portuguese, Russian, French, all in a json structure
-    }
-
-    function submitNewsPara(event) {
-        event.preventDefault();
-        let genButton = document.getElementById('genButton');
-        let langInput = document.getElementById('language');
-        let loadSection = document.getElementById('loadingSection');
-        let newsData = document.getElementById('newsPara');
-        let formData = new FormData(newsData);
-        fetch(`https://apisp.dev2.cicdhosting.com/_dedicated/dwd/multi-lang/`, {
-            method: 'POST',
-            body: formData,
-        })
-        .then(data => data.json())
-        .then(data => {
-            // if (data === 200) {
-            //     counter++;
-            // } else {
-                // formSection genButton brightness-50
-                console.log(data)
-            // }
-            let newsData = data.choices[0].message.content;
-            let jsonObject = JSON.parse(newsData);
-            // Sample array
-
-            // Using forEach to log each element
-            // jsonObject.forEach(function(arrayData) {
-            //     console.log('Array Data', arrayData);
-            // });
-
-            // console.log(jsonObject.en)
-            // console.log(jsonObject.bn)
-            
-            // document.getElementById('title').value = jsonObject.title;
-            // document.getElementById('slug').value = jsonObject.title;
-            // document.getElementById('heading').value = jsonObject.heading;
-            // document.getElementById('meta_title').value = jsonObject.meta_title;
-            // document.getElementById('meta_description').value = jsonObject.meta_description;
-            // document.getElementById('in_brief').value = jsonObject.short_description;
-            // document.getElementById('content').value = jsonObject.long_description;
-        })  
-        .catch(error => {
-            console.error('Error occurred', error);
-        });
-    }
-    function slugify(text) {
-        return text.toString().toLowerCase()
-            .replace(/\s+/g, '-')        // Replace spaces with -
-            .replace(/[^\w-]+/g, '')     // Remove all non-word characters
-            .replace(/--+/g, '-')        // Replace multiple - with single -
-            .replace(/^-+/, '')          // Trim - from start of text
-            .replace(/-+$/, '');         // Trim - from end of text
-    }
-
-    function updateSlug() {
-        const titleInput = document.getElementById('slug');
-        const slugInput = document.getElementById('slug');
-        const titleValue = titleInput.value;
-        slugInput.value = slugify(titleValue);
-    }
-
-    function callApi(event) {
-        event.preventDefault();
-        let slugValue = document.getElementById('slug').value;
-        let newsData = document.getElementById('newsForm');
-        let formData = new FormData(newsData);
-        fetch(`https://apisp.dev2.cicdhosting.com/news/add-news/?action=save`, {
-            method: 'POST',
-            body: formData,
-        })
-        .then(data => data.json())
-        .then(data => {
-            if (data.success === true) {
-                window.location.href= `/add-file?slug=${slugValue}`
-                // console.log(slugValue)
-                console.log('Form Data Submitted Successfully');
-            } else {
-                console.log('Data Submit Failed');
-            }
-            console.log(data);
-        })
-        .catch(error => {
-            console.error('Error occurred', error);
-        });
-    }
-</script>
-<style>
-    #loadingSection{
-        position: fixed;
-        top: 50%;
-        left: 50%;
-        transform: translate(-50%, -50%);
-    }
-    .load-aimate{
-        width: 60px;
-        height: 60px;
-        border-radius: 50%;
-        border-left: 5px solid #580a0a;
-        border-right: 5px solid #580a0a;
-        border-bottom: 5px solid #580a0a;
-        border-top: 5px solid #FFFFFF;
-        background-color: #FFFFFF;
-    }
-</style>
\ No newline at end of file
diff --git a/src/pages/editor/single-gen.astro b/src/pages/editor/single-gen.astro
new file mode 100644
index 0000000..67b99df
--- /dev/null
+++ b/src/pages/editor/single-gen.astro
@@ -0,0 +1,267 @@
+---
+import Layout from "../../layouts/Layout.astro";
+// import ImageUpload from "../../components/ImageUpload.vue";
+---
+
+<Layout title="Add News | Barta India">
+    <main>
+        <div>
+            <section class="container mx-auto px-4 md:max-w-3xl mt-40 space-y-4 shadow-xl rounded-xl p-4">
+                <h1 class="text-center text-2xl underline decoration-4 decoration-[#580a0a]">Genarate New News</h1>
+                <form id="newsPara" class="flex flex-col space-y-4" enctype="multipart/form-data">
+                    <label for="language">Language<span class="text-[#580a0a] font-bold">*</span></label>
+                    <select required onchange="qryWithLang();" name="language" id="language" class="border-2 border-[#580a0a] focus:outline-none focus:border-4 focus:border-[#580a0a] rounded-xl p-2">
+                        <option value="0">-Select-</option>
+                        <option value="english">English</option>    
+                        <option value="bengali">Bengali</option>
+                    </select>
+                    <div class="flex flex-col">
+                        <label for="category">Category<span class="text-[#580a0a] font-bold">*</span></label>
+                        <select name="category" id="category" class="border-2 border-[#580a0a] focus:outline-none focus:border-4 focus:border-[#580a0a] rounded-xl p-2">
+                            <option value="0">-Select-</option>
+                            <option value="national">National</option>
+                            <option value="politics">Politics</option>
+                            <option value="local">Local</option>
+                            <option value="technology">Technology</option>
+                            <option value="world">World</option>
+                        </select>
+                    </div>
+                    <div class="flex flex-col ">
+                        <label for="preText">News Paragraph</label>
+                        <textarea onchange="buttonVisibility();" required name="preText" id="preText" cols="30" maxlength="1000000" rows="10" class="border-2 border-[#580a0a] focus:outline-none focus:border-4 focus:border-[#580a0a] rounded-xl"></textarea>
+                    </div>
+                    <div class="flex flex-col">
+                        <textarea required name="systemMessage" id="systemMessage" cols="30" rows="3" class="border-2 border-[#580a0a] focus:outline-none focus:border-4 focus:border-[#580a0a] rounded-xl"></textarea>
+                    </div>
+                    <div>
+                        <button id="genButton" style="display: none;" onclick="submitNewsPara(event);" class="bg-[#580a0a] text-white px-4 py-2 rounded-lg" >Genarate</button>
+                        <button id="genButton2" style="display: block;" class="bg-[#580a0a] text-white px-4 py-2 rounded-lg opacity-50 cursor-not-allowed" >Genarate</button>
+                    </div>
+                    <!-- <input id="message" type="text" value="" class="border-2 border-[#580a0a] p-2 focus:outline-none focus:border-4 focus:border-[#580a0a] rounded-xl"/> -->
+                </form>
+            </section>
+            <section id="formSection" style="display: none;" class="container mx-auto md:max-w-3xl px-4 shadow-xl rounded-xl p-6">
+                <div class="flex justify-center">
+                    <h1 class="text-xl my-6 p-2 border-2 bg-[#580a0a] text-white rounded-full">Add News to Barta-India's Page</h1>
+                </div>
+                <p>All(<span class="text-[#580a0a] font-bold">*</span>) are mandatory fields</p>
+                <form id="newsForm" class="flex flex-col space-y-4">
+                    <div class="flex flex-col">
+                        <label for="status">Status<span class="text-[#580a0a] font-bold">*</span></label>
+                        <select name="status" id="status" class="border-2 border-[#580a0a] focus:outline-none focus:border-4 focus:border-[#580a0a] rounded-xl p-2" required>
+                            <option value="null">-Select-</option>
+                            <option value="published">Published</option>
+                            <option value="draft">Draft</option>
+                            <option value="archived">Archived</option>
+                        </select>
+                    </div>
+                    <div class="flex flex-col">
+                        <label for="language">Language<span class="text-[#580a0a] font-bold">*</span></label>
+                        <select name="language" id="language" class="border-2 border-[#580a0a] focus:outline-none focus:border-4 focus:border-[#580a0a] rounded-xl p-2" required>
+                            <option value="null">-Select-</option>
+                            <option value="bengali">Bengali</option>
+                            <option value="english">English</option>
+                        </select>
+                    </div>
+                    <div class="flex flex-col">
+                        <label for="category">Category<span class="text-[#580a0a] font-bold">*</span></label>
+                        <select name="category" id="category" class="border-2 border-[#580a0a] focus:outline-none focus:border-4 focus:border-[#580a0a] rounded-xl p-2">
+                            <option value="null">-Select-</option>
+                            <option value="national">National</option>
+                            <option value="politics">Politics</option>
+                            <option value="local">Local</option>
+                            <option value="technology">Technology</option>
+                            <option value="world">World</option>
+                        </select>
+                    </div>
+                    <div class="flex flex-col">
+                        <label for="title">Title<span class="text-[#580a0a] font-bold">*</span></label>
+                        <input name="title" id="title" class="border-2 border-[#580a0a] focus:outline-none focus:border-4 focus:border-[#580a0a] rounded-xl p-2" type="text" required>
+                    </div>
+                    <div class="flex flex-col">
+                        <label for="slug">Slug<span class="text-[#580a0a] font-bold">*</span></label>
+                        <input oninput="updateSlug();" name="slug" id="slug" class="border-2 border-[#580a0a] focus:outline-none focus:border-4 focus:border-[#580a0a] rounded-xl p-2" type="text" required>
+                    </div>
+                    <div class="flex flex-col">
+                        <label for="heading">Heading<span class="text-[#580a0a] font-bold">*</span></label>
+                        <input name="heading"  id="heading" class="border-2 border-[#580a0a] focus:outline-none focus:border-4 focus:border-[#580a0a] rounded-xl p-2" type="text" required>
+                    </div>
+                    <div class="flex flex-col">
+                        <label for="meta_title">Meta Title<span class="text-[#580a0a] font-bold">*</span></label>
+                        <input name="meta_title" id="meta_title" class="border-2 border-[#580a0a] focus:outline-none focus:border-4 focus:border-[#580a0a] rounded-xl p-2" type="text" placeholder="max: length 60 characters & try to use common words" required>
+                    </div>
+                    <div class="flex flex-col">
+                        <label for="meta_description">Meta Description<span class="text-[#580a0a] font-bold">*</span></label>
+                        <input name="meta_description" id="meta_description" class="border-2 border-[#580a0a] focus:outline-none focus:border-4 focus:border-[#580a0a] rounded-xl p-2" type="text" placeholder="max: length 160 characters & try to use common words" required>
+                    </div>
+                    <div class="flex flex-col">
+                        <label for="in_brief">In Brief<span class="text-[#580a0a] font-bold">*</span></label>
+                        <input name="in_brief" id="in_brief" class="border-2 border-[#580a0a] focus:outline-none focus:border-4 focus:border-[#580a0a] rounded-xl p-2" type="text" placeholder="max: length 280 characters & try to descibe" required>
+                    </div>
+                    <div class="flex flex-col">
+                        <label class="text-lg" for="content">News Description<span class="text-[#580a0a] font-bold">*</span></label>
+                        <textarea class="border-2 p-2 border-[#580a0a] focus:outline-none focus:border-4 focus:border-[#580a0a] rounded-xl" name="content" id="content" cols="30" rows="10" required></textarea>
+                    </div>
+                    <div class="flex flex-col">
+                        <label for="upldFile">Upload File</label>
+                        <input id="upldFile" class="border-2 border-[#580a0a] focus:outline-none focus:border-4 focus:border-[#580a0a] rounded-xl" type="file">
+                    </div>
+                    <div class="flex float-right">
+                        <button onclick="callApi(event);" class="bg-[#580a0a] text-white px-4 py-2 rounded-lg">Save</button>
+                    </div>
+                </form>
+            </section>
+            <section class="bg-white rounded-full px-6 py-4" id="loadingSection" style="display: none;">
+                <div class="flex flex-col justify-center place-items-center">
+                    <div class="load-aimate animate-spin "></div>
+                    <p>Processing...</p>
+                </div>
+            </section>
+            <!-- <section class="container mx-auto">
+                <div>
+                    <dialog id="d" class="w-[50%]">
+                        <form method="dialog">
+                            <p>Modal Content Modal Content Lorem ipsum dolor sit, amet consectetur adipisicing elit. Hic consequatur aspernatur, explicabo sequi perspiciatis quisquam voluptates tenetur placeat numquam consectetur! Tempore expedita facilis tempora labore at illo beatae eligendi magnam.</p>
+                            <button>ok</button>
+                        </form>
+                    </dialog>
+                    <button onclick="d.showModal()">Open</button>
+                </div>
+            </section> -->
+        </div>
+    </main>
+</Layout>
+
+<script is:inline>
+    function qryWithLang(){
+        let langValue = document.getElementById('language').value;
+        document.getElementById('systemMessage').value = `need title, heading not more than 160 characters, meta_title not more than 60 characters, meta_description not more than 160 characters, short_description not more than 280 characters, long_description below 2000 characters, all are ${langValue} language all in a json structure`;
+        // give me long description below 2000 characters, title, heading not more than 160 characters, short desciption not more than 280 characters, meta_title not more than 60 characters and try to use common words, meta_description not more than 160 characters and try to use common words, all text are convert to ${langValue} language, give me all in a json structure`
+        // provide   meta_title within 60 characters, meta_description within  160 characters, short_description within 280 characters in English, bengali and hindi all in a json structure
+        // provide meta_title within 60 characters, meta_description within  160 characters, short_description within 280 characters in English, bengali and hindi all in a json structure
+    }
+    function buttonVisibility() {
+      var preTextValue = document.getElementById('preText').value.trim();
+      var systemMessageValue = document.getElementById('systemMessage').value.trim();
+      var languageValue = document.getElementById('language').value;
+      var categoryValue = document.getElementById('category').value;
+      var genButton = document.getElementById('genButton');
+      var genButton2 = document.getElementById('genButton2');
+      if (preTextValue.length > 0 && systemMessageValue.length > 0 && languageValue !== null) {
+        genButton.style.display = 'block';
+        genButton2.style.display = 'none';
+      } else {
+        genButton.style.display = 'none';
+        genButton2.style.display = 'block';
+      }
+    }
+
+    function submitNewsPara(event) {
+        event.preventDefault();
+        let genButton = document.getElementById('genButton');
+        let langInput = document.getElementById('language');
+        let loadSection = document.getElementById('loadingSection');
+        let newsData = document.getElementById('newsPara'); 
+            loadSection.style.display = 'block';
+            genButton.disabled = true;
+            langInput.disabled = true;
+            genButton.style.cursor = 'not-allowed';
+
+        let formData = new FormData(newsData);
+        fetch(`https://apisp.dev2.cicdhosting.com/_dedicated/dwd/`, {
+            method: 'POST',
+            body: formData,
+        })
+        .then(data => data.json())
+        .then(data => {
+            // if (data === 200) {
+            //     counter++;
+            // } else {
+                // formSection genButton brightness-50
+                console.log(data)
+            // }
+            let newsData = data.choices[0].message.content;
+            if(newsData){
+                document.getElementById('formSection').style.display = 'block';
+                loadSection.style.display = 'none';
+                genButton.disabled = false;
+                genButton.style.cursor = 'pointer';
+                langInput.disabled = false;
+                // document.getElementById('loadingSection').classList.remove = 'brightness-50';
+                // document.getElementById('genButton').classList.remove = 'disabled';
+            }
+            let jsonObject = JSON.parse(newsData);
+            document.getElementById('title').value = jsonObject.title;
+            document.getElementById('slug').value = jsonObject.title;
+            document.getElementById('heading').value = jsonObject.heading;
+            document.getElementById('meta_title').value = jsonObject.meta_title;
+            document.getElementById('meta_description').value = jsonObject.meta_description;
+            document.getElementById('in_brief').value = jsonObject.short_description;
+            document.getElementById('content').value = jsonObject.long_description;
+            if(jsonObject.long_description){
+                // document.getElementById('content').value = jsonObject.long_description;
+            }
+        })  
+        .catch(error => {
+            console.error('Error occurred', error);
+        });
+    }
+    function slugify(text) {
+        return text.toString().toLowerCase()
+            .replace(/\s+/g, '-')        // Replace spaces with -
+            .replace(/[^\w-]+/g, '')     // Remove all non-word characters
+            .replace(/--+/g, '-')        // Replace multiple - with single -
+            .replace(/^-+/, '')          // Trim - from start of text
+            .replace(/-+$/, '');         // Trim - from end of text
+    }
+
+    function updateSlug() {
+        const titleInput = document.getElementById('slug');
+        const slugInput = document.getElementById('slug');
+        const titleValue = titleInput.value;
+        slugInput.value = slugify(titleValue);
+    }
+
+    function callApi(event) {
+        event.preventDefault();
+        let slugValue = document.getElementById('slug').value;
+        let newsData = document.getElementById('newsForm');
+        let formData = new FormData(newsData);
+        fetch(`https://apisp.dev2.cicdhosting.com/news/add-news/?action=save`, {
+            method: 'POST',
+            body: formData,
+        })
+        .then(data => data.json())
+        .then(data => {
+            if (data.success === true) {
+                window.location.href= `/add-file?slug=${slugValue}`
+                // console.log(slugValue)
+                console.log('Form Data Submitted Successfully');
+            } else {
+                console.log('Data Submit Failed');
+            }
+            console.log(data);
+        })
+        .catch(error => {
+            console.error('Error occurred', error);
+        });
+    }
+</script>
+<style>
+    #loadingSection{
+        position: fixed;
+        top: 50%;
+        left: 50%;
+        transform: translate(-50%, -50%);
+    }
+    .load-aimate{
+        width: 60px;
+        height: 60px;
+        border-radius: 50%;
+        border-left: 5px solid #580a0a;
+        border-right: 5px solid #580a0a;
+        border-bottom: 5px solid #580a0a;
+        border-top: 5px solid #FFFFFF;
+        background-color: #FFFFFF;
+    }
+</style>
\ No newline at end of file