// All portfolio content as data — easy to edit
const PROFILE = {
  name: "Zohaib Arshad",
  handle: "zohaib-01",
  role: "Frontend Engineer",
  location: "Chemnitz, Germany",
  email: "zohaibarshaddev@gmail.com",
  phone: "+49 151 24305599",
  linkedin: "linkedin.com/in/zohaib-arshad-dev",
  github: "github.com/zohaib-01",
  yoe: 5,
  status: "Open to senior frontend roles",
  tagline: "I build accessible, performant interfaces for the web.",
  summary: [
    "Frontend Engineer with 5+ years building scalable, accessible web applications for enterprise SaaS and eCommerce.",
    "Comfortable owning features end-to-end — from technical scoping to production — and contributing to design systems, performance, and accessibility work across product surfaces.",
    "Strong collaborator across product, design, and backend teams, with a quality-first mindset extended to how I use AI tools in daily development.",
  ],
};

const EXPERIENCE = [
  {
    hash: "a1f9c02",
    branch: "main",
    company: "Staffbase",
    role: "Frontend Engineer",
    where: "Chemnitz, Germany",
    period: "2022 — Present",
    tags: ["React", "TypeScript", "Tailwind", "Storybook", "WebSockets"],
    bullets: [
      { b: "Owned end-to-end frontend delivery", t: " of complex, high-traffic features on Staffbase's enterprise employee experience platform — scoping, architecture, and production release." },
      { b: "Led the chat migration", t: " from a microfrontend to a fully integrated frontend module, partnering with backend on REST + WebSocket real-time communication." },
      { b: "Contributed to the design system", t: " (React/TS + Tailwind + Storybook), standardising UI patterns across squads and cutting design-to-dev cycle time by ~25%." },
      { b: "Drove test quality to 80%+ coverage", t: " across owned modules with unit, integration, and E2E testing; applied Copilot/Claude responsibly to accelerate coverage." },
      { b: "Improved performance & WCAG 2.1 accessibility", t: " — lazy loading, bundle splitting, DOM optimisation, keyboard navigation, focus management, and screen-reader support." },
      { b: "Defined component architecture patterns", t: " in technical design discussions and authored documentation adopted by the wider engineering team." },
    ],
  },
  {
    hash: "7b2d11e",
    branch: "ecommerce",
    company: "Westt",
    role: "Web Developer",
    where: "Remote",
    period: "2020 — 2021",
    tags: ["JavaScript", "REST", "Axios", "Integromat"],
    bullets: [
      { b: "Built performant, responsive storefronts", t: " end-to-end, contributing to a ~15% uplift in user engagement." },
      { b: "Integrated multiple marketplaces", t: " (Linnworks, Plenty Markets, third-party APIs) via Axios for real-time inventory sync and fewer fulfilment errors." },
      { b: "Automated operational workflows", t: " in Integromat (Make), cutting manual processing time by an estimated 40%." },
    ],
  },
  {
    hash: "3e5a08c",
    branch: "fullstack",
    company: "ARASCA",
    role: "Full Stack Developer",
    where: "Dubai, UAE",
    period: "2019 — 2020",
    tags: ["HTML5", "CSS3", "JS (ES6+)", "SQL"],
    bullets: [
      { b: "Owned frontend for the eCommerce store and corporate site", t: " — cross-browser compatible, fully responsive interfaces from design to production." },
      { b: "Optimised relational databases and reporting pipelines", t: " — reduced report generation time by ~30% through query tuning and data model improvements." },
    ],
  },
];

