mirror of
https://github.com/SomboChea/ui
synced 2024-05-04 02:21:36 +07:00
42d3bb8508
* refactor: convert class to func * refactor: changed login form logic * refactor: conver to testing-library tests * refactor: moved dependency * refactor: replaced uglifyjs-webpack-plugin by terser-webpack-plugin * fix: fixed e2e errors * fix: fixed e2e test * Delete settings.json * fix: vscode settings rollback * refactor: rollback webpack config * refactor: updated eslint rule * fix: removed --fix * refactor: incresed the bundle size
78 lines
2.0 KiB
TypeScript
78 lines
2.0 KiB
TypeScript
import React from 'react';
|
|
import styled from '@emotion/styled';
|
|
|
|
import Avatar from '../../muiComponents/Avatar';
|
|
import Text from '../../muiComponents/Text';
|
|
import ListItem from '../../muiComponents/ListItem';
|
|
import ListItemText from '../../muiComponents/ListItemText';
|
|
import { isURL } from '../../utils/url';
|
|
import CopyToClipBoard from '../CopyToClipBoard';
|
|
import List from '../../muiComponents/List';
|
|
import { DetailContext } from '../../pages/Version';
|
|
import { Theme } from '../../design-tokens/theme';
|
|
import { fontWeight } from '../../utils/styles/sizes';
|
|
|
|
import git from './img/git.png';
|
|
|
|
const StyledText = styled(Text)({
|
|
fontWeight: fontWeight.bold,
|
|
textTransform: 'capitalize',
|
|
});
|
|
|
|
const GithubLink = styled('a')<{ theme?: Theme }>(props => ({
|
|
color: props.theme && props.theme.palette.primary.main,
|
|
}));
|
|
|
|
const RepositoryListItem = styled(ListItem)({
|
|
padding: 0,
|
|
':hover': {
|
|
backgroundColor: 'transparent',
|
|
},
|
|
});
|
|
|
|
const RepositoryListItemText = styled(ListItemText)({
|
|
padding: '0 10px',
|
|
margin: 0,
|
|
});
|
|
|
|
const Repository: React.FC = () => {
|
|
const detailContext = React.useContext(DetailContext);
|
|
|
|
const { packageMeta } = detailContext;
|
|
|
|
if (!packageMeta?.latest?.repository?.url || !isURL(packageMeta.latest.repository.url)) {
|
|
return null;
|
|
}
|
|
|
|
const { url } = packageMeta.latest.repository;
|
|
|
|
const getCorrectRepositoryURL = (): string => {
|
|
if (!url.includes('git+')) {
|
|
return url;
|
|
}
|
|
|
|
return url.split('git+')[1];
|
|
};
|
|
|
|
const repositoryURL = getCorrectRepositoryURL();
|
|
|
|
return (
|
|
<List dense={true} subheader={<StyledText variant="subtitle1">{'Repository'}</StyledText>}>
|
|
<RepositoryListItem button={true}>
|
|
<Avatar src={git} />
|
|
<RepositoryListItemText
|
|
primary={
|
|
<CopyToClipBoard text={repositoryURL}>
|
|
<GithubLink href={repositoryURL} target="_blank">
|
|
{repositoryURL}
|
|
</GithubLink>
|
|
</CopyToClipBoard>
|
|
}
|
|
/>
|
|
</RepositoryListItem>
|
|
</List>
|
|
);
|
|
};
|
|
|
|
export default Repository;
|