[react] fix: pattern export issues (#218)
Fix the export functionality in the pattern editor: * Fix the export button in the header bar * Fix the copy to clipboard buttons displaying no text and having a weird styling. Before:  After:  Fixes #215 Reviewed-on: https://codeberg.org/freesewing/freesewing/pulls/218 Reviewed-by: Joost De Cock <joostdecock@noreply.codeberg.org> Co-authored-by: Jonathan Haas <haasjona@gmail.com> Co-committed-by: Jonathan Haas <haasjona@gmail.com>
This commit is contained in:
parent
fcbb8ecc0b
commit
c34bf694e1
2 changed files with 4 additions and 6 deletions
|
@ -21,18 +21,15 @@ const handleCopied = (content, setCopied, setLoadingStatus, label) => {
|
||||||
setTimeout(() => setCopied(false), 1000)
|
setTimeout(() => setCopied(false), 1000)
|
||||||
}
|
}
|
||||||
|
|
||||||
export const CopyToClipboardButton = ({ content, label = false, sup = false }) => {
|
export const CopyToClipboardButton = ({ children, content, label = false, sup = false }) => {
|
||||||
const [copied, setCopied] = useState(false)
|
const [copied, setCopied] = useState(false)
|
||||||
const { setLoadingStatus } = useContext(LoadingStatusContext)
|
const { setLoadingStatus } = useContext(LoadingStatusContext)
|
||||||
|
|
||||||
const text =
|
|
||||||
typeof content === 'string' ? content : strip(ReactDOMServer.renderToStaticMarkup(content))
|
|
||||||
|
|
||||||
const style = sup ? 'tw-w-4 tw-h-4 tw--mt-4' : 'tw-w-5 tw-h-5'
|
const style = sup ? 'tw-w-4 tw-h-4 tw--mt-4' : 'tw-w-5 tw-h-5'
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<button
|
<button
|
||||||
className={copied ? 'tw-text-success' : ''}
|
className={(copied ? 'tw-text-success ' : '') + 'tw-daisy-btn tw-w-full lg:tw-w-auto'}
|
||||||
onClick={() => handleCopied(content, setCopied, setLoadingStatus, label)}
|
onClick={() => handleCopied(content, setCopied, setLoadingStatus, label)}
|
||||||
>
|
>
|
||||||
{copied ? (
|
{copied ? (
|
||||||
|
@ -43,6 +40,7 @@ export const CopyToClipboardButton = ({ content, label = false, sup = false }) =
|
||||||
) : (
|
) : (
|
||||||
<CopyIcon className={`${style} tw-text-inherit`} />
|
<CopyIcon className={`${style} tw-text-inherit`} />
|
||||||
)}
|
)}
|
||||||
|
{children}
|
||||||
</button>
|
</button>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|
|
@ -480,7 +480,7 @@ export const HeaderMenuSaveIcons = (props) => {
|
||||||
<Button updateHandler={() => update.view('save')} tooltip="Save pattern as...">
|
<Button updateHandler={() => update.view('save')} tooltip="Save pattern as...">
|
||||||
<SaveAsIcon className={`${size} tw-text-secondary`} />
|
<SaveAsIcon className={`${size} tw-text-secondary`} />
|
||||||
</Button>
|
</Button>
|
||||||
<Button updateHandler={update.clearPattern} tooltip="Export pattern">
|
<Button updateHandler={() => update.view('export')} tooltip="Export pattern">
|
||||||
<ExportIcon className={`${size} tw-text-secondary`} />
|
<ExportIcon className={`${size} tw-text-secondary`} />
|
||||||
</Button>
|
</Button>
|
||||||
</div>
|
</div>
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue