feat: Responsive calendar, post editor, analytics & settings (Phases 2-4)

[travelsatsargentina]

👋 Hey Postiz team!

Continuing our responsive design work from PR #1223 (Phase 1 - Sidebar + Navigation).

What this PR does

Mobile Calendar List View

• Desktop: Zero changes — grid calendar works exactly as before
• Mobile (≤768px): Replaces the 8-column grid with a vertical list view
  • Posts grouped by day with clear day headers
  • Each post shows time, preview text, platform icons, and status
  • "Today" indicator on current day
  • All post actions accessible (edit, delete, duplicate, stats)
  • Drag-and-drop gracefully disabled on touch (tap-to-edit instead)

Time Table Fix

• Changed max-w-[400px] to responsive with mobile:max-w-full

New Files

• apps/frontend/src/components/hooks/use-mobile.tsx — reusable viewport detection hook

Design Principles

• ✅ Desktop completely untouched
• ✅ Touch-optimized interactions
• ✅ No horizontal scrolling on mobile
• ✅ Tailwind utilities only, no custom CSS

Part of our responsive design contribution series. More phases coming!

Contributed by the Travelsats team (@travelsatsargentina) 🇦🇷

[vercel]

Someone is attempting to deploy a commit to the Listinai Team on Vercel.

A member of the Team first needs to authorize it.

[sentry]

Bug: The useMobile hook causes a React hydration mismatch on mobile devices by initializing isMobile to false on the server and only updating it on the client after hydration.
_{Severity: MEDIUM}

Suggested Fix

To prevent the hydration mismatch, ensure the component renders the same content on the server and the initial client render. Defer setting the isMobile state until the component has mounted. One way is to introduce another state variable to track mounting, and only set isMobile based on window.innerWidth inside a useEffect hook. This ensures the mobile-specific view is rendered only after the initial hydration is complete.

Prompt for AI Agent

Review the code at the location below. A potential bug has been identified by an AI
agent.
Verify if this is a real issue. If it is, propose a fix; if not, explain why it's not
valid.

Location: apps/frontend/src/components/hooks/use-mobile.tsx#L10

Potential issue: The `useMobile` hook initializes its state with `const [isMobile,
setIsMobile] = useState(false)`. During server-side rendering (SSR), this causes the
desktop version of components like `WeekView` and `MonthView` to be rendered. On a
mobile device, after the initial client-side hydration, a `useEffect` hook runs and
updates `isMobile` to `true` based on `window.innerWidth`. This change triggers a
re-render with a different component tree (e.g., `MobileWeekView`), causing a React
hydration mismatch error. This results in a visual flash as the UI switches from the
desktop to the mobile layout and can lead to temporarily broken user interactions on
initial page load for mobile users.

_{Did we get this right? 👍 / 👎 to inform future reviews.}

[AminDhouib]

Hi @travelsatsargentina thank you for putting work onto this! I hope this work gets prioritized. Mobile capabilities would be very great for Postiz