feat(export-import): add yaml export/import with id upsert for credentials, snippets, and scenarios

- all entities export a kind field (credential/snippet/scenario) for safe type checking on import
- import upserts by id: overwrites if id exists, creates with explicit id otherwise
- scenario export now includes id and step ids; import deletes old steps before recreating
- add GET /:id/export and POST /import endpoints to credential and snippet controllers
- add UuidBadge ui component: shortens uuid to first+last 4 hex chars, tooltip, clipboard copy with animated ClipboardCheck icon pop
- apply UuidBadge across all entity id display sites (detail pages, card footers, table columns)
- add export/import buttons to CredentialsPage, SnippetsPage, CredentialDetailPage, SnippetDetailPage

server/src/credential/credential.controller.ts

@@ -5,7 +5,7 @@ import {
   Get,
   HttpCode,
   Param,
-  ParseIntPipe,
+  ParseUUIDPipe,
   Patch,
   Post,
   Query,
@@ -14,6 +14,7 @@ import { ApiOperation, ApiResponse, ApiTags } from "@nestjs/swagger";
 import { CredentialService } from "./credential.service";
 import { CreateCredentialDto } from "./dto/create-credential.dto";
 import { UpdateCredentialDto } from "./dto/update-credential.dto";
+import { CredentialExportDto } from "./dto/credential-export.dto";
 import { PaginationQueryDto } from "../common/dto/pagination.dto";
 import { CredentialOrderBy } from "./credential.service";
 
@@ -29,6 +30,13 @@ export class CredentialController {
     return this.credentialService.create(dto);
   }
 
+  @Post("import")
+  @ApiOperation({ summary: "Import a credential (upsert by id)" })
+  @ApiResponse({ status: 201, description: "Credential imported" })
+  async importCredential(@Body() dto: CredentialExportDto) {
+    return this.credentialService.importCredential(dto);
+  }
+
   @Get()
   @ApiOperation({ summary: "List all credentials (paginated)" })
   @ApiResponse({ status: 200, description: "Paginated credentials" })
@@ -36,11 +44,20 @@ export class CredentialController {
     return this.credentialService.findAll(query);
   }
 
+  @Get(":id/export")
+  @ApiOperation({ summary: "Export a credential as a plain object" })
+  @ApiResponse({ status: 200, description: "Credential export payload" })
+  @ApiResponse({ status: 404, description: "Credential not found" })
+  async exportCredential(@Param("id", ParseUUIDPipe) id: string) {
+    const credential = await this.credentialService.findOne(id);
+    return this.credentialService.exportCredential(credential);
+  }
+
   @Get(":id")
   @ApiOperation({ summary: "Get credential by ID" })
   @ApiResponse({ status: 200, description: "Credential record" })
   @ApiResponse({ status: 404, description: "Credential not found" })
-  findOne(@Param("id", ParseIntPipe) id: number) {
+  findOne(@Param("id", ParseUUIDPipe) id: string) {
     return this.credentialService.findOne(id);
   }
 
@@ -49,7 +66,7 @@ export class CredentialController {
   @ApiResponse({ status: 200, description: "Credential updated" })
   @ApiResponse({ status: 404, description: "Credential not found" })
   update(
-    @Param("id", ParseIntPipe) id: number,
+    @Param("id", ParseUUIDPipe) id: string,
     @Body() dto: UpdateCredentialDto,
   ) {
     return this.credentialService.update(id, dto);
@@ -60,7 +77,7 @@ export class CredentialController {
   @ApiOperation({ summary: "Delete a credential" })
   @ApiResponse({ status: 204, description: "Credential deleted" })
   @ApiResponse({ status: 404, description: "Credential not found" })
-  remove(@Param("id", ParseIntPipe) id: number) {
+  remove(@Param("id", ParseUUIDPipe) id: string) {
     return this.credentialService.remove(id);
   }
 }