translate this and add the translation to en.json and ar.json heres the files by the way do not change any javascript at all, {
  "sas_radius_pro_dashboard": "لوحة مراقبة Sas Radius Pro",
  "logo": "شعار",
  "user_profile": "ملف المستخدم",
  "search_placeholder": "بحث...",
  
  "traffic_report": "تقرير المرور",
  "source": "المصدر:",
  "wikipedia_com": "ويكيبيديا.كوم",
  "jan": "يناير",
  "feb": "فبراير",
  "mar": "مارس",
  "apr": "أبريل",
  "may": "مايو",
  "jun": "يونيو",
  "jul": "يوليو",
  "aug": "أغسطس",
  "sep": "سبتمبر",
  "oct": "أكتوبر",
  "nov": "نوفمبر",
  "dec": "ديسمبر",
  "temperature_celsius": "درجة الحرارة (°م)",
  "reggane": "رجانة",
  "search": "بحث",
  "home": "الرئيسية",
  
  "client_list_found_count_entries": "قائمة العملاء | تم العثور على :count مدخلات",
  "template_list_found_count_entries": "قائمة القوالب | تم العثور على :count مدخلات",
  "message_settings": "إعدادات الرسائل",
  "country_code": "كود الدولة",
  "egypt": "مصر",
  "libya": "ليبيا",
  "iraq": "العراق",
  "uae": "الإمارات",
  "saudi_arabia": "السعودية",
  "messaging_service": "خدمة الرسائل",
  "additional_keys_you_can_use": "مفاتيح إضافية يمكنك استخدامها",
  "profile": "البروفايل",
  "expiration_date": "تاريخ الانتهاء",
  "username": "اسم المستخدم",
  "first_name": "الاسم الأول",
  "usage_example": "مثال للاستخدام",
  "hello": "مرحبا",
  "the": "ال",
  "monthly_package_activated": "باقة شهرية تم تفعيلها وسوف تنتهي في",
  "client_receive_like_this": "سوف يتلقى العميل ذلك بهذا الشكل",
  "hello_yasser_package_activated": "مرحبا ياسر، تم تفعيل باقة 50 جيجابايت الشهرية وسوف تنتهي في",
  "activation_message": "رسالة التفعيل",
  "expiry_message": "رسالة انتهاء الصلاحية",
  "about_to_expire_subscription": "اشتراك على وشك الانتهاء",
  "upon_subscription_activation": "عند تفعيل الاشتراك",
  "upon_package_renewal": "عند تجديد الباقة",
  "upon_package_change": "عند تغيير الباقة",
  "upon_client_deposit": "عند إيداع العميل",
  "upon_withdrawal_from_client_balance": "عند السحب من رصيد العميل",
  "upon_editing_client_data": "عند تعديل بيانات العميل",
  "upon_adding_or_removing_consumption_capacities_gb_for_client": "عند إضافة أو إزالة سعات استهلاك (جيجابايت) للعميل",
  "upon_client_deletion": "عند حذف العميل",
  "upon_manager_login": "عند تسجيل دخول المدير",
  "upon_manager_deposit": "عند إيداع المدير",
  "upon_withdrawal_from_manager_balance": "عند السحب من رصيد المدير",
  "aggressive_messaging": "الرسائل العنيفة",
  "operation_number": "رقم العملية",
  "account_symbol": "رمز الحساب",
  "last_name": "الاسم الأخير",
  "package": "باقة",
  "balance": "الرصيد",
  "return_to_menu": "العودة إلى القائمة",
  "card_activation_confirmation_message": "رسالة تأكيد تفعيل البطاقة",
  "insufficient_balance_for_package_activation_message": "رصيد غير كافٍ لتفعيل الباقة",
  "package_activation_data_message": "رسالة بيانات تفعيل الباقة",
  "package_activation_confirmation_message": "رسالة تأكيد تفعيل الباقة",
  "enable_card_charging": "تمكين شحن البطاقة",
  "menu_message": "رسالة القائمة",
  "successful_card_activation_message": "رسالة تفعيل البطاقة الناجحة",
  "card_entry_request_message": "رسالة طلب إدخال البطاقة",
  "bot_preferences": "تفضيلات الروبوت",
  "message_sent_successfully": "تم إرسال الرسالة بنجاح!",
  "operations": "العمليات",
  "add": "إضافة",
  "view": "عرض",
  "send_message": "إرسال رسالة",
  "change_group": "تغيير المجموعة",
  "Sas Radius Pro Dashboard": "لوحة مراقبة Sas Radius Pro",
  "Logo": "شعار",
  "Search...": "بحث...",
  "User Profile": "ملف المستخدم",
  "Home": "الرئيسية",
  "Messages": "الرسائل",
  "Message List | Found :count entries": "قائمة الرسائل | تم العثور على :count مدخلات",
  "Operations": "العمليات",
  "Add": "إضافة",
  "Delete": "حذف",
  "Change Name": "تغيير الاسم",
  "Reload": "إعادة تحميل",
  "Message": "الرسالة",
  "From": "من",
  "To": "إلى",
  "Creation Date": "تاريخ الإنشاء",
  "defaultPhone": "الهاتف الافتراضي",
  "Groups": "المجموعات",
  "Choose Group": "اختر المجموعة",
  "Select": "اختر",
  "All Clients": "كل العملاء",
  "Confirm": "تأكيد",
  "Delete Confirmation": "تأكيد الحذف",
  "Are you sure you want to delete these messages?": "هل أنت متأكد أنك تريد حذف هذه الرسائل؟",
  "Cancel": "إلغاء",


  "reload": "إعادة تحميل",
  "filter": "تصفية",
  "template": "القالب",
  "message": "الرسالة",
  "creation_date": "تاريخ الإنشاء",
  "name": "الاسم",
  "group": "المجموعة",
  "phone": "الهاتف",
  "phones": "الهواتف",
  "notes": "ملاحظات",
  "delete": "حذف",
  "delete_confirmation": "تأكيد الحذف",
  "are_you_sure_you_want_to_delete_the_selected_groups": "هل أنت متأكد من حذف المجموعات المحددة؟",
  "confirm": "موافق",
  "cancel": "إلغاء",
  "profile_data_sent_successfully": "تم إرسال بيانات الملف الشخصي بنجاح:",
  "error_sending_profile_data": "خطأ في إرسال بيانات الملف الشخصي:",
  "button_aview_not_found": "لم يتم العثور على الزر بمعرف \"aview\".",
  "modal_element_not_provided": "لم يتم توفير عنصر المودال.",
  "delete_confirmation_modal_not_found": "لم يتم العثور على العنصر بمعرف \"deleteConfirmationModal\".",
  "confirm_delete_not_found": "لم يتم العثور على العنصر بمعرف \"confirmDelete\".",
  "delete_button_not_found": "لم يتم العثور على العنصر بمعرف \"deletebtn\".",
  "select_all_checkbox_not_found": "لم يتم العثور على العنصر بمعرف \"selectAllcheckbox\".",
  "no_checkboxes_found": "لم يتم العثور على مربعات اختيار.",
  "please_select_at_least_one_client_to_delete": "يرجى تحديد عميل واحد على الأقل للحذف.",
  "selected_clients_deleted": "تم حذف العملاء المحددين بنجاح.",
  "error_deleting_clients": "خطأ في حذف العملاء: ",
  "error_deleting_clients_generic": "حدث خطأ أثناء حذف العملاء.",
  "no_group": "لا توجد مجموعة",
  "default_selected": "تم تحديد الافتراضي",
  "unexpected_value_setting_default": "قيمة غير متوقعة، سيتم التعيين على الافتراضي",
  "enable_account_balance_display": "تمكين عرض رصيد الحساب",
  "card_charging": "شحن البطاقة",
  "operation_confirmation": "تأكيد العملية",
  "settings_saved_successfully": "تم حفظ الإعدادات بنجاح!",
  "an_error_occurred": "حدث خطأ:",
  "unexpected_error_occurred": "حدث خطأ غير متوقع.",
  "operation_data_sent_successfully": "تم إرسال بيانات العملية بنجاح:",
  "error_sending_operation_data": "خطأ في إرسال بيانات العملية:",
  "name_input_not_in_focus": "حقل الاسم ليس في التركيز.",
  "submitting_data": "جارٍ إرسال البيانات:",
  "general": "عام",
  
  "add_client": "إضافة عميل",
  "delete_clients": "حذف العملاء",
  "add_phone": "إضافة هاتف",
  "phone_number": "رقم الهاتف",
  
  "attach_image": "إرفاق صورة",
  "enter_phone_number_here": "أدخل رقم الهاتف هنا",
  "enter_your_message_here": "أدخل رسالتك هنا",
  "choose_phone_number_to_send_message": "اختر رقم هاتف محدد لإرسال الرسالة",
  "enter_session": "أدخل الجلسة",
  "choose_session_to_send_messages_from": "اختر جلسة محددة لإرسال الرسائل منها",
  "choose_group_as_sender": "اختر مجموعة لاستخدامها كمرسل",
  "main_phone_only": "الهاتف الرئيسي فقط",
  "choose_phone_number": "اختر رقم هاتف",
  "choose_group": "اختر مجموعة",
  "enter_message_to_use": "أدخل الرسالة التي سيتم استخدامها",
  "confirm_send_message": "هل أنت متأكد من أنك تريد إرسال الرسالة؟",
  "template_deleted_successfully": "تم حذف القالب بنجاح.",
  "error_deleting_template": "حدث خطأ أثناء حذف القالب. يرجى المحاولة مرة أخرى.",
  "template_updated_successfully": "تم تعديل القالب بنجاح.",
  "error_editing_template": "حدث خطأ أثناء تعديل القالب. يرجى المحاولة مرة أخرى.",
  
  "add_template": "إضافة قالب",
  "description": "الوصف",
  "additions": "إضافات",
  "confirm_add_new_template": "هل أنت متأكد من إضافة القالب الجديد؟",
  "please_fill_all_required_fields": "يرجى ملء جميع الحقول المطلوبة.",
  
  "following_data_section_title": "إدخال البيانات التالية",
  "alerts_country_code_info": "كود الدولة يُستخدم فقط لتحديد أرقام الهواتف ضمن بيانات عملاء SAS.",
  "labels_save_by_group": "حفظ حسب المجموعة",
  "labels_country_code": "كود الدولة",
  "placeholders_save_by_group": "احفظ حسب المجموعة",
  "placeholders_country_code": "كود الدولة",
  "tables_sas_radius_list_found": "قائمة Sas Radius | تم العثور على :count مدخلات",
  "tables_sas_link": "رابط Sas",
  
  "remaining_days": "الأيام المتبقية",
  "percentage_days_remaining": "نسبة ما تبقى من أيام",
  "the_better": "الأفضل",
  "daily_points_consumption": "استهلاك النقاط اليومية",
  "percentage_points_consumed_today": "نسبة ما تم استهلاكه من نقاط اليوم",
  "the_lower_better": "الأقل أفضل",
  "customers": "العملاء",
  "groups": "المجموعات",
  "messages": "الرسائل",
  "todays_messages": "رسائل اليوم",
  "session_status": "حالة الجلسة",
  "this_month_messages": "رسائل الشهر الحالي",

  "monthly": "شهري",
  "daily": "يومي",
  
  "change_name": "تغيير الاسم",
  "all_clients": "كل العملاء",
  
  "subscriber_added_successfully": "تم إضافة المشترك بنجاح:",
  "error_adding_subscriber": "خطأ في إضافة المشترك:",
  "template_added_successfully": "تم إضافة القالب بنجاح:",
  "error_adding_template": "خطأ في إضافة القالب:",
  
  "Please select at least one client to delete.": "يرجى تحديد عميل واحد على الأقل للحذف.",
  "Selected clients have been successfully deleted.": "تم حذف العملاء المحددين بنجاح.",
  "An error occurred while deleting clients. Please try again.": "حدث خطأ أثناء حذف العملاء. يرجى المحاولة مرة أخرى.",
  "An unexpected error occurred. Please try again.": "حدث خطأ غير متوقع. يرجى المحاولة مرة أخرى."
} {
  "sas_radius_pro_dashboard": "Sas Radius Pro Dashboard",
  "logo": "Logo",
  "user_profile": "User Profile",
  "search_placeholder": "Search...",
  
  "traffic_report": "Traffic Report",
  "source": "Source:",
  "wikipedia_com": "Wikipedia.com",
  "jan": "Jan",
  "feb": "Feb",
  "mar": "Mar",
  "apr": "Apr",
  "may": "May",
  "jun": "Jun",
  "jul": "Jul",
  "aug": "Aug",
  "sep": "Sep",
  "oct": "Oct",
  "nov": "Nov",
  "dec": "Dec",
  "temperature_celsius": "Temperature (°C)",
  "reggane": "Reggane",
  "search": "Search",
  "home": "Home",

  "client_list_found_count_entries": "Client List | Found :count entries",
  "template_list_found_count_entries": "Template List | Found :count entries",
  "message_settings": "Message Settings",
  "country_code": "Country Code",
  "egypt": "Egypt",
  "libya": "Libya",
  "iraq": "Iraq",
  "uae": "UAE",
  "saudi_arabia": "Saudi Arabia",
  "messaging_service": "Messaging Service",
  "additional_keys_you_can_use": "Additional keys you can use",
  "profile": "Profile",
  "expiration_date": "Expiration Date",
  "username": "Username",
  "first_name": "First Name",
  "usage_example": "Usage Example",
  "hello": "Hello",
  "the": "the",
  "monthly_package_activated": "The monthly package has been activated and will expire on",
  "client_receive_like_this": "The client will receive it like this",
  "hello_yasser_package_activated": "Hello Yasser, the 50GB monthly package has been activated and will expire on",
  "activation_message": "Activation Message",
  "expiry_message": "Expiry Message",
  "about_to_expire_subscription": "About to Expire Subscription",
  "upon_subscription_activation": "Upon Subscription Activation",
  "upon_package_renewal": "Upon Package Renewal",
  "upon_package_change": "Upon Package Change",
  "upon_client_deposit": "Upon Client Deposit",
  "upon_withdrawal_from_client_balance": "Upon Withdrawal from Client Balance",
  "upon_editing_client_data": "Upon Editing Client Data",
  "upon_adding_or_removing_consumption_capacities_gb_for_client": "Upon Adding or Removing Consumption Capacities (GB) for Client",
  "upon_client_deletion": "Upon Client Deletion",
  "upon_manager_login": "Upon Manager Login",
  "upon_manager_deposit": "Upon Manager Deposit",
  "upon_withdrawal_from_manager_balance": "Upon Withdrawal from Manager Balance",
  "aggressive_messaging": "Aggressive Messaging",
  "operation_number": "Operation Number",
  "account_symbol": "Account Symbol",
  "last_name": "Last Name",
  "package": "Package",
  "balance": "Balance",
  "return_to_menu": "Return to Menu",
  "card_activation_confirmation_message": "Card Activation Confirmation Message",
  "insufficient_balance_for_package_activation_message": "Insufficient Balance for Package Activation Message",
  "package_activation_data_message": "Package Activation Data Message",
  "package_activation_confirmation_message": "Package Activation Confirmation Message",
  "enable_card_charging": "Enable Card Charging",
  "menu_message": "Menu Message",
  "successful_card_activation_message": "Successful Card Activation Message",
  "card_entry_request_message": "Card Entry Request Message",
  "bot_preferences": "Bot Preferences",
  "message_sent_successfully": "Message Sent Successfully!",
  "operations": "Operations",
  "add": "Add",
  "view": "View",
  "send_message": "Send Message",
  "change_group": "Change Group",
  "reload": "Reload",
  "filter": "Filter",
  "template": "Template",
  "message": "Message",
  "creation_date": "Creation Date",
  "name": "Name",
  "group": "Group",
  "phone": "Phone",
  "phones": "Phones",
  "notes": "Notes",
  "delete": "Delete",
  "delete_confirmation": "Delete Confirmation",
  "are_you_sure_you_want_to_delete_the_selected_groups": "Are you sure you want to delete the selected groups?",
  "confirm": "Confirm",
  "cancel": "Cancel",
  "profile_data_sent_successfully": "Profile data sent successfully:",
  "error_sending_profile_data": "Error sending profile data:",
  "button_aview_not_found": "Button with id \"aview\" not found.",
  "modal_element_not_provided": "Modal element not provided.",
  "delete_confirmation_modal_not_found": "Element with ID \"deleteConfirmationModal\" not found.",
  "confirm_delete_not_found": "Element with ID \"confirmDelete\" not found.",
  "delete_button_not_found": "Element with ID \"deletebtn\" not found.",
  "select_all_checkbox_not_found": "Element with ID \"selectAllcheckbox\" not found.",
  "no_checkboxes_found": "No checkboxes found.",
  "please_select_at_least_one_client_to_delete": "Please select at least one client to delete.",
  "selected_clients_deleted": "Selected clients have been successfully deleted.",
  "error_deleting_clients": "Error deleting clients: ",
  "error_deleting_clients_generic": "An error occurred while deleting clients.",
  "no_group": "No Group",
  "default_selected": "Default selected",
  "unexpected_value_setting_default": "Unexpected value, setting to default",
  "enable_account_balance_display": "Enable Account Balance Display",
  "card_charging": "Card Charging",
  "operation_confirmation": "Operation Confirmation",
  "settings_saved_successfully": "Settings have been saved successfully!",
  "an_error_occurred": "An error occurred:",
  "unexpected_error_occurred": "An unexpected error occurred.",
  "operation_data_sent_successfully": "Operation data sent successfully:",
  "error_sending_operation_data": "Error in sending operation data:",
  "name_input_not_in_focus": "Name input is not in focus.",
  "submitting_data": "Submitting data:",
  "general": "General",
  
  "add_client": "Add Client",
  "delete_clients": "Delete Clients",
  "add_phone": "Add Phone",
  "phone_number": "Phone Number",
  
  "attach_image": "Attach Image",
  "enter_phone_number_here": "Enter phone number here",
  "enter_your_message_here": "Enter your message here",
  "choose_phone_number_to_send_message": "Choose a specific phone number to send the message",
  "enter_session": "Enter Session",
  "choose_session_to_send_messages_from": "Choose a specific session to send messages from",
  "choose_group_as_sender": "Choose a group to be used as a sender",
  "main_phone_only": "Main phone only",
  "choose_phone_number": "Choose a phone number",
  "choose_group": "Choose a group",
  "enter_message_to_use": "Enter the message to be used",
  "confirm_send_message": "Are you sure you want to send the message?",
  "template_deleted_successfully": "Template has been successfully deleted.",
  "error_deleting_template": "An error occurred while deleting the template. Please try again.",
  "template_updated_successfully": "Template has been successfully updated.",
  "error_editing_template": "An error occurred while editing the template. Please try again.",
  
  "add_template": "Add Template",
  "description": "Description",
  "additions": "Additions",
  "confirm_add_new_template": "Are you sure you want to add the new template?",
  "please_fill_all_required_fields": "Please fill all required fields.",
  
  "following_data_section_title": "Enter the following data",
  "alerts_country_code_info": "Country code is used only to identify phone numbers within SAS customers data.",
  "labels_save_by_group": "Save according to group",
  "labels_country_code": "Country Code",
  "placeholders_save_by_group": "Save according to group",
  "placeholders_country_code": "Country Code",
  "tables_sas_radius_list_found": "Client List | Found :count entries",
  "tables_sas_link": "Sas Link",
  
  "remaining_days": "Remaining Days",
  "percentage_days_remaining": "Percentage of Days Remaining",
  "the_better": "The Better",
  "daily_points_consumption": "Daily Points Consumption",
  "percentage_points_consumed_today": "Percentage of Points Consumed Today",
  "the_lower_better": "The Lower, The Better",
  "customers": "Customers",
  "groups": "Groups",
  "messages": "Messages",
  "todays_messages": "Today's Messages",
  "session_status": "Session Status",
  "this_month_messages": "This Month's Messages",
  "Sas Radius Pro Dashboard": "Sas Radius Pro Dashboard",
  "Logo": "Logo",
  "Search...": "Search...",
  "User Profile": "User Profile",
  "Home": "Home",
  "Messages": "Messages",
  "Message List | Found :count entries": "Message List | Found :count entries",
  "Operations": "Operations",
  "Add": "Add",
  "Delete": "Delete",
  "Change Name": "Change Name",
  "Reload": "Reload",
  "Message": "Message",
  "From": "From",
  "To": "To",
  "Creation Date": "Creation Date",
  "defaultPhone": "Default Phone",
  "Groups": "Groups",
  "Choose Group": "Choose Group",
  "Select": "Select",
  "All Clients": "All Clients",
  "Confirm": "Confirm",
  "Delete Confirmation": "Delete Confirmation",
  "Are you sure you want to delete these messages?": "Are you sure you want to delete these messages?",
  "Cancel": "Cancel",

  "monthly": "Monthly",
  "daily": "Daily",
  
  "change_name": "Change Name",
  "all_clients": "All Clients",
  
  "subscriber_added_successfully": "Subscriber added successfully:",
  "error_adding_subscriber": "Error adding subscriber:",
  "template_added_successfully": "Template added successfully:",
  "error_adding_template": "Error adding template:",
  
  "Please select at least one client to delete.": "Please select at least one client to delete.",
  "Selected clients have been successfully deleted.": "Selected clients have been successfully deleted.",
  "An error occurred while deleting clients. Please try again.": "An error occurred while deleting clients. Please try again.",
  "An unexpected error occurred. Please try again.": "An unexpected error occurred. Please try again."
} <!DOCTYPE html>
<html lang="en">
  <head>
  <meta name="csrf-token" content="{{ csrf_token() }}">
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Sas Radius Pro Dashboard</title>
    <link rel="stylesheet" href="css/style.css" />
    <!-- boostrap -->
    <link rel="stylesheet" href="css/bootstrap.css" />
    <script src="js/bootstrap.js"></script>
    <!-- font awesome -->
    <link
      rel="stylesheet"
      href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css"
      integrity="sha512-iecdLmaskl7CVkqkXNQ/ZH/XLlvWZOJyj7Yy7tcenmpD1ypASozpmT/E0iPtmFIB46ZmdtAc9eNBvH0H/ZpiBw=="
      crossorigin="anonymous"
      referrerpolicy="no-referrer"
    />
    <link
      rel="stylesheet"
      href="https://cdn.datatables.net/1.13.4/css/jquery.dataTables.min.css"
    />
  </head>
  <body>
    <main>
      <div class="overflow_sidebar"></div>
      <!-- start sidebar -->
      <div class="sidebar">
      @include('include.sidebar')

      </div>
      <!-- end sidebar -->

      <div class="content_page">
        <div class="header">
          <div class="left">
            <div class="icon_menu">
              <svg
                xmlns="http://www.w3.org/2000/svg"
                fill="none"
                viewBox="0 0 24 24"
                stroke-width="1.5"
                stroke="currentColor"
                class="w-6 h-6"
              >
                <path
                  stroke-linecap="round"
                  stroke-linejoin="round"
                  d="M3.75 6.75h16.5M3.75 12h16.5m-16.5 5.25h16.5"
                />
              </svg>
            </div>
            <div class="logo_header">
              <img src="images/logo.png" alt="logo" loading="lazy" />
            </div>
            <div class="input_search">
              <input type="text" placeholder="Search..." />
              <svg
                xmlns="http://www.w3.org/2000/svg"
                fill="none"
                viewBox="0 0 24 24"
                stroke-width="1.5"
                stroke="currentColor"
                class="w-6 h-6"
              >
                <path
                  stroke-linecap="round"
                  stroke-linejoin="round"
                  d="M21 21l-5.197-5.197m0 0A7.5 7.5 0 105.196 5.196a7.5 7.5 0 0010.607 10.607z"
                />
              </svg>
            </div>
          </div>
          <div class="right">
            <div class="nav_item">
              <div class="head">
                <img
                  class="lang"
                  src="images/Flag-United-States-of-America.webp"
                  alt="Flag-United-States-of-America"
                  loading="lazy"
                />
              </div>
              <div class="list list1">
                <div class="item">
                  <img
                    src="images/Flag-United-States-of-America.webp"
                    alt="Flag-United-States-of-America"
                    loading="lazy"
                  />
                  <span>English (UK)</span>
                </div>
                <div class="item">
                  <img src="images/ar.png" alt="ar-img" loading="lazy" />
                  <span>Arabic (ar)</span>
                </div>
              </div>
            </div>
            <div class="notfication">
              <div class="head">
                <div class="icon">
                  <svg
                    xmlns="http://www.w3.org/2000/svg"
                    fill="none"
                    viewBox="0 0 24 24"
                    stroke-width="1.5"
                    stroke="currentColor"
                    class="w-6 h-6"
                  >
                    <path
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      d="M14.857 17.082a23.848 23.848 0 005.454-1.31A8.967 8.967 0 0118 9.75v-.7V9A6 6 0 006 9v.75a8.967 8.967 0 01-2.312 6.022c1.733.64 3.56 1.085 5.455 1.31m5.714 0a24.255 24.255 0 01-5.714 0m5.714 0a3 3 0 11-5.714 0M3.124 7.5A8.969 8.969 0 015.292 3m13.416 0a8.969 8.969 0 012.168 4.5"
                    />
                  </svg>
                </div>
              </div>
            </div>
            <div class="nav_item">
              <div class="head">
                <img
                  class="img_profile"
                  src="images/user-1.jpg"
                  alt="user-1"
                  loading="lazy"
                />
              </div>
              @include('include.profile')

            </div>
          </div>
        </div>

        <div class="main_content_tables">
          <div class="conetnt_table">
            <div class="path">
              <span>الرئيسيه</span> /
              <span>المجموعات</span>
            </div>

            <div class="head_table">
              <div class="info">
                <p class="text_details">
                  <i class="fa-solid fa-people-group"></i>
                  قائمة المجموعات | عثر على 4 قيد
                </p>
              </div>

              <div class="input_search">
                <input type="text" placeholder="Search..." />
                <svg
                  xmlns="http://www.w3.org/2000/svg"
                  fill="none"
                  viewBox="0 0 24 24"
                  stroke-width="1.5"
                  stroke="currentColor"
                  class="w-6 h-6"
                >
                  <path
                    stroke-linecap="round"
                    stroke-linejoin="round"
                    d="M21 21l-5.197-5.197m0 0A7.5 7.5 0 105.196 5.196a7.5 7.5 0 0010.607 10.607z"
                  ></path>
                </svg>
              </div>

              <div class="utils">
                <div class="actions_box">
                  <button class="btn_actions">
                    <i class="fa-solid fa-wrench"></i>
                    العمليات
                  </button>

                  <div class="box box_utils">
                    <a href={{route('addmgrp')}} class="item">
                      <i class="fa-solid fa-plus"></i>
                      <span>اضافه</span>
                    </a>
                    <a id='aview'href={{route('prfgrp')}} class="item">
                      <i class="fa-solid fa-eye"></i>
                      <span>عرض</span>
                    </a>
                    <a href={{route('addgrop')}} class="item">
                      <i class="fa-solid fa-envelope"></i>
                      <span>ارسال رساله</span>
                    </a>
                    <div class="item btn_open_model" data-model="1">
                      <i class="fa-solid fa-right-left"></i>
                      <span> نقل عملاء</span>
                    </div>
                    <div class="item">
                      <i class="fa-solid fa-users-slash"></i>
                      <span>حذف عملاء</span>
                    </div>
                    <div class="item">
                      <i class="fa-solid fa-trash"></i>
                      <button id="deletebtn">
                      <span> حذف</span>
                      </button>
                    </div>
                  </div>
                </div>
                <div class="reload">
                  <button class="btn_utils">
                    <i class="fa-solid fa-repeat"></i>
                  </button>
                </div>
                <div class="filter">
                  <button class="btn_utils">
                    <i class="fa-solid fa-filter"></i>
                  </button>
                </div>
              </div>
            </div>

            <div class="container_table">
              <table id="table" class="display" style="width: 100%">
                <thead>
                  <tr>
                    <th>
                      <input type="checkbox" id="selectAll"/>
                    </th>
                    <th>الاسم</th>
                    <th>العملاء</th>
                    <th>ملاحظات</th>
                    <th>تاريخ الانشاء</th>
                  </tr>
                </thead>
                <tbody>
                  @if($allData)
                  @foreach($allData as $data)
                  <tr>
                    <td>
                      <input type="checkbox" />
                    </td>
                    <td>
                      <a href="profile-group.html">{{$data->name}}</a>
                    </td>
                    <td>كل العملاء</td>
                    <td>{{$data->comment}}</td>
                    <td>2023-05-04 13:09:32</td>
                  </tr>
                  @endforeach
                  @endif
                  <tr>
                    <td>
                      <input type="checkbox" />
                    </td>
                    <td>
                      <a href={{route('addmgrp')}}>كل العملاء</a>
                    </td>
                    <td>136</td>
                    <td></td>
                    <td>2023-05-04 13:09:32</td>
                  </tr>
                  <tr>
                    <td>
                      <input type="checkbox" />
                    </td>
                    <td>
                      <a href="profile-group.html">كل العملاء</a>
                    </td>
                    <td>136</td>
                    <td></td>
                    <td>2023-05-04 13:09:32</td>
                  </tr>
                </tbody>
              </table>
            </div>
          </div>
        </div>
      </div>
    </main>

    <!-- start model add group -->
    <div class="overflow"></div>
    <div class="model_poup" data-model="1">
      <div class="content">
        <div class="head">
          <h5 class="title_model">المجموعات</h5>
          <div class="close_model">
            <i class="fa-solid fa-xmark"></i>
          </div>
        </div>
        <form action="">
          <div class="input_item">
            <label for=""> اختر مجموعه</label>
            <select name="" id="">
              <option value=""></option>
              <option value="">كل العملاء</option>
            </select>
          </div>

          <button class="btn_submit">موافق</button>
        </form>
      </div>
    </div>
    <!-- end model add group -->

    <script src="js/model.js"></script>
    <script src="js/tableUtils.js"></script>
    <script src="js/boxs-header.js"></script>
    <script src="js/sidebar.js"></script>
    <script src="https://code.jquery.com/jquery-3.5.1.js"></script>
    <script src="https://cdn.datatables.net/1.13.4/js/jquery.dataTables.min.js"></script>
    <script>

