card counts

rxb · Nov 15, 2022 · 7dba0b5 · 7dba0b5
1 parent 3be9e90
commit 7dba0b5
Show file tree

Hide file tree

Showing 5 changed files with 61 additions and 36 deletions.
diff --git a/packages/backend/src/services/tldrs/tldrs.hooks.js b/packages/backend/src/services/tldrs/tldrs.hooks.js
@@ -85,6 +85,36 @@ const publishToVersion = (options) => {
   }
 }
 
+const updateCategoryCount = (options) => {
+  return async (context) => {
+    // get the category of this card
+    let categoryId;
+    if(context.dispatch.categoryId){
+      categoryId = context.dispatch.categoryId
+    }
+    else{
+      // for patch actions... category isn't available in context.data
+      const tldr = await context.app.service('tldrs').get(context.dispatch.id);
+      categoryId = tldr.categoryId;
+    }
+
+    // query the number of tldrs in category
+    const categoryTldrs = await context.service.find({
+      query: {
+        categoryId: categoryId,
+        currentTldrVersionId: {$ne: null},
+        $limit: 0 // count
+      }
+    });
+
+    // update the count in the category
+    const category = await context.app.service('categories').patch(categoryId, {
+      tldrCount: categoryTldrs.total
+    });
+    return context;
+  }
+}
+
 const noDraftsExceptForSelf = (options) => {
   return async (context) => {
     // if asking for a users authorId tldrs
@@ -174,7 +204,8 @@ module.exports = {
       setField({
         from: 'params.user.id',
         as: 'data.authorId'
-      })
+      }),
+
     ],
     update: [
       authenticate('jwt'),
@@ -184,7 +215,7 @@ module.exports = {
     patch: [
       authenticate('jwt'),
       mustBeOwnerOrAdmin(),
-      publishToVersion()
+      publishToVersion(),
     ],
     remove: [
       // TODO: should you really be able to completely delete a card?
@@ -200,10 +231,16 @@ module.exports = {
     ],
     find: [],
     get: [],
-    create: [],
+    create: [
+      updateCategoryCount()
+    ],
     update: [],
-    patch: [],
-    remove: []
+    patch: [
+      updateCategoryCount()
+    ],
+    remove: [
+      updateCategoryCount()
+    ]
   },
 
   error: {

diff --git a/packages/frontend/components/tldr/components.js b/packages/frontend/components/tldr/components.js
@@ -118,7 +118,9 @@ export const TldrCard = (props) => {
 					<Flex>
 						<FlexItem>
 							<Inline nowrap>
+								{/*
 								<Avatar style={{ height: 12, width: 12, opacity: .75 }} source={{ uri: 'https://randomuser.me/api/portraits/women/18.jpg' }} />
+								*/}
 								<Text type="small" inverted color="secondary">
 									@{tldr.author.urlKey} / {tldr.urlKey}
 								</Text>
@@ -129,11 +131,13 @@ export const TldrCard = (props) => {
 								<Text type="small" inverted color="secondary">
 									v.{thisVersion.version}
 								</Text>
+								{/*
 								<Icon
 									shape="ChevronDown"
 									size="small"
 									color={SWATCHES.textSecondaryInverted}
 								/>
+								*/}
 							</Inline>
 						</FlexItem>
 					</Flex>

diff --git a/packages/frontend/pages/_app.js b/packages/frontend/pages/_app.js
@@ -58,6 +58,7 @@ function ThisApp(props) {
 		feathersClient.reAuthenticate()
 			.then(storeAuth)
 			.catch((error) => {
+				console.log('catch authentication error');
 				dispatch(logOut());
 				checkForBadOauth(error);
 		});

diff --git a/packages/frontend/pages/tldr/edit.js b/packages/frontend/pages/tldr/edit.js
@@ -280,13 +280,14 @@ const Edit = (props) => {
 							</Chunk>
 						</Section>
 						<Section>
-							<form>
+							<form autocomplete="off">
 
 								<RevealBlock visible={formStep >= 0} delay={300}>
 									<Chunk>
 										<Label for="title">What is your card about?</Label>
 										<TextInput
-											id="verb"
+											aria-autocomplete="none"
+											autoComplete="off"
 											placeholder="verb (ex. baking, choosing, visiting)"
 											value={formState.getFieldValue('verb')}
 											onChange={e => {
@@ -300,7 +301,7 @@ const Edit = (props) => {
 										/>
 
 										<TextInput
-											id="verb"
+											id="noun"
 											placeholder="noun (ex. bread, a major, Tokyo)"
 											value={formState.getFieldValue('noun')}
 											onChange={e => {

diff --git a/packages/frontend/pages/tldr/tldr.js b/packages/frontend/pages/tldr/tldr.js
@@ -16,6 +16,7 @@ import { saveLoginRedirect, getProfilePageUrl, getVersionEditPageUrl, getTldrEdi
 import {
 	Animated,
 	Avatar,
+	Bounce,
 	Bounds,
 	Button,
 	Card,
@@ -377,25 +378,6 @@ const VoteButtons = (props) => {
 	} = props;
 
 
-	const voteAnim = useRef(new Animated.Value(1)).current;
-	const bounceVote = () => {
-		Animated.sequence([
-			Animated.timing(voteAnim, {
-				toValue: 1.4,
-				duration: 75
-			 }),
-			 Animated.timing(voteAnim, {
-				toValue: 1,
-				duration: 75
-			 }),
-		]).start();
-	 };
-
-	 useEffect(()=>{
-		bounceVote();
-	 }, [tldr?.data?.voteResult]);
-
-
 	return(
 		<>
 		<Flex flush>
@@ -420,15 +402,9 @@ const VoteButtons = (props) => {
 						textAlign: 'center'
 					}
 				]}>
-					<Animated.View
-						style={{
-							transform: [
-								{ scale: voteAnim }
-							]
-						}}
-						>
+					<Bounce watchProp={tldr.data.voteResult} scale={1.4}>
 						<Text weight="strong">{abbreviateNumber(tldr.data.voteResult)}</Text>
-					</Animated.View>
+					</Bounce>
 				</View>
 			</FlexItem>
 			<FlexItem flush>
@@ -488,18 +464,22 @@ const ActionButtons = (props) => {
 						>Share</Text>
 				</FlexItem>
 				<FlexItem nbsp>
+
 					<Button
 						shape="Bookmark"
 						color={tldr.data.currentUserSaved ? 'primary' : 'secondary'}
 						width="full"
 						onPress={onPressSave}
 					/>
+
+					<Bounce watchProp={tldr.data.currentUserSaved ? 1 : 0}>
 					<Text																	 	
 					 	type="micro" 
 						color="hint" 
 						style={[styles.hide, { alignSelf: 'center' }]}
 						dataSet={{ media: ids["showAt__large"] }}
 						>{tldr.data.currentUserSaved ? 'Saved' : 'Save'}</Text>
+						</Bounce>
 				</FlexItem>
 				<FlexItem nbsp>
 					<Button
@@ -837,12 +817,14 @@ function Tldr(props) {
 													<Text weight="strong">Issues ({tldr.data.issueCount})</Text>
 													<Text type="small" color="secondary">Help improve this card</Text>
 												</FlexItem>
+												{/*
 												<FlexItem shrink justify="center" style={{ paddingHorizontal: 3 }}>
 													<Icon
 														color={SWATCHES.textSecondary}
 														shape="MessageCircle"
 													/>
 												</FlexItem>
+												*/}
 											</Flex>
 										</Link>
 									</Chunk>
@@ -856,7 +838,7 @@ function Tldr(props) {
 												</FlexItem>
 												<FlexItem shrink justify="center" style={{ paddingHorizontal: 3 }}>
 													<Avatar
-														size="small"
+														size="mid"
 														source={{ uri: tldr.data.author.photoUrl }} />
 												</FlexItem>
 											</Flex>