chore(svg-icons): to ts & fix warnings (#1059)

mydearxym · web-flow · commit 1bfc7c9c81a8 · 2021-04-10T13:42:21.000+08:00
diff --git a/src/components/ArticleItemPrefixLabel/styles/index.ts b/src/components/ArticleItemPrefixLabel/styles/index.ts
@@ -17,7 +17,7 @@ export const ReadedLabel = styled.div<{ topOffset: string }>`
     font-size: 0.8rem;
   `};
 `
-export const PinIcon = styled(PinSVG)`
+export const PinIcon = styled(PinSVG)<{ top: string }>`
   fill: ${theme('thread.articleDigest')};
   position: absolute;
   ${css.size(18)};
diff --git a/src/components/InlineTags/styles/index.ts b/src/components/InlineTags/styles/index.ts
@@ -25,7 +25,7 @@ export const Title = styled.div`
   `};
 `
 export const MoreText = styled.div``
-export const HashSign = styled(HashTagSVG)`
+export const HashSign = styled(HashTagSVG)<{ color: string }>`
   fill: ${({ color }) => color};
   ${css.size(12)};
   transform: rotate(18deg);
diff --git a/src/components/SvgIcons/HashTagSVG.tsx b/src/components/SvgIcons/HashTagSVG.tsx
@@ -1,6 +1,6 @@
 import React from 'react'
 
