My Policy
Understand any privacy policy before you click 'Accept'
My Policy is an AI-powered web app designed to help users understand complex privacy policies in seconds. By either uploading a PDF or pasting the full policy text, users receive a categorized summary outlining what data is collected, how it's used, who it's shared with, and potential red flags. Emojis give quick insight into which parts are safe, questionable, or concerning. Ideal for anyone who wants to make smarter digital choices without reading through pages of legalese.
Purpose & Use Case
Most users blindly agree to privacy policies without understanding what they're giving up. My Policy helps people slow down and make better-informed decisions by summarizing what data is collected and how it's handled.
The app was inspired by real-world experiences of clicking 'accept' on policies without fully reading them. With increasing concerns around data privacy, this tool empowers users to take control by simplifying the fine print into something they can actually understand.
Development Notes
- Used pdf-parse to convert uploaded PDF files to raw text for analysis.
- Crafted a structured AI prompt to enforce Markdown output with clear categories and emoji markers.
- Saved summary results in sessionStorage to persist across reloads.
- Handled edge cases like missing input, invalid files, or malformed AI responses with try/catch and alerts.
- Styled the UI with Tailwind and shadcn/ui, maintaining clean form layouts with responsive spacing and feedback.
Challenges & Learnings
- AI output in Markdown can break layout if not properly stripped. Added regex filtering to clean results before display.
- Managing dual input modes (PDF vs. text) required clear UX boundaries and conditional validation.
- Deploying with pdf-parse in Next.js 14 involved customizing server settings via `serverExternalPackages` to avoid build issues.
Tech Stack & Architecture
| Category | Technologies |
|---|---|
| Framework | Next.js 14 (App Router) |
| Language | TypeScript |
| Styling | Tailwind CSS, Shadcn/UI |
| PDF Parsing | pdf-parse |
| API Integration | OpenAI GPT-4o |
| State Mngmt | React Hooks, sessionStorage |
| Deployment | Vercel, GitHub |
Key Features
- - Users can upload a privacy policy in PDF form or paste raw text directly into a textarea.
- - Once a PDF is uploaded, text input is disabled to avoid duplication.
- - Users can also clear the uploaded file or text input and switch methods at any time.
- - OpenAI GPT-4o breaks down policies into 5 categories: Personal Data Collected, How Data Is Used, Who Data Is Shared With, Tracking & Analytics, and Red Flags.
- - Uses emoji indicators to highlight safe (🟢), caution (🟡), and dangerous (🔴) sections.
- - Responsive UI with dark mode toggle for accessibility.
- - Live character count and file upload name display for input validation.
- - Progress bar and toast notifications for user feedback during generation.
