fix: no auth chats-bottom => login btn

kubeagi · Mar 29, 2024 · b815871 · b815871
1 parent 1936d50
commit b815871
Show file tree

Hide file tree

Showing 2 changed files with 45 additions and 84 deletions.
diff --git a/src/app/[locale]/agent/components/index.tsx b/src/app/[locale]/agent/components/index.tsx
@@ -5,6 +5,7 @@ import { sdk as bff } from '@yuntijs/arcadia-bff-sdk';
 import { Avatar, Button, Col, Row, Spin, Tooltip } from 'antd';
 import classNames from 'classnames';
 import { useTranslations } from 'next-intl';
+import { useRouter } from 'next/navigation';
 // import { useRouter } from 'next/navigation';
 import React, { useEffect, useState } from 'react';
 
@@ -41,6 +42,7 @@ const layout = {
 
 const Agent = React.memo<AgentProps>(({ agentData, TZH_AGENT_CATEGORY }) => {
   const t = useTranslations('components');
+  const router = useRouter();
   const { styles } = useStyles();
   const [selectedTag, setSelectedTags] = useState(TZH_AGENT_CATEGORY[0]);
   // const [pageSize, setPageSize] = useState(-1);
@@ -70,7 +72,7 @@ const Agent = React.memo<AgentProps>(({ agentData, TZH_AGENT_CATEGORY }) => {
     <div className={styles.agentContainer}>
       <div className={styles.agentContent}>
         <TitleCom
-          extra={<Button>{t('index.dengLu')}</Button>}
+          extra={<Button onClick={() => router.push('/oidc/auth')}>{t('index.dengLu')}</Button>}
           isLeftTitle
           title={t('index.faXianAIZhi')}
         />

diff --git a/src/layout/AppNoAuthLayout/SideBar/UserInfoBottom.tsx b/src/layout/AppNoAuthLayout/SideBar/UserInfoBottom.tsx
@@ -1,84 +1,39 @@
 'use client';
 
-import { ActionIcon } from '@lobehub/ui';
-import { Skeleton, Space } from 'antd';
+import { Button } from 'antd';
 import { createStyles } from 'antd-style';
-import { LogIn } from 'lucide-react';
 import { useTranslations } from 'next-intl';
 import { useRouter } from 'next/navigation';
 import React from 'react';
-import { Flexbox } from 'react-layout-kit';
 
-export const useStyles = createStyles(({ token }) => {
-  const defaultHeight = '60px';
+export const useStyles = createStyles(() => {
+  const defaultHeight = '40px';
   return {
-    userinfo: {
+    noauthBottomWrapper: {
       lineHeight: defaultHeight,
-      height: defaultHeight,
       width: '100%',
-      padding: '0 12px',
+      padding: '8px 12px 0 12px',
       overflowY: 'hidden',
-      borderTop: `1px solid ${token.colorSplit}`,
-      alignItems: 'center',
-      display: 'flex',
     },
-    skeletonUserinfo: {
-      'height': defaultHeight,
-      'display': 'flex',
-      'alignItems': 'center',
-      'paddingTop': '15px',
-      '.ant-skeleton': {
-        'height': '40px',
-        'paddingLeft': '12px',
-        'display': 'block',
-        '.ant-skeleton-header': {
-          paddingInlineEnd: '12px',
-        },
-        '.ant-skeleton-paragraph': {
-          marginBottom: 0,
-          paddingTop: '7px',
-        },
+    loginBtn: {
+      'width': '100%',
+      'marginBottom': 8,
+      '.ant-btn': {
+        width: '100%',
       },
     },
-    checkIcon: {
-      marginRight: 8,
-      verticalAlign: 'bottom',
-      width: '15px',
-    },
-    hideIcon: {
-      marginRight: 8,
-      verticalAlign: 'bottom',
-      width: '15px',
-      color: 'rgba(0, 0, 0, 0)',
+    others: {
+      marginBottom: 8,
     },
     icons: {
       textAlign: 'right',
       lineHeight: defaultHeight,
-      paddingTop: '10px',
-    },
-    avator: {
-      minWidth: '38px',
+      height: defaultHeight,
     },
-    username: {
+    aboutus: {
       width: 'calc(100% - 80px)',
       cursor: 'pointer',
     },
-    hover: {
-      'height': '40px',
-      'lineHeight': '40px',
-      'padding': '0 12px',
-      '.ant-typography': {
-        lineHeight: '40px',
-        maxWidth: 'calc(100% - 40px)',
-        overflow: 'hidden',
-        textOverflow: 'ellipsis',
-      },
-      '&:hover': {
-        color: 'rgba(0, 0, 0, 0.88)',
-        backgroundColor: token.controlItemBgHover,
-        borderRadius: '12px',
-      },
-    },
   };
 });
 
@@ -87,30 +42,34 @@ export default function UserInfoBottom() {
   const { styles } = useStyles();
   const router = useRouter();
   return (
-    <Flexbox className={styles.userinfo} distribution={'space-between'} horizontal>
-      <div className={styles.username}>
-        <div className={styles.skeletonUserinfo}>
-          <Skeleton avatar={{ size: 28 }} paragraph={{ rows: 1 }} title={false} />
-        </div>
-      </div>
-      <div className={styles.icons}>
-        <Space>
-          <ActionIcon
-            icon={LogIn}
-            onClick={() => {
-              router.push('/oidc/auth');
-            }}
-            style={{
-              borderRadius: '12px',
-            }}
-            title={t('components.index.dengLu')}
-          />
-          {/* <ActionIcon
-            icon={Phone}
-            title={'下载应用'}
-          /> */}
-        </Space>
+    <div className={styles.noauthBottomWrapper}>
+      <div className={styles.loginBtn}>
+        <Button
+          onClick={() => {
+            router.push('/oidc/auth');
+          }}
+          size="large"
+          type="primary"
+        >
+          {t('components.index.dengLu')}
+        </Button>
       </div>
-    </Flexbox>
+      {/* <Flexbox
+        className={styles.others}
+        distribution={'space-between'} horizontal
+      >
+        <div className={styles.aboutus}>
+          aboutus
+        </div>
+        <div className={styles.icons}>
+          <Space>
+            <ActionIcon
+              icon={Phone}
+              title={'下载应用'}
+            />
+          </Space>
+        </div>
+      </Flexbox> */}
+    </div>
   );
 }