Skip to content

Feature/the json import export backup feature#423

Open
amritbej wants to merge 2 commits into
Dev-Card:mainfrom
amritbej:feature/The-JSON-Import-Export-Backup-Feature
Open

Feature/the json import export backup feature#423
amritbej wants to merge 2 commits into
Dev-Card:mainfrom
amritbej:feature/The-JSON-Import-Export-Backup-Feature

Conversation

@amritbej
Copy link
Copy Markdown
Contributor

Summary

This PR introduces a standalone DevCard generator route (/create) to the web application, featuring a JSON configuration backup and restore mechanism. Previously, form data (Name, Bio, Links, Skills) was transient and lost upon refreshing the page. This update allows users to export their profile state to a local .json file and import it back later, preventing data loss and eliminating the friction of re-entering fields from scratch.

Closes #375


Type of Change

  • Bug fix
  • New feature
  • Refactor (no functional change)
  • UI / Design change
  • Tests only
  • Documentation
  • Infrastructure / DevOps
  • Security

What Changed

  • Created apps/web/src/routes/create/+page.svelte: Added a new generator page with a sleek "Customization Panel" and a dynamic "Live Preview" card.
  • Implemented Export ("Backup Config"): Added a utility to stringify the active form state and trigger a browser download for devcard-config.json.
  • Implemented Import ("Import Config"): Added a hidden file upload input that accepts the JSON file, parses it, applies basic schema validation, and repopulates the UI state instantly.
  • Added UI Action Buttons: Placed the "Backup Config", "Import Config", and placeholder "Download Image" buttons in the customization panel.

How to Test

  1. Start the web application by running pnpm --filter @devcard/web dev.
  2. Navigate to http://localhost:5173/create in your browser.
  3. Fill out the Name, Bio, Links, and Skills fields.
  4. Click Backup Config to download the devcard-config.json file.
  5. Refresh the browser page to simulate transient data loss (the form will reset).
  6. Click Import Config, upload the downloaded devcard-config.json file, and verify that all inputs and the Live Preview instantly restore your previous configuration.

Checklist

  • My code follows the project's coding style (pnpm -r run lint passes).
  • TypeScript compiles without errors (pnpm -r run typecheck).
  • I have added or updated tests for the changes I made.
  • All tests pass locally (pnpm -r run test).
  • I have updated documentation where necessary.
  • No new console.log or debug statements left in the code.
  • Breaking changes are documented in this PR description.

Screenshots / Recordings

UI
devcard-UI

and the JSON file (i have tested it only )
{
"name": "Amrit Bej",
"bio": "I am a developer ",
"links": "https://github.com/amritbej",
"skills": "React, python , pytorch, express",
"version": 1
}


Additional Context

  • The Image Download functionality is currently a placeholder button alongside the Export/Import features to match the UI specification, and will need to be hooked up to an image generation utility (like html2canvas or satori) in a future PR.

Amrit added 2 commits May 30, 2026 19:57
…ev-Card#9)

- Add isSupportedPlatform(id: string): boolean to platforms.ts
  Uses PLATFORMS[id] !== undefined for the check
- Add packages/shared/src/__tests__/platforms.test.ts with 9 tests:
  * valid platform IDs (github, linkedin, twitter, discord, email) → true
  * unknown/invalid IDs (unknown-platform, '', Github, GITHUB) → false
  * strict boolean return type assertion
- TypeScript passes (tsc --noEmit)
- All 31 shared tests pass
@amritbej
Copy link
Copy Markdown
Contributor Author

@Harxhit please check it i have added the functionality and some UI changes with SS

@Harxhit Harxhit requested a review from ShantKhatri May 31, 2026 05:48
@Harxhit Harxhit added the gssoc:approved Required label for every approved PR. Gives the base +50 points and enables contribution tracking. label May 31, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

gssoc:approved Required label for every approved PR. Gives the base +50 points and enables contribution tracking.

Projects

None yet

Development

Successfully merging this pull request may close these issues.

The JSON Import/Export Backup Feature.

2 participants