fixed public editor issues

Author: raheeliftikhar5

client/packages/lowcoder/src/pages/common/headerStartDropdown.tsx

@@ -100,7 +100,7 @@ export function HeaderStartDropdown(props: { setEdit: () => void, isViewMarketpl
             })}
           </CommonTextLabel>
         ),
-        visible: true,
+        visible: !isPublicApp,
       },
     ];
 

client/packages/lowcoder/src/pages/common/previewHeader.tsx

@@ -115,14 +115,22 @@ export function HeaderProfile(props: { user: User }) {
   const { user } = props;
   const fetchingUser = useSelector(isFetchingUser);
   const templateId = useSelector(getTemplateId);
+  const isPublicApp = useSelector(isPublicApplication);
+
   if (fetchingUser) {
     return <Skeleton.Avatar shape="circle" size={28} />;
   }
   return (
     <div>
       {user.isAnonymous ? (
         !templateId ? (
-          <LoginBtn buttonType="primary" onClick={() => history.push(AUTH_LOGIN_URL)}>
+          <LoginBtn buttonType="primary" onClick={() => {
+            if (isPublicApp) {
+              window.top?.open('https://app.lowcoder.cloud/user/auth/login');
+            } else {
+              history.push(AUTH_LOGIN_URL)
+            }
+          }}>
             {trans("userAuth.login")}
           </LoginBtn>
         ) : null
@@ -147,7 +155,7 @@ const PreviewHeaderComp = () => {
 
   const headerStart = (
     <>
-      <StyledLink onClick={() => history.push(ALL_APPLICATIONS_URL)}>
+      <StyledLink onClick={() => !isPublicApp && history.push(ALL_APPLICATIONS_URL)}>
         <LogoIcon branding={true} />
       </StyledLink>
       {isViewMarketplaceMode && (
@@ -204,36 +212,44 @@ const PreviewHeaderComp = () => {
     </Wrapper>
   );
 
-  const headerMiddle = (
-    <>
-      {/* Devices */}
-      <Segmented<DeviceType>
-        options={[
-          { value: 'mobile', icon: <MobileOutlined /> },
-          { value: 'tablet', icon: <TabletOutlined /> },
-          { value: 'desktop', icon: <DesktopOutlined /> },
-        ]}
-        value={editorState.deviceType}
-        onChange={(value) => {
-          editorState.setDeviceType(value);
-        }}
-      />
-
-      {/* Orientation */}
-      {editorState.deviceType !== 'desktop' && (
-        <Segmented<DeviceOrientation>
+  const headerMiddle = useMemo(() => {
+    if (isPublicApp) return null;
+
+    return (
+      <>
+        {/* Devices */}
+        <Segmented<DeviceType>
           options={[
-            { value: 'portrait', label: "Portrait" },
-            { value: 'landscape', label: "Landscape" },
+            { value: 'mobile', icon: <MobileOutlined /> },
+            { value: 'tablet', icon: <TabletOutlined /> },
+            { value: 'desktop', icon: <DesktopOutlined /> },
           ]}
-          value={editorState.deviceOrientation}
+          value={editorState.deviceType}
           onChange={(value) => {
-            editorState.setDeviceOrientation(value);
+            editorState.setDeviceType(value);
           }}
         />
-      )}
-    </>
-  );
+
+        {/* Orientation */}
+        {editorState.deviceType !== 'desktop' && (
+          <Segmented<DeviceOrientation>
+            options={[
+              { value: 'portrait', label: "Portrait" },
+              { value: 'landscape', label: "Landscape" },
+            ]}
+            value={editorState.deviceOrientation}
+            onChange={(value) => {
+              editorState.setDeviceOrientation(value);
+            }}
+          />
+        )}
+      </>
+    );
+  }, [
+    isPublicApp,
+    editorState.deviceType,
+    editorState.deviceOrientation,
+  ]);
 
   return (
     <Header