pdata={};      

const selectedPhones = new Set();

function checkSessionStatus() {
    const checkboxes = document.querySelectorAll('tbody input[type="checkbox"]');
    const deleteBtn = document.getElementById('deletebtn');
    const selectAllCheckbox = document.getElementById('selectAll');



    selectAllCheckbox.addEventListener('change', function() {
        checkboxes.forEach(checkbox => {
            checkbox.checked = true;
            const phone = checkbox.closest('tr').cells[1].textContent.trim();
            selectedPhones.add(phone);
        });
        
        setTimeout(() => {
            this.checked = false;
        }, 0);

    });

    checkboxes.forEach((checkbox) => {
        checkbox.addEventListener('change', function() {
            const row = this.closest('tr');
            const phone = row.cells[1].textContent.trim();
           
            if (this.checked) {
                selectedPhones.add(phone);
                const accountName = row.cells[1].textContent.trim();
                const customertype = row.cells[2].textContent.trim();
                const created_at = row.cells[4].textContent.trim();
                const data = {
                    name: accountName,
                    customertype: customertype,
                    created_at: created_at
                };
                fetch('api/data/profile-client-groups', {
                    method: 'post',        
                    headers: {
                        'Content-Type': 'application/json',
                        'X-CSRF-TOKEN': document.querySelector('meta[name="csrf-token"]').getAttribute('content')
                    },
                    body: JSON.stringify(data)
                })
                console.log('Added:', phone, data);
            } else {
                selectedPhones.delete(phone);
                console.log('Removed:', phone);
            }
           
        });
    });

    deleteBtn.addEventListener('click', function() {
        if (selectedPhones.size > 0) {
            deleteSelectedRows();
        }
    });

}

