fix: Change Install to View button and fix author display in marketplace

Changes:
1. Changed "Install" button to "View" button with Eye icon
   - Removed separate "Details" button
   - Single "View" button now opens the details modal
2. Fixed author mapping to use author_name from API
3. Fixed rating field to use rating_average from API
4. Set isVerified based on visibility === 'PLATFORM'

The modal now correctly displays:
- Plugin name with verified badge for platform plugins
- Author name (e.g., "Smooth Schedule")
- Version number
- Full description with formatting
- Category, ratings, and install count

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
poduck
2025-11-28 22:01:05 -05:00
parent c36025f018
commit 0f46862125

View File

@@ -16,7 +16,8 @@ import {
Calendar,
Link as LinkIcon,
Bot,
Package
Package,
Eye
} from 'lucide-react';
import api from '../api/client';
import { PluginTemplate, PluginCategory } from '../types';
@@ -62,11 +63,11 @@ const PluginMarketplace: React.FC = () => {
description: p.description,
category: p.category,
version: p.version,
author: p.author,
rating: parseFloat(p.rating || 0),
author: p.author_name,
rating: parseFloat(p.rating_average || 0),
ratingCount: parseInt(p.rating_count || 0),
installCount: parseInt(p.install_count || 0),
isVerified: p.is_verified || false,
isVerified: p.visibility === 'PLATFORM',
isFeatured: p.is_featured || false,
createdAt: p.created_at,
updatedAt: p.updated_at,
@@ -289,22 +290,16 @@ const PluginMarketplace: React.FC = () => {
</div>
{/* Plugin Card Actions */}
<div className="px-6 py-4 bg-gray-50 dark:bg-gray-900/50 border-t border-gray-100 dark:border-gray-700 flex gap-3">
<button
onClick={() => handleInstall(plugin)}
className="flex-1 flex items-center justify-center gap-2 px-4 py-2 bg-brand-600 text-white rounded-lg hover:bg-brand-700 transition-colors font-medium text-sm"
>
<Download className="h-4 w-4" />
{t('plugins.install', 'Install')}
</button>
<div className="px-6 py-4 bg-gray-50 dark:bg-gray-900/50 border-t border-gray-100 dark:border-gray-700">
<button
onClick={() => {
setSelectedPlugin(plugin);
setShowDetailsModal(true);
}}
className="px-4 py-2 border border-gray-300 dark:border-gray-600 text-gray-700 dark:text-gray-300 rounded-lg hover:bg-gray-100 dark:hover:bg-gray-700 transition-colors font-medium text-sm"
className="w-full flex items-center justify-center gap-2 px-4 py-2 bg-brand-600 text-white rounded-lg hover:bg-brand-700 transition-colors font-medium text-sm"
>
{t('plugins.details', 'Details')}
<Eye className="h-4 w-4" />
{t('plugins.view', 'View')}
</button>
</div>
</div>