coderplanets · mydearxym · Apr 1, 2021 · Apr 1, 2021
diff --git a/src/components/Buttons/DropdownButton/OptionPanel.js b/src/components/Buttons/DropdownButton/OptionPanel.js
@@ -2,7 +2,7 @@ import React from 'react'
 import T from 'prop-types'
 
 import { ICON } from '@/config'
-import { cutFrom } from '@/utils'
+import { cutRest } from '@/utils'
 
 import {
   Wrapper,
@@ -56,7 +56,7 @@ const OptionPanel = ({ options, onClick, panelMinWidth }) => {
               <Title>{item.title}</Title>
               {item.link && <LinkIcon src={`${ICON}/shape/link-hint.svg`} />}
             </Header>
-            <Desc>{cutFrom(item.desc, 26)}</Desc>
+            <Desc>{cutRest(item.desc, 26)}</Desc>
           </Intro>
         </OptionBlock>
       ))}

diff --git a/src/components/Buttons/styles/dropdown_button/option_panel.ts b/src/components/Buttons/styles/dropdown_button/option_panel.ts
@@ -58,7 +58,7 @@ export const Header = styled.div`
   color: ${theme('thread.articleTitle')};
 `
 export const Title = styled.div`
-  ${css.cutFrom('90%')};
+  ${css.cutRest('90%')};
   font-size: 14px;
 `
 export const LinkIcon = styled(Img)`

diff --git a/src/components/CollapseMenu/styles/group.ts b/src/components/CollapseMenu/styles/group.ts
@@ -32,7 +32,7 @@ export const Title = styled.div`
   margin-left: 4px;
   font-size: 14px;
   margin-right: 8px;
