Merge branch 'feat/tamagui_landing_page' of https://github.com/andrew…

…-bierman/PackRat into feat/tamagui_landing_page
andrew-bierman · Sep 9, 2024 · 06b60b2 · 06b60b2
2 parents 226c3c3 + a1416e7
commit 06b60b2
Show file tree

Hide file tree

Showing 74 changed files with 1,315 additions and 629 deletions.
diff --git a/.github/workflows/tauri-build.yml b/.github/workflows/tauri-build.yml
@@ -1,10 +1,9 @@
-name: tauri-build
+name: Tauri Build and Publish
 
 on:
   push:
-    branches: ['**']
-  pull_request:
-    branches: ['**']
+    tags:
+      - 'v*'
 
 concurrency:
   group: ${{ github.workflow }}-${{ github.ref }}
@@ -30,7 +29,7 @@ jobs:
             args: ''
 
     permissions:
-      contents: read
+      contents: write
       pull-requests: write
 
     steps:
@@ -72,65 +71,17 @@ jobs:
         env:
           GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
         with:
-          # tagName: app-v__VERSION__
-          # releaseName: 'App v__VERSION__'
-          # releaseBody: 'See the assets to download this version and install.'
-          # releaseDraft: true
-          # prerelease: false
+          tagName: ${{ github.ref_name }}
+          releaseName: 'App v${{ github.ref_name }}'
+          releaseBody: 'See the assets to download this version and install.'
+          draft: false
+          prerelease: false
           args: ${{ matrix.args }}
 
-      - name: Find or create comment
-        if: github.event_name == 'pull_request'
-        uses: actions/github-script@v6
-        id: find_or_create_comment
+      - name: Upload Tauri Artifacts (RPM and DEB)
+        uses: actions/upload-artifact@v3
         with:
-          github-token: ${{ secrets.GITHUB_TOKEN }}
-          script: |
-            const commentIdentifier = '<!-- build_results -->';
-            const comments = await github.rest.issues.listComments({
-              issue_number: context.issue.number,
-              owner: context.repo.owner,
-              repo: context.repo.repo,
-            });
-
-            const existingComment = comments.data.find(comment => comment.body.startsWith(commentIdentifier));
-
-            if (existingComment) {
-              core.setOutput('comment_id', existingComment.id);
-            } else {
-              const commentBody = `${commentIdentifier}\n🚀 Tauri build started... Please wait for the results! 🕐`;
-              const { data: { id: commentId } } = await github.rest.issues.createComment({
-                issue_number: context.issue.number,
-                owner: context.repo.owner,
-                repo: context.repo.repo,
-                body: commentBody
-              });
-              core.setOutput('comment_id', commentId);
-            }
-
-      - name: Update PR comment
-        if: always() && github.event_name == 'pull_request'
-        uses: actions/github-script@v6
-        with:
-          github-token: ${{ secrets.GITHUB_TOKEN }}
-          script: |
-            const commentIdentifier = '<!-- build_results -->';
-            const commentId = '${{ steps.find_or_create_comment.outputs.comment_id }}';
-            const buildOutcome = '${{ job.status }}';
-            const buildStatus = buildOutcome == 'success' ? 'completed' : 'failed';
-            const workflowUrl = `https://github.com/${context.repo.owner}/${context.repo.repo}/actions/runs/${context.runId}`;
-
-            let commentBody = `${commentIdentifier}\nTauri build ${buildStatus}!`;
-
-            if (buildOutcome == 'success') {
-              commentBody += `\nYou can download the build artifacts from the following link:\n${workflowUrl}#artifacts`;
-            } else {
-              commentBody += '\nPlease check the workflow logs for more details on the build failure.';
-            }
-
-            await github.rest.issues.updateComment({
-              owner: context.repo.owner,
-              repo: context.repo.repo,
-              comment_id: commentId,
-              body: commentBody
-            });
+          name: tauri-artifacts-${{ matrix.platform }}
+          path: |
+            apps/tauri/src-tauri/target/release/bundle/deb/**
+            apps/tauri/src-tauri/target/release/bundle/rpm/**
diff --git a/apps/expo/app.json b/apps/expo/app.json
@@ -7,6 +7,9 @@
     "icon": "./assets/packrat-app-icon.png",
     "userInterfaceStyle": "automatic",
     "scheme": "packrat",
+    "splash": {
+      "image": "./assets/splash.png"
+    },
     "assetBundlePatterns": ["**/*"],
     "ios": {
       "supportsTablet": true,
@@ -53,7 +56,8 @@
             }
           }
         }
