Merge pull request #19 from mamertofabian/dev

Dev

.clinerules

@@ -0,0 +1,101 @@
+# Security
+
+## Sensitive Files
+DO NOT read or modify:
+- .env files
+- **/config/secrets.* 
+- **/*.pem
+- Any file containing API keys, tokens, or credentials
+
+## Security Practices
+- Never commit sensitive files
+- Use environment variables for secrets
+- Keep credentials out of logs and output
+
+# Tech Stack Rules
+
+## Framework & Core Technologies
+- Use Svelte v4.x for components
+- Use TypeScript for all .ts and .svelte files
+- Use Vite v4.x as build tool
+- Chrome Extension manifest v3 standards must be followed
+- ESM modules only (type: "module" in package.json)
+
+## TypeScript Standards
+- Strict mode is required
+- No implicit any types
+- Strict null checks enabled
+- Use type annotations for function parameters and returns
+- Follow the path aliases:
+  - Use $lib/* for imports from src/lib
+- Chrome types must be included
+
+## Component Standards
+- All Svelte components must use TypeScript
+- Follow Svelte best practices for reactivity
+- Keep components focused and single-responsibility
+- Create modular components:
+  - Break down complex UIs into smaller, reusable components
+  - Extract repeated patterns into shared components
+  - Keep component dependencies minimal and explicit
+  - Use composition over inheritance
+  - Maintain clear component interfaces with proper prop types
+- Use Svelte's built-in state management
+- Props must be properly typed
+
+## Styling Standards
+- Use TailwindCSS for styling
+- Follow the custom theme system defined in tailwind.config.js
+- Use CSS variables for theme colors
+- Maintain dark mode compatibility
+- Use container queries appropriately
+- Follow the defined border radius system
+
+## Code Quality
+- Maximum 300 lines of code per file
+- ESLint rules must be followed:
+  - No unused variables (except prefixed with _)
+  - Warn on any usage
+  - No console.log (only console.warn/error allowed)
+  - Follow svelte-eslint-parser rules
+- Prettier formatting is required:
+  - 2 space indentation
+  - Single quotes
+  - 100 character line length
+  - ES5 trailing commas
+  - Svelte-specific formatting
+
+## Build & Structure
+- Follow the defined Vite build configuration
+- Maintain separate background/content scripts
+- Use proper chunk splitting
+- Keep source maps in development
+- Assets must be in the assets directory
+- Follow the defined output structure
+
+## Dependencies
+- No conflicting Svelte versions
+- Keep dependencies up to date but pin versions
+- Prefer official Svelte integrations
+- Use bits-ui for UI components
+- Use lucide-svelte for icons
+- Maintain compatibility with @crxjs/vite-plugin
+
+## Performance
+- Minimize bundle sizes
+- Use proper code splitting
+- Optimize asset loading
+- Follow Chrome extension best practices for performance
+
+## Testing & Quality Assurance
+- Run svelte-check before commits
+- Ensure type checking passes
+- Fix all ESLint warnings
+- Format code before committing
+- Test in both light and dark modes
+
+## Version Control
+- Follow semantic versioning
+- Keep package-lock.json up to date
+- Document breaking changes
+- Maintain a clean git history

.eslintrc.cjs

@@ -0,0 +1,37 @@
+module.exports = {
+  root: true,
+  extends: [
+    'eslint:recommended',
+    'plugin:@typescript-eslint/recommended',
+    'plugin:svelte/recommended',
+    'prettier',
+  ],
+  parser: '@typescript-eslint/parser',
+  plugins: ['@typescript-eslint'],
+  parserOptions: {
+    sourceType: 'module',
+    ecmaVersion: 2020,
+    extraFileExtensions: ['.svelte'],
+  },
+  env: {
+    browser: true,
+    es2017: true,
+    node: true,
+    webextensions: true,
+  },
+  overrides: [
+    {
+      files: ['*.svelte'],
+      parser: 'svelte-eslint-parser',
+      parserOptions: {
+        parser: '@typescript-eslint/parser',
+      },
+    },
+  ],
+  rules: {
+    // Add basic rules to start with
+    '@typescript-eslint/no-unused-vars': ['warn', { argsIgnorePattern: '^_' }],
+    '@typescript-eslint/no-explicit-any': 'warn',
+    'no-console': ['warn', { allow: ['warn', 'error'] }],
+  },
+};

.github/ISSUE_TEMPLATE/bug_report.md

@@ -1,43 +1,52 @@
 ---
 name: Bug report
 about: Create a report to help improve the Bolt to GitHub extension
-title: "[BUG] "
+title: '[BUG] '
 labels: bug
 assignees: mamertofabian
-
 ---
 
 ## 🐛 Bug Description
+
 <!-- A clear and brief description of what the bug is -->
 
 ## 📝 Steps to Reproduce
+
 1. Go to '...'
 2. Click on '....'
 3. See error '...'
 
 ## ✅ Expected Behavior
+
 <!-- A clear description of what you expected to happen -->
 
 ## ❌ Actual Behavior
+
 <!-- What actually happened instead -->
 
 ## 📸 Screenshots
+
 <!-- If applicable, add screenshots to help explain your problem -->
 
 ## 🔍 Environment Details
+
 - Chrome Version: <!-- e.g., 120.0.6099.109 -->
 - Extension Version: <!-- Find this at chrome://extensions -->
 - Operating System: <!-- e.g., Windows 11, macOS Sonoma -->
 - Bolt.new Project Type: <!-- e.g., Next.js, React, Vue -->
 
 ## 💾 Additional Context
+
 <!-- Add any other context about the problem here -->
+
 - Did this work before?
 - Are you using any specific GitHub organization/repository settings?
 - Any error messages in the Chrome DevTools console? (Press F12 to open)
 
 ## ✔️ Checklist
+
 <!-- Mark the boxes that apply -->
+
 - [ ] I am on bolt.new website when trying to use the extension
 - [ ] I have provided my GitHub token with correct permissions
 - [ ] I have the latest version of the extension installed

.github/workflows/release.yml

@@ -13,28 +13,28 @@ permissions:
 jobs:
   build:
     runs-on: ubuntu-latest
-    
+
     steps:
       - name: Checkout code
         uses: actions/checkout@v4
-        
+
       - name: Setup Node.js
         uses: actions/setup-node@v4
         with:
           node-version: '20'
           cache: 'npm'
-          
+
       - name: Install dependencies
         run: npm ci
-        
+
       - name: Build project
         run: npm run build
-        
+
       - name: Zip build artifacts
         run: |
           cd dist
           zip -r ../chrome-extension.zip .
-        
+
       - name: Create Release
         uses: softprops/action-gh-release@v1
         with:

.prettierrc

@@ -0,0 +1,9 @@
+{
+  "useTabs": false,
+  "tabWidth": 2,
+  "singleQuote": true,
+  "trailingComma": "es5",
+  "printWidth": 100,
+  "plugins": ["prettier-plugin-svelte"],
+  "overrides": [{ "files": "*.svelte", "options": { "parser": "svelte" } }]
+}

.windsurfrules

@@ -0,0 +1,100 @@
+# Security
+
+## Sensitive Files
+DO NOT read or modify:
+- .env files
+- **/config/secrets.* 
+- **/*.pem
+- Any file containing API keys, tokens, or credentials
+
+## Security Practices
+- Never commit sensitive files
+- Use environment variables for secrets
+- Keep credentials out of logs and output
+
+# Tech Stack Rules
+
+## Framework & Core Technologies
+- Use Svelte v4.x for components
+- Use TypeScript for all .ts and .svelte files
+- Use Vite v4.x as build tool
+- Chrome Extension manifest v3 standards must be followed
+- ESM modules only (type: "module" in package.json)
+
+## TypeScript Standards
+- Strict mode is required
+- No implicit any types
+- Strict null checks enabled
+- Use type annotations for function parameters and returns
+- Follow the path aliases:
+  - Use $lib/* for imports from src/lib
+- Chrome types must be included
+
+## Component Standards
+- All Svelte components must use TypeScript
+- Follow Svelte best practices for reactivity
+- Keep components focused and single-responsibility
+- Create modular components:
+  - Break down complex UIs into smaller, reusable components
+  - Extract repeated patterns into shared components
+  - Keep component dependencies minimal and explicit
+  - Use composition over inheritance
+  - Maintain clear component interfaces with proper prop types
+- Use Svelte's built-in state management
+- Props must be properly typed
+
+## Styling Standards
+- Use TailwindCSS for styling
+- Follow the custom theme system defined in tailwind.config.js
+- Use CSS variables for theme colors
+- Maintain dark mode compatibility
+- Use container queries appropriately
+- Follow the defined border radius system
+
+## Code Quality
+- Maximum 300 lines of code per file
+- ESLint rules must be followed:
+  - No unused variables (except prefixed with _)
+  - Warn on any usage
+  - Follow svelte-eslint-parser rules
+- Prettier formatting is required:
+  - 2 space indentation
+  - Single quotes
+  - 100 character line length
+  - ES5 trailing commas
+  - Svelte-specific formatting
+
+## Build & Structure
+- Follow the defined Vite build configuration
+- Maintain separate background/content scripts
+- Use proper chunk splitting
+- Keep source maps in development
+- Assets must be in the assets directory
+- Follow the defined output structure
+
+## Dependencies
+- No conflicting Svelte versions
+- Keep dependencies up to date but pin versions
+- Prefer official Svelte integrations
+- Use bits-ui for UI components
+- Use lucide-svelte for icons
+- Maintain compatibility with @crxjs/vite-plugin
+
+## Performance
+- Minimize bundle sizes
+- Use proper code splitting
+- Optimize asset loading
+- Follow Chrome extension best practices for performance
+
+## Testing & Quality Assurance
+- Run svelte-check before commits
+- Ensure type checking passes
+- Fix all ESLint warnings
+- Format code before committing
+- Test in both light and dark modes
+
+## Version Control
+- Follow semantic versioning
+- Keep package-lock.json up to date
+- Document breaking changes
+- Maintain a clean git history

CHANGELOG.md

@@ -1,13 +1,16 @@
 ## 2024-12-02
 
 ### Added
+
 - New classes for improved code organization: `BackgroundService`, `StateManager`, `ContentManager`, and `UIManager`.
 - UI components for notifications and upload status management.
 - Projects tab for managing Bolt projects and GitHub repositories.
 
 ### Changed
+
 - Refactored background and content scripts for better modularity and maintainability.
 - Enhanced GitHub integration with structured settings and improved error handling.
 
 ### Fixed
-- Ensured upload status container is appended only after the document body is available, improving UI reliability.
+
+- Ensured upload status container is appended only after the document body is available, improving UI reliability.