# tableberg/1.1.5/src/components/SidebarUpsell.tsx

Tableberg – Simple Gutenberg Table Block, version 1.1.5. 37 lines.

- Page: https://pluginprobe.com/plugins/tableberg/1.1.5/code/src/components/SidebarUpsell.tsx
- Raw: https://pluginprobe.com/plugins/tableberg/1.1.5/raw/src/components/SidebarUpsell.tsx
- Modified: 2026-09-16T03:30:32+00:00

Line numbers below start at 1. Link to a line or a range by appending a fragment to the
page URL, for example `https://pluginprobe.com/plugins/tableberg/1.1.5/code/src/components/SidebarUpsell.tsx#L10-L20`.

```tsx
import { useState } from "react";
import { __ } from "@wordpress/i18n";
import UpsellModal from "./UpsellModal";

export function SidebarUpsell() {
    const [isShown, setIsShown] = useState(false);
    return (
        <>
            <div
                onClick={() => setIsShown(true)}
                className="tableberg-upsell-inspector-notice-wrapper"
            >
                <div
                    className={"tableberg-upsell-inspector-notice"}
                    title={__("click for more info", "tableberg")}
                >
                    <div className={"tableberg-upsell-notice-icon-container"}>
                        <img
                            alt={__("Tableberg logo", "tableberg")}
                            src={tablebergAdminMenuData?.assets.logoTransparent}
                        />
                    </div>
                    <div className={"tableberg-upsell-notice"}>
                        <span>
                            <b>{__("Tableberg", "tableberg")}</b>{" "}
                            {__("has", "tableberg")}{" "}
                            <b>{__("PRO", "tableberg")}</b>
                            <br /> enhancements.
                        </span>
                    </div>
                </div>
            </div>
            {isShown && <UpsellModal onClose={() => setIsShown(false)} />}
        </>
    );
}

```