From 29beb1dc8090e9cec31915319cb02970c37842cc Mon Sep 17 00:00:00 2001
From: monoid <qaswedfr55@gmail.com>
Date: Fri, 15 Jan 2021 21:51:36 +0900
Subject: [PATCH] shortening info tag

---
 src/client/component/contentinfo.tsx | 32 +++++++++++++++++-----------
 src/client/component/tagchip.tsx     | 13 +++++++++--
 2 files changed, 31 insertions(+), 14 deletions(-)

diff --git a/src/client/component/contentinfo.tsx b/src/client/component/contentinfo.tsx
index 5d2d484..3e90593 100644
--- a/src/client/component/contentinfo.tsx
+++ b/src/client/component/contentinfo.tsx
@@ -43,9 +43,9 @@ const useStyles = makeStyles((theme: Theme) => ({
         overflowY: 'hidden',
     },
     short_subinfoContainer:{
-        [theme.breakpoints.up("xs")]:{
+        [theme.breakpoints.down("md")]:{
             display:'none',
-        }
+        },
     },
     short_root:{
         overflowY:'hidden',
@@ -103,8 +103,10 @@ export const ContentInfo = (props: {
         <Link className={propclasses.thumbnail_anchor || thumbnail_anchor} component={RouterLink} to={{
             pathname:makeContentReaderUrl(document.id)
         }}>
-            <ThumbnailContainer content={document} 
-                className={propclasses.thumbnail_content || thumbnail_content}/>
+            {document.deleted_at === null ? 
+            (<ThumbnailContainer content={document} 
+                className={propclasses.thumbnail_content || thumbnail_content}/>)
+            : (<Typography className={propclasses.thumbnail_content || thumbnail_content} variant='h4'>Deleted</Typography>)}
         </Link>
         <Box className={propclasses.infoContainer || classes.infoContainer}>
             <Link variant='h5' color='inherit' component={RouterLink} to={{
@@ -114,14 +116,20 @@ export const ContentInfo = (props: {
                 {document.title}
             </Link>
             <Box className={propclasses.subinfoContainer || subinfoContainer}>
-                <Typography variant='subtitle1'>Artist</Typography>
-                <Box style={{ alignSelf: "center" }}>{artists.join(", ")}</Box>
-                <Typography variant='subtitle1'>Tags</Typography>
-                <Box className={propclasses.tag_list || classes.tag_list}>
-                    {allTag.map(x => {
-                        return (<TagChip key={x} label={x} clickable={true} tagname={x} size="small"></TagChip>);
-                    })}
-                </Box>
+                {props.short ? (<Box className={propclasses.tag_list || classes.tag_list}>{document.tags.map(x => 
+                                (<TagChip key={x} label={x} clickable={true} tagname={x} size="small"></TagChip>)
+                            )}</Box>) : (
+                    <>
+                        <Typography variant='subtitle1'>Artist</Typography>
+                        <Box style={{ alignSelf: "center" }}>{artists.join(", ")}</Box>
+                        <Typography variant='subtitle1'>Tags</Typography>
+                        <Box className={propclasses.tag_list || classes.tag_list}>
+                            {allTag.map(x => {
+                                return (<TagChip key={x} label={x} clickable={true} tagname={x} size="small"></TagChip>);
+                            })}
+                        </Box>
+                    </>)
+                }
             </Box>
         </Box>
     </Paper>);
diff --git a/src/client/component/tagchip.tsx b/src/client/component/tagchip.tsx
index 9e2bb2e..08ca771 100644
--- a/src/client/component/tagchip.tsx
+++ b/src/client/component/tagchip.tsx
@@ -59,6 +59,15 @@ export const ColorChip = (props:Omit<ChipProps,"color"> & {color: string})=>{
 }
 
 export const TagChip = (props:Omit<ChipProps,"color"> & {tagname: string})=>{
-    const {tagname,...rest} = props;
-    return <ColorChip color={getTagColorName(tagname)} {...rest}></ColorChip>;
+    const {tagname,label,...rest} = props;
+    let newlabel:string|undefined = undefined;
+    if(typeof label === "string"){
+        if(label.startsWith("female:")){
+            newlabel ="♀ "+label.substr(7);
+        }
+        else if(label.startsWith("male:")){
+            newlabel = "♂ "+label.substr(5);
+        }
+    }
+    return <ColorChip color={getTagColorName(tagname)} label={newlabel||label} {...rest}></ColorChip>;
 }
\ No newline at end of file