feat: manually mirror opencoze's code from bytedance

Change-Id: I09a73aadda978ad9511264a756b2ce51f5761adf

frontend/packages/foundation/layout/src/hooks/index.ts

@@ -0,0 +1,18 @@
+/*
+ * Copyright 2025 coze-dev Authors
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+ 
+/**store */
+export { useMobileTips } from './use-mobile-tips';

frontend/packages/foundation/layout/src/hooks/use-mobile-tips/index.module.less

@@ -0,0 +1,9 @@
+.mobile-tips-span {
+  font-size: 0.75rem;
+  font-weight: 400;
+  line-height: 1rem;
+  color: rgb(29 28 35 / 80%);
+  text-align: center;
+
+  /* 133.333% */
+}

frontend/packages/foundation/layout/src/hooks/use-mobile-tips/index.tsx

@@ -0,0 +1,56 @@
+/*
+ * Copyright 2025 coze-dev Authors
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+ 
+import React from 'react';
+
+import { I18n } from '@coze-arch/i18n';
+import { useUIModal } from '@coze-arch/bot-semi';
+
+import s from './index.module.less';
+
+export interface UseMobileTipsReturnType {
+  open: () => void;
+  close: () => void;
+  node: JSX.Element;
+}
+
+export const useMobileTips = (): UseMobileTipsReturnType => {
+  const { open, close, modal } = useUIModal({
+    title: I18n.t('landing_mobile_popup_title'),
+    okText: I18n.t('landing_mobile_popup_button'),
+    // width: 456,
+    centered: true,
+    hideCancelButton: true,
+    isMobile: true,
+    onOk: () => {
+      close();
+    },
+  });
+
+  return {
+    node: modal(
+      <span className={s['mobile-tips-span']}>
+        {I18n.t('landing_mobile_popup_context')}
+      </span>,
+    ),
+    open: () => {
+      open();
+    },
+    close: () => {
+      close();
+    },
+  };
+};