edit example to use button components

This commit is contained in:
sanish-bruno
2026-01-01 19:11:13 +05:30
parent bf9ff8b6ba
commit 9b02a2d732

View File

@@ -7,6 +7,7 @@ import { useTheme } from 'providers/Theme';
import TruncatedText from 'components/TruncatedText';
import { updateResponseExampleName, updateResponseExampleDescription } from 'providers/ReduxStore/slices/collections';
import get from 'lodash/get';
import Button from 'ui/Button';
const ResponseExampleTopBar = ({
item,
@@ -130,21 +131,25 @@ const ResponseExampleTopBar = ({
</div>
<div className="flex items-center gap-3 flex-shrink-0 md:w-auto w-full md:justify-end">
<button
className="secondary-btn flex items-center gap-1.5 px-4 py-2 rounded-md text-xs font-medium cursor-pointer border whitespace-nowrap"
<Button
variant="outline"
color="secondary"
size="sm"
onClick={handleCancel}
data-testid="response-example-cancel-btn"
>
Cancel
</button>
<button
className="primary-btn flex items-center gap-1.5 px-4 py-2 rounded-md text-xs font-medium cursor-pointer border whitespace-nowrap"
</Button>
<Button
variant="filled"
color="primary"
size="sm"
icon={<IconDeviceFloppy size={16} />}
onClick={handleSave}
data-testid="response-example-save-btn"
>
<IconDeviceFloppy size={16} />
Save
</button>
</Button>
</div>
</div>
</div>
@@ -178,23 +183,25 @@ const ResponseExampleTopBar = ({
</div>
<div className="flex items-center gap-3 flex-shrink-0 md:w-auto w-full md:justify-end">
<button
className="secondary-btn flex items-center gap-1.5 p-2 rounded-md text-xs font-medium cursor-pointer border whitespace-nowrap"
<Button
variant="outline"
color="secondary"
size="sm"
icon={<IconCode size={16} color={theme.examples.buttonIconColor} />}
onClick={handleGenerateCode}
title="Generate Code"
data-testid="response-example-generate-code-btn"
>
<IconCode size={16} color={theme.examples.buttonIconColor} />
</button>
<button
className="secondary-btn flex items-center gap-1.5 px-4 py-2 rounded-md text-xs font-medium cursor-pointer border whitespace-nowrap"
style={{ color: theme.examples.buttonText }}
/>
<Button
variant="outline"
color="secondary"
size="sm"
icon={<IconEdit size={16} color={theme.examples.buttonIconColor} />}
onClick={onEditToggle}
data-testid="response-example-edit-btn"
>
<IconEdit size={16} color={theme.examples.buttonIconColor} />
Edit Example
</button>
</Button>
</div>
</div>
</div>