feat: put Shareable Playground under ENABLE_PUBLISH feature flag and removed old publish (#7482)

* Removed old toolbar

* Add enable_publish check before showing Shareable Playground

* Removed enable_publish condition on play button

* Removed enable_publish condition on playground title

* Removed unused import

src/frontend/src/components/core/flowToolbarComponent/components/deploy-dropdown.tsx

@@ -10,7 +10,7 @@ import {
 import { Switch } from "@/components/ui/switch";
 import { usePatchUpdateFlow } from "@/controllers/API/queries/flows/use-patch-update-flow";
 import { CustomLink } from "@/customization/components/custom-link";
-import { ENABLE_WIDGET } from "@/customization/feature-flags";
+import { ENABLE_PUBLISH, ENABLE_WIDGET } from "@/customization/feature-flags";
 import ApiModal from "@/modals/apiModal/new-api-modal";
 import EmbedModal from "@/modals/EmbedModal/embed-modal";
 import useAlertStore from "@/stores/alertStore";
@@ -130,6 +130,8 @@ export default function PublishDropdown() {
               </div>
             </DropdownMenuItem>
           )}
+
+          {ENABLE_PUBLISH && (
             <ShadTooltipComponent
               styleClasses="truncate"
               side="left"
@@ -187,6 +189,7 @@ export default function PublishDropdown() {
                 </div>
               </div>
             </ShadTooltipComponent>
+          )}
         </DropdownMenuContent>
       </DropdownMenu>
       <ApiModal open={openApiModal} setOpen={setOpenApiModal}>

src/frontend/src/components/core/flowToolbarComponent/components/playground-button.tsx

@@ -1,7 +1,6 @@
 import ForwardedIconComponent from "@/components/common/genericIconComponent";
 import ShadTooltip from "@/components/common/shadTooltipComponent";
 import { PLAYGROUND_BUTTON_NAME } from "@/constants/constants";
-import { ENABLE_PUBLISH } from "@/customization/feature-flags";
 import IOModal from "@/modals/IOModal/new-modal";
 
 const PlaygroundButton = ({ hasIO, open, setOpen, canvasOpen }) => {
@@ -9,7 +8,7 @@ const PlaygroundButton = ({ hasIO, open, setOpen, canvasOpen }) => {
     <ForwardedIconComponent
       name="Play"
       className="h-4 w-4 transition-all"
-      strokeWidth={ENABLE_PUBLISH ? 2 : 1.5}
+      strokeWidth={2}
     />
   );
 

src/frontend/src/components/core/flowToolbarComponent/index.tsx

@@ -1,15 +1,8 @@
 import ShadTooltip from "@/components/common/shadTooltipComponent";
-import PlaygroundButton from "@/components/core/flowToolbarComponent/components/playground-button";
-import {
-  ENABLE_API,
-  ENABLE_LANGFLOW_STORE,
-  ENABLE_PUBLISH,
-} from "@/customization/feature-flags";
 import { track } from "@/customization/utils/analytics";
 import { Panel } from "@xyflow/react";
 import { useEffect, useMemo, useState } from "react";
 import { useHotkeys } from "react-hotkeys-hook";
-import ApiModal from "../../../modals/apiModal";
 import ShareModal from "../../../modals/shareModal";
 import useFlowStore from "../../../stores/flowStore";
 import { useShortcutsStore } from "../../../stores/shortcuts";
@@ -122,66 +115,10 @@ export default function FlowToolbar(): JSX.Element {
       <Panel className="!m-2" position="top-right">
         <div
           className={cn(
-            "hover:shadow-round-btn-shadow flex items-center justify-center gap-7 rounded-md border bg-background px-1.5 shadow transition-all",
+            "hover:shadow-round-btn-shadow flex h-11 items-center justify-center gap-7 rounded-md border bg-background px-1.5 shadow transition-all",
-            ENABLE_PUBLISH ? "h-11" : "",
           )}
         >
-          {ENABLE_PUBLISH ? (
           <FlowToolbarOptions />
-          ) : (
-            <div className="flex gap-1.5">
-              <div className="flex h-full w-full gap-1.5 rounded-sm transition-all">
-                <PlaygroundButton
-                  hasIO={hasIO}
-                  open={open}
-                  setOpen={setOpen}
-                  canvasOpen
-                />
-              </div>
-              {ENABLE_API && (
-                <>
-                  <div
-                    className="flex cursor-pointer items-center gap-2"
-                    data-testid="api_button_modal"
-                    id="api_button_modal"
-                  >
-                    {currentFlow && currentFlow.data && (
-                      <ApiModal
-                        flow={currentFlow}
-                        open={openCodeModal}
-                        setOpen={setOpenCodeModal}
-                      >
-                        <div
-                          className={classNames(
-                            "relative inline-flex h-8 w-full items-center justify-center gap-1.5 rounded px-3 py-1.5 text-sm font-semibold text-foreground transition-all duration-150 ease-in-out hover:bg-accent",
-                          )}
-                        >
-                          <ForwardedIconComponent
-                            name="Code2"
-                            className={"h-4 w-4"}
-                          />
-                          <span className="hidden md:block">API</span>
-                        </div>
-                      </ApiModal>
-                    )}
-                  </div>
-                </>
-              )}
-              {ENABLE_LANGFLOW_STORE && (
-                <div className="flex items-center gap-2">
-                  <div
-                    className={`side-bar-button ${
-                      !hasApiKey || !validApiKey || !hasStore
-                        ? "cursor-not-allowed"
-                        : "cursor-pointer"
-                    }`}
-                  >
-                    {ModalMemo}
-                  </div>
-                </div>
-              )}
-            </div>
-          )}
         </div>
       </Panel>
     </>

src/frontend/src/modals/IOModal/components/chatView/chatMessage/chat-message.tsx

@@ -2,10 +2,7 @@ import { ProfileIcon } from "@/components/core/appHeaderComponent/components/Pro
 import { ContentBlockDisplay } from "@/components/core/chatComponents/ContentBlockDisplay";
 import { useUpdateMessage } from "@/controllers/API/queries/messages";
 import { CustomProfileIcon } from "@/customization/components/custom-profile-icon";
-import {
+import { ENABLE_DATASTAX_LANGFLOW } from "@/customization/feature-flags";
-  ENABLE_DATASTAX_LANGFLOW,
-  ENABLE_PUBLISH,
-} from "@/customization/feature-flags";
 import useFlowsManagerStore from "@/stores/flowsManagerStore";
 import useFlowStore from "@/stores/flowStore";
 import { useUtilityStore } from "@/stores/utilityStore";

src/frontend/src/modals/IOModal/new-modal.tsx

@@ -75,8 +75,7 @@ export default function IOModal({
     currentFlowId,
   );
   const flowName = useFlowStore((state) => state.currentFlow?.name);
-  const PlaygroundTitle =
+  const PlaygroundTitle = playgroundPage && flowName ? flowName : "Playground";
-    playgroundPage && ENABLE_PUBLISH && flowName ? flowName : "Playground";
 
   useEffect(() => {
     setIOModalOpen(open);