const SKILLS = [
  { key: "languages", items: ["TypeScript", "JavaScript (ES6+)", "HTML5", "CSS3"] },
  { key: "frameworks", items: ["React", "Next.js", "Tailwind CSS"] },
  { key: "state", items: ["Redux", "Zustand", "TanStack Query", "Context API", "Zod"] },
  { key: "testing", items: ["Jest", "Vitest", "Playwright", "React Testing Library", "E2E"] },
  { key: "apis", items: ["REST", "Axios", "WebSockets", "SPA architecture"] },
  { key: "tooling", items: ["Git", "GitHub Actions", "Vite", "Webpack", "npm/yarn", "Docker (basic)", "Confluence"] },
  { key: "ai", items: ["GitHub Copilot", "Claude", "test generation", "code review", "workflow optimisation"] },
  { key: "security", items: ["XSS / CSRF prevention", "input validation", "CSP", "OAuth flows"] },
  { key: "design", items: ["Figma", "design systems", "component libraries", "WCAG 2.1 / a11y", "responsive design"] },
];

const PROJECTS = [
  {
    name: "chat-module",
    label: "module",
    desc: "Migration of Staffbase's chat from a microfrontend to a fully integrated module — real-time messaging over WebSockets, optimistic UI, threaded reads.",
    tags: ["React", "TypeScript", "WebSockets", "REST"],
    stats: [{ k: "perf", v: "+18%" }, { k: "users", v: "enterprise" }],
  },
  {
    name: "design-system",
    label: "library",
    desc: "Contributions to the company UI component library — primitives, patterns, Storybook stories, accessibility audits. Reduced design-to-dev cycle ~25%.",
    tags: ["Storybook", "Tailwind", "a11y"],
    stats: [{ k: "cycle", v: "−25%" }, { k: "coverage", v: "80%+" }],
  },
  {
    name: "marketplace-sync",
    label: "service",
    desc: "Integration layer between Linnworks, Plenty Markets and storefronts — real-time inventory sync and fulfilment error reduction.",
    tags: ["Node", "Axios", "Integromat"],
    stats: [{ k: "errors", v: "−40%" }, { k: "engagement", v: "+15%" }],
  },
  {
    name: "a11y-audit",
    label: "initiative",
    desc: "WCAG 2.1 audit & remediation across key product surfaces — keyboard nav, focus management, screen-reader semantics, contrast.",
    tags: ["a11y", "WCAG 2.1", "audit"],
    stats: [{ k: "score", v: "AA" }, { k: "issues", v: "120+ fixed" }],
  },
];

const CONTACT = [
  { lbl: "email", val: "zohaibarshaddev@gmail.com", href: "mailto:zohaibarshaddev@gmail.com", icon: "@" },
  { lbl: "github", val: "github.com/zohaib-01", href: "https://github.com/zohaib-01", icon: "{ }" },
  { lbl: "linkedin", val: "linkedin.com/in/zohaib-arshad-dev", href: "https://linkedin.com/in/zohaib-arshad-dev", icon: "in" },
  { lbl: "phone", val: "+49 151 24305599", href: "tel:+4915124305599", icon: "☏" },
];

const EDUCATION = [
  { degree: "M.Sc. Web Engineering", school: "Technische Universität Chemnitz", where: "Germany", period: "2021 — 2025" },
  { degree: "B.Sc. Computer Science", school: "Virtual University of Pakistan", where: "Pakistan", period: "2014 — 2018" },
];

const LANGUAGES = [
  { name: "English", level: "Professional working", pct: 92 },
  { name: "Urdu", level: "Native", pct: 100 },
  { name: "German", level: "Beginner (A1)", pct: 28 },
];

const FILES = [
  { id: "readme", name: "README.md", icon: "md", group: "root" },
  { id: "about", name: "about.ts", icon: "ts", group: "src" },
  { id: "experience", name: "experience.log", icon: "log", group: "src" },
  { id: "skills", name: "skills.json", icon: "json", group: "src" },
  { id: "projects", name: "projects.tsx", icon: "tsx", group: "src" },
  { id: "education", name: "education.yml", icon: "yml", group: "src" },
  { id: "contact", name: "contact.sh", icon: "sh", group: "root" },
];

Object.assign(window, { PROFILE, EXPERIENCE, SKILLS, PROJECTS, CONTACT, EDUCATION, LANGUAGES, FILES });