function deleteSelectedRows() {
    console.log('Phones to delete:', Array.from(selectedPhones)); // Debug log
    fetch('/delete-rows-groups', {
        method: 'POST',
        headers: {
            'Content-Type': 'application/json',
            'X-CSRF-TOKEN': document.querySelector('meta[name="csrf-token"]').getAttribute('content')
        },
        body: JSON.stringify({phones: Array.from(selectedPhones)})
    })
    .then(response => response.json())
    .then(data => {
        if (data.success) {
            selectedPhones.forEach(phone => {
                const rows = document.querySelectorAll('tbody tr');
                for (let row of rows) {
                    if (row.cells[1] && row.cells[1].textContent.trim() === phone) {
                        row.remove();
                        break;
                    }
                }
            });
            selectedPhones.clear();
            alert('Selected rows deleted successfully');
        } else {
            alert('Error deleting rows: ' + data.message);
        }
    })
    .catch(error => {
        console.error('Error:', error);
        alert('An error occurred while deleting rows');
    });
}
console.log(pdata);

function sendreqprofile(){
    fetch('/handleprofilegroupdata', {
        method: 'POST',
        headers: {
            'Content-Type': 'application/json',
            'X-CSRF-TOKEN': document.querySelector('meta[name="csrf-token"]').getAttribute('content')
        },
        body: JSON.stringify(pdata)
    })
    .then(response => response.json())
    .then(data => {
        console.log('Profile data sent successfully:', data);
    })
    .catch(error => {
        console.error('Error sending profile data:', error);
    });
}

const viewIdBtn = document.getElementById('aview');
console.log('viewIdBtn:', viewIdBtn); 
if (viewIdBtn) {
    viewIdBtn.addEventListener('click', function() {
        console.log('Button clicked!');
        console.log(pdata);
        sendreqprofile();
    });
} else {
    console.error('Button with id "aview" not found');
}

checkSessionStatus();
      $(document).ready(function () {
        $("#table").DataTable({
          pagingType: "full_numbers",
          scrollX: true,
        });
      });
    </script>
  </body>
</html>
 send me the updated versions of the files