-function SvgComponent(props) {
+const SvgComponent: React.FC = (props) => {
   return (
     <svg
       className="prefix__icon"
diff --git a/src/components/SvgIcons/HeaderMailSVG.tsx b/src/components/SvgIcons/HeaderMailSVG.tsx
@@ -1,6 +1,6 @@
 import React from 'react'
 
-const SvgComponent = (props) => (
+const SvgComponent: React.FC = (props) => (
   <svg
     className="prefix__icon"
     viewBox="0 0 1024 1024"
diff --git a/src/components/SvgIcons/HeaderSearchSVG.tsx b/src/components/SvgIcons/HeaderSearchSVG.tsx
@@ -1,6 +1,6 @@
 import React from 'react'
 
-const SvgComponent = (props) => (
+const SvgComponent: React.FC = (props) => (
   <svg
     className="prefix__icon"
     viewBox="0 0 1024 1024"
diff --git a/src/components/SvgIcons/HeaderStatesSVG.tsx b/src/components/SvgIcons/HeaderStatesSVG.tsx
@@ -1,6 +1,6 @@
 import React from 'react'
 
-const SvgComponent = (props) => (
+const SvgComponent: React.FC = (props) => (
   <svg
     className="prefix__icon"
     viewBox="0 0 1024 1024"
diff --git a/src/components/SvgIcons/PinSVG.tsx b/src/components/SvgIcons/PinSVG.tsx
@@ -1,6 +1,6 @@
 import React from 'react'
 
-const SvgComponent = (props) => (
+const SvgComponent: React.FC = (props) => (
   <svg
     className="prefix__icon"
     viewBox="0 0 1024 1024"
diff --git a/src/components/SvgIcons/TabAISVG.tsx b/src/components/SvgIcons/TabAISVG.tsx
@@ -1,6 +1,6 @@
 import React from 'react'
 
-const SvgComponent = (props) => (
+const SvgComponent: React.FC = (props) => (
   <svg
     className="prefix__icon"
     viewBox="0 0 1024 1024"
diff --git a/src/components/SvgIcons/TabBackendSVG.tsx b/src/components/SvgIcons/TabBackendSVG.tsx
@@ -1,6 +1,6 @@
 import React from 'react'
 
-const SvgComponent = (props) => (
+const SvgComponent: React.FC = (props) => (
   <svg
     className="prefix__icon"
     viewBox="0 0 1024 1024"
diff --git a/src/components/SvgIcons/TabBillingSVG.tsx b/src/components/SvgIcons/TabBillingSVG.tsx
@@ -1,6 +1,6 @@
 import React from 'react'
 
-const SvgComponent = (props) => (
+const SvgComponent: React.FC = (props) => (
   <svg
     className="prefix__icon"
     viewBox="0 0 1367 1024"
diff --git a/src/components/SvgIcons/TabBlockChainSVG.tsx b/src/components/SvgIcons/TabBlockChainSVG.tsx
@@ -1,6 +1,6 @@
 import React from 'react'
 
-const SvgComponent = (props) => (
+const SvgComponent: React.FC = (props) => (
   <svg
     className="prefix__icon"
     viewBox="0 0 1024 1024"
diff --git a/src/components/SvgIcons/TabCheatsheetSVG.tsx b/src/components/SvgIcons/TabCheatsheetSVG.tsx
@@ -1,6 +1,6 @@
 import React from 'react'
 
-const SvgComponent = (props) => (
+const SvgComponent: React.FC = (props) => (
   <svg
     className="prefix__icon"
     viewBox="0 0 1024 1024"
diff --git a/src/components/SvgIcons/TabCitySVG.tsx b/src/components/SvgIcons/TabCitySVG.tsx
@@ -1,6 +1,6 @@
 import React from 'react'
 
-const SvgComponent = (props) => (
+const SvgComponent: React.FC = (props) => (
   <svg
     className="prefix__icon"
     viewBox="0 0 1024 1024"
diff --git a/src/components/SvgIcons/TabCommentsSVG.tsx b/src/components/SvgIcons/TabCommentsSVG.tsx
@@ -1,6 +1,6 @@
 import React from 'react'
 
-const SvgComponent = (props) => (
+const SvgComponent: React.FC = (props) => (
   <svg
     className="prefix__icon"
     viewBox="0 0 1024 1024"
diff --git a/src/components/SvgIcons/TabDesignSVG.tsx b/src/components/SvgIcons/TabDesignSVG.tsx
@@ -1,6 +1,6 @@
 import React from 'react'
 
-const SvgComponent = (props) => (
+const SvgComponent: React.FC = (props) => (
   <svg
     className="prefix__icon"
     viewBox="0 0 1113 1024"
diff --git a/src/components/SvgIcons/TabFavoritesSVG.tsx b/src/components/SvgIcons/TabFavoritesSVG.tsx
@@ -1,6 +1,6 @@
 import React from 'react'
 
-const SvgComponent = (props) => (
+const SvgComponent: React.FC = (props) => (
   <svg
     className="prefix__icon"
     viewBox="0 0 1024 1024"
diff --git a/src/components/SvgIcons/TabFrontendSVG.tsx b/src/components/SvgIcons/TabFrontendSVG.tsx
@@ -1,6 +1,6 @@
 import React from 'react'
 
-const SvgComponent = (props) => (
+const SvgComponent: React.FC = (props) => (
   <svg
     className="prefix__icon"
     viewBox="0 0 1024 1024"
diff --git a/src/components/SvgIcons/TabJobSVG.tsx b/src/components/SvgIcons/TabJobSVG.tsx
@@ -1,6 +1,6 @@
 import React from 'react'
 
-const SvgComponent = (props) => (
+const SvgComponent: React.FC = (props) => (
   <svg
     className="prefix__icon"
     viewBox="0 0 1024 1024"
diff --git a/src/components/SvgIcons/TabLikesSVG.tsx b/src/components/SvgIcons/TabLikesSVG.tsx
@@ -1,6 +1,6 @@
 import React from 'react'
 
-const SvgComponent = (props) => (
+const SvgComponent: React.FC = (props) => (
   <svg
     className="prefix__icon"
     viewBox="0 0 1068 1024"
diff --git a/src/components/SvgIcons/TabMobileSVG.tsx b/src/components/SvgIcons/TabMobileSVG.tsx
@@ -1,6 +1,6 @@
 import React from 'react'
 
-const SvgComponent = (props) => (
+const SvgComponent: React.FC = (props) => (
   <svg
     className="prefix__icon"
     viewBox="0 0 1024 1024"
diff --git a/src/components/SvgIcons/TabPlSVG.tsx b/src/components/SvgIcons/TabPlSVG.tsx
@@ -1,6 +1,6 @@
 import React from 'react'
 
-const SvgComponent = (props) => (
+const SvgComponent: React.FC = (props) => (
   <svg
     className="prefix__icon"
     viewBox="0 0 1152 1024"
diff --git a/src/components/SvgIcons/TabPostSVG.tsx b/src/components/SvgIcons/TabPostSVG.tsx
@@ -1,6 +1,6 @@
 import React from 'react'
 
-const SvgComponent = (props) => (
+const SvgComponent: React.FC = (props) => (
   <svg
     className="prefix__icon"
     viewBox="0 0 1024 1024"
diff --git a/src/components/SvgIcons/TabPublishSVG.tsx b/src/components/SvgIcons/TabPublishSVG.tsx
@@ -1,6 +1,6 @@
 import React from 'react'
 
-const SvgComponent = (props) => (
+const SvgComponent: React.FC = (props) => (
   <svg
     className="prefix__icon"
     viewBox="0 0 1024 1024"
diff --git a/src/components/SvgIcons/TabRadarSVG.tsx b/src/components/SvgIcons/TabRadarSVG.tsx
@@ -1,6 +1,6 @@
 import React from 'react'
 
-const SvgComponent = (props) => (
+const SvgComponent: React.FC = (props) => (
   <svg
     className="prefix__icon"
     viewBox="0 0 1024 1024"
diff --git a/src/components/SvgIcons/TabRepoSVG.tsx b/src/components/SvgIcons/TabRepoSVG.tsx
@@ -1,6 +1,6 @@
 import React from 'react'
 
-const SvgComponent = (props) => (
+const SvgComponent: React.FC = (props) => (
   <svg
     className="prefix__icon"
     viewBox="0 0 1024 1024"
diff --git a/src/components/SvgIcons/TabSettingsSVG.tsx b/src/components/SvgIcons/TabSettingsSVG.tsx
@@ -1,6 +1,6 @@
 import React from 'react'
 
-const SvgComponent = (props) => (
+const SvgComponent: React.FC = (props) => (
   <svg
     className="prefix__icon"
     viewBox="0 0 1024 1024"
diff --git a/src/components/SvgIcons/TabShareSVG.tsx b/src/components/SvgIcons/TabShareSVG.tsx
@@ -1,6 +1,6 @@
 import React from 'react'
 
-const SvgComponent = (props) => (
+const SvgComponent: React.FC = (props) => (
   <svg
     className="prefix__icon"
     viewBox="0 0 1152 1024"
diff --git a/src/components/SvgIcons/TabTechSVG.tsx b/src/components/SvgIcons/TabTechSVG.tsx
@@ -1,6 +1,6 @@
 import React from 'react'
 
-const SvgComponent = (props) => (
+const SvgComponent: React.FC = (props) => (
   <svg
     className="prefix__icon"
     viewBox="0 0 1024 1024"
diff --git a/src/components/SvgIcons/TabUserSVG.tsx b/src/components/SvgIcons/TabUserSVG.tsx
@@ -1,6 +1,6 @@
 import React from 'react'
 
-const SvgComponent = (props) => (
+const SvgComponent: React.FC = (props) => (
   <svg
     className="prefix__icon"
     viewBox="0 0 1219 1024"
diff --git a/src/components/SvgIcons/TabVideoSVG.tsx b/src/components/SvgIcons/TabVideoSVG.tsx
@@ -1,6 +1,6 @@
 import React from 'react'
 
-const SvgComponent = (props) => (
+const SvgComponent: React.FC = (props) => (
   <svg
     className="prefix__icon"
     viewBox="0 0 1024 1024"
diff --git a/src/components/SvgIcons/TabWikiSVG.tsx b/src/components/SvgIcons/TabWikiSVG.tsx
@@ -1,6 +1,6 @@
 import React from 'react'
 
-const SvgComponent = (props) => (
+const SvgComponent: React.FC = (props) => (
   <svg
     className="prefix__icon"
     viewBox="0 0 1427 1024"
diff --git a/src/containers/unit/TagsBar/styles/desktop_view/tag_item.ts b/src/containers/unit/TagsBar/styles/desktop_view/tag_item.ts
@@ -35,7 +35,8 @@ const getActiveColor = (active, color, activeid) => {
   return !active ? color : '#497684'
 }
 
-export const HashSign = styled(HashTagSVG)`
+type THashSign = TActive & { color: string; activeid: string; inline: boolean }
+export const HashSign = styled(HashTagSVG)<THashSign>`
   fill: ${({ active, color, activeid }) =>
     getActiveColor(active, color, activeid)};
   ${css.size(14)};

Original file line number	Diff line number	Diff line change
@@ -17,7 +17,7 @@ export const ReadedLabel = styled.div<{ topOffset: string }>`
`17`	`17`	`font-size: 0.8rem;`
`18`	`18`	`};
`19`	`19`	`
`20`		-export const PinIcon = styled(PinSVG)`
	`20`	+export const PinIcon = styled(PinSVG)<{ top: string }>`
`21`	`21`	`fill: ${theme('thread.articleDigest')};`
`22`	`22`	`position: absolute;`
`23`	`23`	`${css.size(18)};`
Original file line number	Diff line number	Diff line change
@@ -25,7 +25,7 @@ export const Title = styled.div`
`25`	`25`	`};
`26`	`26`	`
`27`	`27`	export const MoreText = styled.div``
`28`		-export const HashSign = styled(HashTagSVG)`
	`28`	+export const HashSign = styled(HashTagSVG)<{ color: string }>`
`29`	`29`	`fill: ${({ color }) => color};`
`30`	`30`	`${css.size(12)};`
`31`	`31`	`transform: rotate(18deg);`