Hugging Face's logo

Spaces:
lengfeng1360
/
api
Build error

App Files Community
api
File size: 2,600 Bytes 
4ef3a0e
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
 
/*

Copyright (C) 2025 QuantumNous



This program is free software: you can redistribute it and/or modify

it under the terms of the GNU Affero General Public License as

published by the Free Software Foundation, either version 3 of the

License, or (at your option) any later version.



This program is distributed in the hope that it will be useful,

but WITHOUT ANY WARRANTY; without even the implied warranty of

MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the

GNU Affero General Public License for more details.



You should have received a copy of the GNU Affero General Public License

along with this program. If not, see <https://www.gnu.org/licenses/>.



For commercial licensing, please contact support@quantumnous.com

*/

import React from 'react';
import { Link } from 'react-router-dom';
import { Typography, Tag } from '@douyinfe/semi-ui';
import SkeletonWrapper from '../components/SkeletonWrapper';

const HeaderLogo = ({

  isMobile,

  isConsoleRoute,

  logo,

  logoLoaded,

  isLoading,

  systemName,

  isSelfUseMode,

  isDemoSiteMode,

  t,

}) => {
  if (isMobile && isConsoleRoute) {
    return null;
  }

  return (
    <Link to='/' className='group flex items-center gap-2'>

      <div className='relative w-8 h-8 md:w-8 md:h-8'>

        <SkeletonWrapper loading={isLoading || !logoLoaded} type='image' />

        <img

          src={logo}

          alt='logo'

          className={`absolute inset-0 w-full h-full transition-all duration-200 group-hover:scale-110 rounded-full ${!isLoading && logoLoaded ? 'opacity-100' : 'opacity-0'}`}

        />

      </div>

      <div className='hidden md:flex items-center gap-2'>

        <div className='flex items-center gap-2'>

          <SkeletonWrapper

            loading={isLoading}

            type='title'

            width={120}

            height={24}

          >

            <Typography.Title

              heading={4}

              className='!text-lg !font-semibold !mb-0'

            >

              {systemName}

            </Typography.Title>

          </SkeletonWrapper>

          {(isSelfUseMode || isDemoSiteMode) && !isLoading && (

            <Tag

              color={isSelfUseMode ? 'purple' : 'blue'}

              className='text-xs px-1.5 py-0.5 rounded whitespace-nowrap shadow-sm'

              size='small'

              shape='circle'

            >

              {isSelfUseMode ? t('自用模式') : t('演示站点')}

            </Tag>

          )}

        </div>

      </div>

    </Link>
  );
};

export default HeaderLogo;