-  ${css.cutFrom('85px')};
+  ${css.cutRest('85px')};
 
   ${Header}:hover & {
     opacity: 0.65;

diff --git a/src/components/CollapseMenu/styles/index.ts b/src/components/CollapseMenu/styles/index.ts
@@ -32,7 +32,7 @@ export const Title = styled.div`
   margin-left: 4px;
   font-size: 14px;
   margin-right: 8px;
-  ${css.cutFrom('85px')};
+  ${css.cutRest('85px')};
 
   ${Header}:hover & {
     opacity: 0.65;

diff --git a/src/components/CollapseMenu/styles/item.ts b/src/components/CollapseMenu/styles/item.ts
@@ -15,7 +15,7 @@ export const Wrapper = styled.div<TActive>`
 `
 export const Title = styled.div<TActive>`
   color: ${theme('tags.text')};
-  ${css.cutFrom('200px')};
+  ${css.cutRest('200px')};
   font-size: 14px;
   opacity: 0.9;
   font-weight: ${({ active }) => (active ? 'bold' : 'normal')};

diff --git a/src/components/ContentBanner/styles/index.ts b/src/components/ContentBanner/styles/index.ts
@@ -36,7 +36,7 @@ export const Title = styled.div`
   font-size: 1.5em;
   color: ${theme('thread.articleTitle')};
 
-  ${css.cutFrom('100%')};
+  ${css.cutRest('100%')};
 `
 export const Desc = styled.div`
   ${css.flex('align-center')};

diff --git a/src/components/DiscussLinker/styles/index.ts b/src/components/DiscussLinker/styles/index.ts
@@ -55,7 +55,7 @@ export const GithubIcon = styled(Img)`
 
 export const IssueLink = styled.a`
   color: ${theme('banner.title')};
-  ${css.cutFrom('230px')};
+  ${css.cutRest('230px')};
 
   transition: color 0.2s;
   &:hover {

diff --git a/src/components/FeedsBar/styles/source_selector.ts b/src/components/FeedsBar/styles/source_selector.ts
@@ -30,7 +30,7 @@ export const Icon = styled(Img)`
   ${css.circle(34)};
 `
 export const Title = styled.div`
-  ${css.cutFrom('60px')};
+  ${css.cutRest('60px')};
   text-align: center;
   padding-left: 5px;
   color: ${theme('thread.articleDigest')};

diff --git a/src/components/GalleryHub/PeopleGallery/DeveloperGallery.js b/src/components/GalleryHub/PeopleGallery/DeveloperGallery.js
@@ -8,7 +8,7 @@ import React from 'react'
 import T from 'prop-types'
 
 import { ICON, ASSETS_ENDPOINT } from '@/config'
-import { buildLog, cutFrom } from '@/utils'
+import { buildLog, cutRest } from '@/utils'
 
 import IconText from '@/components/IconText'
 import CardHeader from './CardHeader'
@@ -83,8 +83,8 @@ const DeveloperGallery = ({ items }) => {
           <Body>
             <Avatar src={item.icon} />
             <Intro>
-              <Title>{cutFrom(item.title, 18)}</Title>
-              <Digest>{cutFrom(item.desc, 35)}</Digest>
+              <Title>{cutRest(item.title, 18)}</Title>
+              <Digest>{cutRest(item.desc, 35)}</Digest>
             </Intro>
             <SocialWrapper>social list</SocialWrapper>
           </Body>

diff --git a/src/components/GalleryHub/PeopleGallery/FamePeopleGallery.js b/src/components/GalleryHub/PeopleGallery/FamePeopleGallery.js
@@ -8,7 +8,7 @@ import React from 'react'
 import T from 'prop-types'
 
 import { ICON } from '@/config'
-import { buildLog, cutFrom } from '@/utils'
+import { buildLog, cutRest } from '@/utils'
 
 import IconText from '@/components/IconText'
 import CardHeader from './CardHeader'
@@ -85,7 +85,7 @@ const FamePeopleList = ({ items }) => {
             </Intro>
           </Body>
 
-          <Digest>{cutFrom(item.desc, 50)}</Digest>
+          <Digest>{cutRest(item.desc, 50)}</Digest>
 
           <Footer>
             <IconText iconSrc={`${ICON}/article/heart-solid.svg`}>22</IconText>

diff --git a/src/components/GalleryHub/ProductGallery.js b/src/components/GalleryHub/ProductGallery.js
@@ -9,7 +9,7 @@ import T from 'prop-types'
 import { isEmpty } from 'ramda'
 
 import { ICON } from '@/config'
-import { buildLog, cutFrom } from '@/utils'
+import { buildLog, cutRest } from '@/utils'
 
 import { ArrowButton } from '@/components/Buttons'
 
@@ -142,7 +142,7 @@ const ProductGallery = ({ items }) => {
             </IntroHead>
           </Header>
 
-          {item.desc && <Desc>{cutFrom(item.desc, 50)}</Desc>}
+          {item.desc && <Desc>{cutRest(item.desc, 50)}</Desc>}
           {!item.desc && !isEmpty(item.tags) && (
             <InlineTags items={item.tags} />
           )}

diff --git a/src/components/GalleryHub/SponsorGallery.js b/src/components/GalleryHub/SponsorGallery.js
@@ -8,7 +8,7 @@ import React from 'react'
 import T from 'prop-types'
 
 import { ASSETS_ENDPOINT } from '@/config'
-import { buildLog, cutFrom } from '@/utils'
+import { buildLog, cutRest } from '@/utils'
 
 import { ArrowButton } from '@/components/Buttons'
 
@@ -137,7 +137,7 @@ const SponsorGallery = ({ items, column }) => {
             <IntroImg src={`${ASSETS_ENDPOINT}/works/market1.jpeg`} />
           )}
           {item.desc && (
-            <Desc level={item.level}>{cutFrom(item.desc, 30)}</Desc>
+            <Desc level={item.level}>{cutRest(item.desc, 30)}</Desc>
           )}
           <LinkWrapper>
             <ArrowButton size="tiny">{item.addr}</ArrowButton>

diff --git a/src/components/GalleryHub/styles/people_gallery/fame_people_gallery.ts b/src/components/GalleryHub/styles/people_gallery/fame_people_gallery.ts
@@ -32,7 +32,7 @@ export const Title = styled.div`
   color: ${theme('thread.articleTitle')};
   font-size: 18px;
   cursor: pointer;
-  ${css.cutFrom('200px')};
+  ${css.cutRest('200px')};
 `
 export const AKA = styled.div`
   color: ${theme('thread.articleDigest')};

diff --git a/src/components/GithubRepoPage/Header.js b/src/components/GithubRepoPage/Header.js
@@ -2,7 +2,7 @@ import React from 'react'
 
 import { ICON_CMD } from '@/config'
 
-import { numberWithCommas, cutFrom } from '@/utils'
+import { numberWithCommas, cutRest } from '@/utils'
 import Tooltip from '@/components/Tooltip'
 
 import {
@@ -33,7 +33,7 @@ const TitlesInfo = ({ repo }) => (
     </TitleLink>
     <Slash>/</Slash>
     <TitleLink href={repo.repoUrl} rel="noopener noreferrer" target="_blank">
-      {cutFrom(repo.title, 20)}
+      {cutRest(repo.title, 20)}
     </TitleLink>{' '}
   </TitlesWrapper>
 )

diff --git a/src/components/JobItem/CompanyInfo.js b/src/components/JobItem/CompanyInfo.js
@@ -1,7 +1,7 @@
 import React from 'react'
 import { isEmpty } from 'ramda'
 
-import { cutFrom } from '@/utils'
+import { cutRest } from '@/utils'
 import {
   Wrapper,
   TopHalf,
@@ -24,7 +24,7 @@ const CompanyInfo = ({
     <TopHalf>
       <BaseInfo>
         <Header>
-          <Title>{cutFrom(company, 12)}</Title>
+          <Title>{cutRest(company, 12)}</Title>
         </Header>
         <Middle>
           <StatesWrapper>

diff --git a/src/components/JobItem/JobInfo.js b/src/components/JobItem/JobInfo.js
@@ -2,7 +2,7 @@ import React from 'react'
 import TimeAgo from 'timeago-react'
 
 import { HCN } from '@/constant'
-import { cutFrom } from '@/utils'
+import { cutRest } from '@/utils'
 import InlineCommunities from '@/components/InlineCommunities'
 import InlineTags from '@/components/InlineTags'
 import DotDivider from '@/components/DotDivider'
@@ -44,7 +44,7 @@ const JobInfo = ({
 }) => (
   <Wrapper>
     <Header>
-      <Title onClick={onPreview}>{cutFrom(title, 30)}</Title>
+      <Title onClick={onPreview}>{cutRest(title, 30)}</Title>
       <CommunitiesWrapper>
         <InlineCommunities data={communities} show={community === HCN} />
       </CommunitiesWrapper>

diff --git a/src/components/JobItem/ListView.js b/src/components/JobItem/ListView.js
@@ -2,7 +2,7 @@ import React from 'react'
 import TimeAgo from 'timeago-react'
 
 import { ICON_CMD } from '@/config'
-import { cutFrom, parseDomain } from '@/utils'
+import { cutRest, parseDomain } from '@/utils'
 import InlineTags from '@/components/InlineTags'
 import DotDivider from '@/components/DotDivider'
 
@@ -32,7 +32,7 @@ const ListView = ({ entry, onPreview }) => (
       <TopHalf>
         <Brief onClick={() => onPreview(entry)}>
           <Title>
-            【 {entry.company} 】{cutFrom(entry.title, 45)}
+            【 {entry.company} 】{cutRest(entry.title, 45)}
           </Title>
           {entry.linkAddr && (
             <TitleLink>

diff --git a/src/components/JobItem/styles/company_info.ts b/src/components/JobItem/styles/company_info.ts
@@ -37,14 +37,14 @@ export const Footer = styled.div`
   font-size: 0.8rem;
   color: ${theme('thread.articleDigest')};
   ${css.media.mobile`
-    ${css.cutFrom('100px')};
+    ${css.cutRest('100px')};
   `};
 `
 export const Title = styled.div`
   color: ${theme('thread.articleTitle')};
   font-size: 0.9rem;
   ${css.media.mobile`
-    ${css.cutFrom('90px')};
+    ${css.cutRest('90px')};
   `};
 `
 export const StatesWrapper = styled.div`

diff --git a/src/components/JobItem/styles/job_info.ts b/src/components/JobItem/styles/job_info.ts
@@ -29,7 +29,7 @@ export const Title = styled.div`
   color: ${theme('thread.articleTitle')};
   font-size: 1rem;
   ${css.media.mobile`
-    ${css.cutFrom('150px')};
+    ${css.cutRest('150px')};
 `};
 `
 export const CommunitiesWrapper = styled.div`

diff --git a/src/components/LinksCard/styles/item.ts b/src/components/LinksCard/styles/item.ts
@@ -9,7 +9,7 @@ export const Wrapper = styled.div`
 `
 export const Title = styled.div`
   /* ${css.flex('align-center')}; */
-  ${css.cutFrom('200px')};
+  ${css.cutRest('200px')};
   color: ${theme('banner.desc')};
 
   ${Wrapper}:hover & {

diff --git a/src/components/LoadingEffects/styles/community_holder.ts b/src/components/LoadingEffects/styles/community_holder.ts
@@ -30,6 +30,6 @@ export const CommunitiesText = styled.div`
   margin-bottom: 8px;
 `
 export const BannerText = styled.div`
-  ${css.cutFrom('45px')};
+  ${css.cutRest('45px')};
   text-align: center;
 `
diff --git a/src/components/Navigator/styles/brief_view.ts b/src/components/Navigator/styles/brief_view.ts
@@ -49,7 +49,7 @@ export const CommunityTitle = styled.div`
   font-weight: bold;
   margin-top: -2px;
 
-  ${css.cutFrom('90px')};
+  ${css.cutRest('90px')};
 `
 export const Breadcrumbs = styled.div`
   ${css.flex('align-center')};

diff --git a/src/components/Navigator/styles/more_panel/mobile_view.ts b/src/components/Navigator/styles/more_panel/mobile_view.ts
@@ -51,7 +51,7 @@ export const Title = styled.div`
 `
 export const Desc = styled.div`
   color: ${theme('thread.articleDigest')};
-  ${css.cutFrom('100px')};
+  ${css.cutRest('100px')};
   font-size: 11px;
   margin-top: 2px;
 `

diff --git a/src/components/PostItem/DigestView/DesktopView/Body.js b/src/components/PostItem/DigestView/DesktopView/Body.js
@@ -2,7 +2,7 @@ import React from 'react'
 import TimeAgo from 'timeago-react'
 
 import { ICON } from '@/config'
-import { cutFrom } from '@/utils'
+import { cutRest } from '@/utils'
 
 import Tooltip from '@/components/Tooltip'
 import { SpaceGrow } from '@/components/Common'
@@ -48,7 +48,7 @@ const Body = ({ item, onPreview }) => {
       </Extra>
 
       <DigestSentence top={5} right={140} onPreview={() => onPreview(item)}>
-        {cutFrom(item.digest, 90)}
+        {cutRest(item.digest, 90)}
       </DigestSentence>
     </Wrapper>
   )

diff --git a/src/components/PostItem/DigestView/MobileView/Footer.js b/src/components/PostItem/DigestView/MobileView/Footer.js
@@ -1,6 +1,6 @@
 import React from 'react'
 
-import { cutFrom } from '@/utils'
+import { cutRest } from '@/utils'
 import { ICON_CMD } from '@/config'
 
 import DotDivider from '@/components/DotDivider'
@@ -28,7 +28,7 @@ const Footer = ({ item }) => {
           {item.commentsCount}
         </ExtraTexts>
       </Extra>
-      <BodyDigest>{cutFrom(item.digest, 20)}</BodyDigest>
+      <BodyDigest>{cutRest(item.digest, 20)}</BodyDigest>
     </Wrapper>
   )
 }

diff --git a/src/components/PostItem/ListView.js b/src/components/PostItem/ListView.js
@@ -3,7 +3,7 @@ import TimeAgo from 'timeago-react'
 
 import { ICON_CMD } from '@/config'
 
-import { cutFrom, parseDomain } from '@/utils'
+import { cutRest, parseDomain } from '@/utils'
 import InlineTags from '@/components/InlineTags'
 
 import {
@@ -27,7 +27,7 @@ const ListView = ({ entry, onPreview }) => (
     <Main>
       <TopHalf>
         <Brief onClick={() => onPreview(entry)}>
-          <Title>{cutFrom(entry.title, 45)}</Title>
+          <Title>{cutRest(entry.title, 45)}</Title>
           {entry.linkAddr && (
             <TitleLink>
               <LinkIcon src={`${ICON_CMD}/link.svg`} />

diff --git a/src/components/PostItem/styles/list_view.ts b/src/components/PostItem/styles/list_view.ts
@@ -92,7 +92,7 @@ export const BodyDigest = styled.li`
   max-width: 85%;
 
   ${css.media.mobile`
-    ${css.cutFrom('250px')};
+    ${css.cutRest('250px')};
 `};
 `
 export const CommentWrapper = styled.div`

diff --git a/src/components/RepoItem/Header.js b/src/components/RepoItem/Header.js
@@ -2,7 +2,7 @@ import React from 'react'
 
 import { ICON_CMD } from '@/config'
 
-import { cutFrom, numberWithCommas } from '@/utils'
+import { cutRest, numberWithCommas } from '@/utils'
 import Tooltip from '@/components/Tooltip'
 import { Space } from '@/components/Common'
 import InlineTags from '@/components/InlineTags'
@@ -34,7 +34,7 @@ const Header = ({ entry, onPreview }) => {
           <LangDot color={entry.primaryLanguage.color} />
         </Tooltip>
         <Owner>{entry.ownerName}</Owner>
-        <RepoName> / {cutFrom(entry.title, 20)}</RepoName>
+        <RepoName> / {cutRest(entry.title, 20)}</RepoName>
         <TagsWrapper>
           <InlineTags data={entry.tags} />
         </TagsWrapper>

diff --git a/src/components/RepoItem/index.js b/src/components/RepoItem/index.js
@@ -7,7 +7,7 @@
 import React from 'react'
 import T from 'prop-types'
 
-import { buildLog, cutFrom } from '@/utils'
+import { buildLog, cutRest } from '@/utils'
 import { C11N } from '@/constant'
 
 import ArticleItemPrefixLabel from '@/components/ArticleItemPrefixLabel'
@@ -28,7 +28,7 @@ const RepoItem = ({ entry, active, onPreview, accountInfo }) => (
       topOffset="22px"
     />
     <Header entry={entry} onPreview={() => onPreview(entry)} />
-    <BodyDigest>{cutFrom(entry.desc, 180)}</BodyDigest>
+    <BodyDigest>{cutRest(entry.desc, 180)}</BodyDigest>
     <Footer
       contributors={entry.contributors}
       author={entry.author}