const fs = require('fs');

let content = fs.readFileSync('frontend/src/pages/dashboard.tsx', 'utf8');

const replacement = `
    const isAdmin = hasPermission(currentUser, 'UPDATE_USERS');

    async function loadData() {
        if (!currentUser) return;

        if (!isAdmin) {
             // For regular employees, we just want to load their own logs
             axios.get('/job_logs/count?employee=' + currentUser.id).then((res) => setJob_logs(res.data.count)).catch(() => setJob_logs(0));
             return;
        }

        const entities = ['users','roles','permissions','customers','vehicles','pay_types','employee_pay_types','chemical_products','job_logs','job_chemical_usages','payroll_runs','payroll_line_items',];
`;

content = content.replace(/async function loadData\(\)\{\n\s*const entities = \['users','roles',/g, replacement);

const replacement2 = `
        {!!rolesWidgets.length && <hr className='my-6  ' />}
        
        {isAdmin ? (
        <div id="dashboard" className='grid grid-cols-1 gap-6 lg:grid-cols-3 mb-6'>
`;

content = content.replace(/\{\!\!rolesWidgets\.length && <hr className='my-6  ' \/>\}\n\s*<div id="dashboard" className='grid grid-cols-1 gap-6 lg:grid-cols-3 mb-6'>/g, replacement2);

const replacement3 = `
            </Link>}
          
          
        </div>
        ) : (
          <div id="dashboard" className="grid grid-cols-1 gap-6 lg:grid-cols-3 mb-6">
            <Link href={'/my-logs'}>
                <div className={"dark:bg-dark-900 dark:border-dark-700 p-6 " + (corners !== 'rounded-full' ? corners : 'rounded-3xl') + " " + cardsStyle}>
                    <div className="flex justify-between align-center">
                        <div>
                            <div className="text-lg leading-tight text-gray-500 dark:text-gray-400">
                              My Logs
                            </div>
                            <div className="text-3xl leading-tight font-semibold">
                                {job_logs}
                            </div>
                        </div>
                        <div>
                            <BaseIcon className={iconsColor} w="w-16" h="h-16" size={48} path={icon.mdiClipboardTextClock} />
                        </div>
                    </div>
                </div>
            </Link>
          </div>
        )}
      </SectionMain>
`;

content = content.replace(/<\/Link>\}\n\s*<\/div>\n\s*<\/SectionMain>/g, replacement3);

fs.writeFileSync('frontend/src/pages/dashboard.tsx', content);
console.log("Patched dashboard.tsx");