Merge branch 'main' into update-globaleaks-repo

Author: seanmarcia

.github/ISSUE_TEMPLATE/suggest_project.yml

@@ -31,7 +31,6 @@ body:
       options:
         - label: "Yes"
         - label: "No"
-          required: true
   - type: checkboxes
     id: SDGs
     attributes:

.github/workflows/deploy.yml

@@ -72,7 +72,7 @@ jobs:
           skip_checkout: true
           push_options: '--force'
       - name: Upload artifact
-        uses: actions/upload-pages-artifact@v1
+        uses: actions/upload-pages-artifact@v3.0.1
         with:
           path: ./out
 
@@ -86,4 +86,4 @@ jobs:
     steps:
       - name: Deploy to GitHub Pages
         id: deployment
-        uses: actions/deploy-pages@v1
+        uses: actions/deploy-pages@v4.0.5

.github/workflows/pr.yml

@@ -44,6 +44,6 @@ jobs:
         env:
           GH_PERSONAL_ACCESS_TOKEN: ${{ secrets.GH_PERSONAL_ACCESS_TOKEN }}
       - name: Upload artifact
-        uses: actions/upload-pages-artifact@v1
+        uses: actions/upload-pages-artifact@v3.0.1
         with:
           path: ./out

CONTRIBUTING.md

@@ -15,7 +15,6 @@ Please note that this project is released with a [Contributor Code of Conduct](C
 
 1. [Fork][fork] and clone the repository
 1. Configure and install the dependencies: `npm install`
-1. Make sure the tests pass on your machine: `npm run test`
 1. Make sure linter passes on your machine: `npm run lint`
 1. Create a new branch: `git checkout -b my-branch-name`
 1. Make your change, add tests, and make sure the tests and linter still pass

components/RepositoryItem.tsx

@@ -14,6 +14,7 @@ type RepositoryItemProps = {
 
 export const RepositoryItem = ({ repository }: RepositoryItemProps) => {
   const [isIssueOpen, setIsIssueOpen] = useState(false);
+  const [isIssuesListVisible, setIsIssuesListVisible] = useState(false);
 
   dayjs.extend(relativeTime);
   const useLastModified = (date: string) => {
@@ -25,10 +26,20 @@ export const RepositoryItem = ({ repository }: RepositoryItemProps) => {
   };
   const lastModified = useLastModified(repository.last_modified);
 
+  useEffect(() => {
+    if (isIssueOpen) {
+      setIsIssuesListVisible(true);
+    } else {
+      // Delay unmounting to allow close animation to complete
+      const timer = setTimeout(() => setIsIssuesListVisible(false), 300);
+      return () => clearTimeout(timer);
+    }
+  }, [isIssueOpen]);
+
   return (
     <div className="repo-item">
-      <div id={`repo-${repository.id}`} onClick={() => setIsIssueOpen(!isIssueOpen)}>
-        <div>
+      <div id={`repo-${repository.id}`}>
+        <div onClick={() => setIsIssueOpen(!isIssueOpen)}>
           <RepositoryItemTopBar
             isIssueOpen={isIssueOpen}
             repositoryHasNewIssues={repository.has_new_issues}
@@ -50,7 +61,9 @@ export const RepositoryItem = ({ repository }: RepositoryItemProps) => {
             />
           </div>
         </div>
-        {isIssueOpen && <IssuesList issues={repository.issues} />}
+        <div className={`repo-item__issues-warper ${isIssueOpen ? 'open' : ''}`}>
+          {isIssuesListVisible && <IssuesList issues={repository.issues} />}
+        </div>
       </div>
     </div>
   );