-      ]
+      ],
+      ["./translucent-default-splash-screen-config"]
     ],
     "extra": {
       "eas": {

diff --git a/apps/expo/assets/splash.png b/apps/expo/assets/splash.png
diff --git a/apps/expo/package.json b/apps/expo/package.json
@@ -102,6 +102,7 @@
     "expo-image-picker": "~14.7.1",
     "expo-linear-gradient": "~12.7.2",
     "expo-linking": "~6.2.2",
+    "expo-local-authentication": "~13.8.0",
     "expo-location": "~16.5.5",
     "expo-random": "~13.6.0",
     "expo-router": "~3.4.10",

diff --git a/apps/expo/translucent-default-splash-screen-config.js b/apps/expo/translucent-default-splash-screen-config.js
@@ -0,0 +1,39 @@
+/**
+ * @module withSplashWindowIsTranslucent
+ * @description Custom expo plugin that makes the {@link https://developer.android.com/develop/ui/views/launch/splash-screen/migrate|default splash screen (android 12+)} transparent.
+ * This is a temporary work around for the {@link https://github.com/zoontek/react-native-bootsplash/issues/496|double splash screen issue}.
+ *
+ *
+ * Credits: {@link https://github.com/expo/expo/issues/16084#issuecomment-1261330440}
+ */
+
+const { AndroidConfig, withAndroidStyles } = require('@expo/config-plugins');
+
+const withSplashWindowIsTranslucent = (config) => {
+  return withAndroidStyles(config, async (config) => {
+    config.modResults = await configureFullScreenDialog(config.modResults);
+    return config;
+  });
+};
+
+async function configureFullScreenDialog(styles) {
+  const splashScreen = styles.resources.style.find(
+    (style) => style.$.name === 'Theme.App.SplashScreen',
+  );
+
+  if (splashScreen) {
+    splashScreen.item = splashScreen.item.filter(
+      (item) => item.$.name !== 'android:windowIsTranslucent',
+    );
+    splashScreen.item.push(
+      AndroidConfig.Resources.buildResourceItem({
+        name: 'android:windowIsTranslucent',
+        value: true,
+      }),
+    );
+  }
+
+  return styles;
+}
+
+module.exports = withSplashWindowIsTranslucent;
diff --git a/packages/app/components/Fab/Fab.tsx b/packages/app/components/Fab/Fab.tsx
@@ -10,6 +10,10 @@ const FAB = () => {
     setShowQuickActions((prev) => !prev);
   };
 
+  const closeQuickActions = () => {
+    setShowQuickActions(false);
+  };
+
   return Platform.OS === 'web' ? (
     <FABWeb
       showQuickActions={showQuickActions}
@@ -19,6 +23,7 @@ const FAB = () => {
     <FABNative
       showQuickActions={showQuickActions}
       toggleQuickActions={toggleQuickActions}
+      closeQuickActions={closeQuickActions}
     />
   );
 };

diff --git a/packages/app/components/Fab/FabNative.tsx b/packages/app/components/Fab/FabNative.tsx
@@ -4,14 +4,18 @@ import { MaterialIcons } from '@expo/vector-icons';
 import useCustomStyles from 'app/hooks/useCustomStyles';
 import { QuickActionsSection } from '../../modules/dashboard';
 
-const FABNative = ({ showQuickActions, toggleQuickActions }) => {
+const FABNative = ({
+  showQuickActions,
+  toggleQuickActions,
+  closeQuickActions,
+}) => {
   const styles = useCustomStyles(loadStyles);
 
   return (
     <>
       {showQuickActions && (
         <View style={styles.quickActionsContainer}>
-          <QuickActionsSection />
+          <QuickActionsSection closeQuickActions={closeQuickActions} />
         </View>
       )}
       <TouchableOpacity style={styles.fab} onPress={toggleQuickActions}>

diff --git a/packages/app/components/ScoreContainer.tsx b/packages/app/components/ScoreContainer.tsx
@@ -32,6 +32,7 @@ const ScoreProgressChart: React.FC<ScoreProgressChartProps> = ({
     size,
     strokeWidth,
   );
+  const { currentTheme } = useTheme();
 
   return (
     <RStack style={styles.container}>
@@ -41,18 +42,18 @@ const ScoreProgressChart: React.FC<ScoreProgressChartProps> = ({
             cx={size / 2}
             cy={size / 2}
             r={radius}
-            stroke="#EEE"
+            stroke={currentTheme.colors.text}
             strokeWidth={strokeWidth / 2}
             fill="transparent"
           />
           <Circle
             cx={size / 2}
             cy={size / 2}
             r={radius}
-            stroke="#3F51B5"
+            stroke={currentTheme.colors.secondaryBlue}
             strokeWidth={strokeWidth}
-            strokeDasharray={`${circumference} ${circumference}`}
-            strokeDashoffset={circumference - progressPath}
+            strokeDasharray={`${progressPath} ${circumference - progressPath}`}
+            strokeDashoffset={0.25 * circumference}
             strokeLinecap="round"
             fill="transparent"
           />
@@ -93,74 +94,66 @@ const GradingPieChart: React.FC<GradingPieChartProps> = ({
     radius,
     circleCircumference,
     total,
+    weightPath,
+    essentialItemsPath,
+    redundancyAndVersatilityPath,
     weightStrokeDashoffset,
-    essentialItemsStrokeDashoffset,
+    essentailItemsStrokeDashoffset,
     redundancyAndVersatilityStrokeDashoffset,
-    essentialItemsAngle,
-    redundancyAndVersatilityAngle,
   } = useGradingPie(scores);
 
+  const { currentTheme } = useTheme();
+
   return (
     <RStack style={styles.container}>
       <RStack style={styles.graphWrapper}>
         <Svg height="150" width="150" viewBox="0 0 180 180">
-          <G rotation={-90} originX="90" originY="90">
-            {total === 0 ? (
+          {total === 0 ? (
+            <Circle
+              cx="50%"
+              cy="50%"
+              r={radius}
+              stroke="#F1F6F9"
+              fill="transparent"
+              strokeWidth="10"
+            />
+          ) : (
+            <>
+              <Circle
+                cx="50%"
+                cy="50%"
+                r={radius}
+                stroke={currentTheme.colors.text}
+                fill="transparent"
+                strokeWidth="10"
+                strokeDasharray={`${weightPath} ${circleCircumference - weightPath}`}
+                strokeDashoffset={weightStrokeDashoffset}
+                strokeLinecap="round"
+              />
               <Circle
                 cx="50%"
                 cy="50%"
                 r={radius}
-                stroke="#F1F6F9"
+                stroke={currentTheme.colors.secondaryBlue}
                 fill="transparent"
-                strokeWidth="40"
+                strokeWidth="10"
+                strokeDasharray={`${essentialItemsPath} ${circleCircumference - essentialItemsPath}`}
+                strokeDashoffset={essentailItemsStrokeDashoffset}
+                strokeLinecap="round"
               />
-            ) : (
-              <>
-                <Circle
-                  cx="50%"
-                  cy="50%"
-                  r={radius}
-                  stroke="#F05454"
-                  fill="transparent"
-                  strokeWidth="40"
-                  strokeDasharray={circleCircumference}
-                  strokeDashoffset={weightStrokeDashoffset}
-                  rotation={0}
-                  originX="90"
-                  originY="90"
-                  strokeLinecap="round"
-                />
-                <Circle
-                  cx="50%"
-                  cy="50%"
-                  r={radius}
-                  stroke="#30475E"
-                  fill="transparent"
-                  strokeWidth="40"
-                  strokeDasharray={circleCircumference}
-                  strokeDashoffset={essentialItemsStrokeDashoffset}
-                  rotation={essentialItemsAngle}
-                  originX="90"
-                  originY="90"
-                  strokeLinecap="round"
-                />
-                <Circle
-                  cx="50%"
-                  cy="50%"
-                  r={radius}
-                  stroke="#222831"
-                  fill="transparent"
-                  strokeWidth="40"
-                  strokeDasharray={circleCircumference}
-                  strokeDashoffset={redundancyAndVersatilityStrokeDashoffset}
-                  rotation={redundancyAndVersatilityAngle}
-                  originX="90"
-                  originY="90"
-                  strokeLinecap="round"
-                />
-              </>
-            )}
-          </G>
+              <Circle
+                cx="50%"
+                cy="50%"
+                r={radius}
+                stroke={currentTheme.colors.tertiaryBlue}
+                fill="transparent"
+                strokeWidth="10"
+                strokeDasharray={`${redundancyAndVersatilityPath} ${circleCircumference - redundancyAndVersatilityPath}`}
+                strokeDashoffset={redundancyAndVersatilityStrokeDashoffset}
+                strokeLinecap="round"
+              />
+            </>
+          )}
         </Svg>
         <RText style={styles.label}>{total.toFixed(2)}</RText>
       </RStack>
@@ -207,10 +200,10 @@ export const ScoreContainer: React.FC<ScoreContainerProps> = ({
           <RText style={styles.scoreText}>
             {isAlreadyScored ? title : 'Score this pack!'}
           </RText>
-          <RText style={{ fontWeight: 500, color: currentTheme.colors.white }}>
+          <RText style={{ fontWeight: 500, color: currentTheme.colors.text }}>
             {subheader}
           </RText>
-          <RText style={{ fontWeight: 300, color: currentTheme.colors.white }}>
+          <RText style={{ fontWeight: 300, color: currentTheme.colors.text }}>
             {description}
           </RText>
           {isOwner && (