Find my orgs filter verified

api/src/organization/loaders/load-organization-connections-by-user-id.js

@@ -19,6 +19,7 @@ export const loadOrgConnectionsByUserId = ({
   search,
   isAdmin,
   includeSuperAdminOrg,
+  isVerified,
 }) => {
   const userDBId = `users/${userKey}`
 
@@ -372,12 +373,18 @@ export const loadOrgConnectionsByUserId = ({
     includeSuperAdminOrgQuery = aql`FILTER org.orgDetails.en.slug != "super-admin" OR org.orgDetails.fr.slug != "super-admin"`
   }
 
+  let isVerifiedQuery = aql``
+  if (isVerified) {
+    isVerifiedQuery = aql`FILTER org.verified == true`
+  }
+
   let orgKeysQuery
   if (isSuperAdmin) {
     orgKeysQuery = aql`
         WITH claims, domains, organizations, organizationSearch
         LET orgKeys = (
           FOR org IN organizations
+          ${isVerifiedQuery}
           ${includeSuperAdminOrgQuery}
           RETURN org._key
         )
@@ -388,8 +395,8 @@ export const loadOrgConnectionsByUserId = ({
         LET orgKeys = (
           FOR org, e IN 1..1
           INBOUND ${userDBId} affiliations
-          FILTER e.permission == "admin"
-          OR e.permission == "super_admin"
+          FILTER e.permission == "admin" OR e.permission == "super_admin"
+          ${isVerifiedQuery}
           ${includeSuperAdminOrgQuery}
           RETURN org._key
         )
@@ -400,6 +407,7 @@ export const loadOrgConnectionsByUserId = ({
         WITH claims, domains, organizations, organizationSearch
         LET orgKeys = (
           FOR org IN organizations
+            ${isVerifiedQuery}
             FILTER org.orgDetails.en.slug != "super-admin" OR org.orgDetails.fr.slug != "super-admin"
             RETURN org._key
         )
@@ -410,6 +418,7 @@ export const loadOrgConnectionsByUserId = ({
         LET orgKeys = (
           FOR org, e IN 1..1
           INBOUND ${userDBId} affiliations
+          ${isVerifiedQuery}
           ${includeSuperAdminOrgQuery}
           RETURN org._key
         )

api/src/organization/queries/find-my-organizations.js

@@ -22,8 +22,11 @@ export const findMyOrganizations = {
     },
     includeSuperAdminOrg: {
       type: GraphQLBoolean,
-      description:
-        'Filter org list to either include or exclude the super admin org.',
+      description: 'Filter org list to either include or exclude the super admin org.',
+    },
+    isVerified: {
+      type: GraphQLBoolean,
+      description: 'Filter org list to include only verified organizations.',
     },
     ...connectionArgs,
   },
@@ -32,12 +35,7 @@ export const findMyOrganizations = {
     args,
     {
       userKey,
-      auth: {
-        checkSuperAdmin,
-        userRequired,
-        verifiedRequired,
-        loginRequiredBool,
-      },
+      auth: { checkSuperAdmin, userRequired, verifiedRequired, loginRequiredBool },
       loaders: { loadOrgConnectionsByUserId },
     },
   ) => {

frontend/mocking/faked_schema.js

@@ -112,6 +112,9 @@ export const getTypeNames = () => gql`
       # Filter org list to either include or exclude the super admin org.
       includeSuperAdminOrg: Boolean
 
+      # Filter org list to include only verified organizations.
+      isVerified: Boolean
+
       # Returns the items in the list that come after the specified cursor.
       after: String
 

frontend/src/graphql/queries.js

@@ -9,13 +9,15 @@ export const PAGINATED_ORGANIZATIONS = gql`
     $direction: OrderDirection!
     $search: String
     $includeSuperAdminOrg: Boolean
+    $isVerified: Boolean
   ) {
     findMyOrganizations(
       after: $after
       first: $first
       orderBy: { field: $field, direction: $direction }
       search: $search
       includeSuperAdminOrg: $includeSuperAdminOrg
+      isVerified: $isVerified
     ) {
       edges {
         cursor

frontend/src/organizations/Organizations.js

@@ -1,11 +1,11 @@
 import React, { useCallback, useState } from 'react'
 import { t, Trans } from '@lingui/macro'
 import { ListOf } from '../components/ListOf'
-import { Box, Divider, Flex, Heading, IconButton, Text, useDisclosure } from '@chakra-ui/react'
+import { Box, Divider, Flex, Heading, IconButton, Switch, Text, useDisclosure } from '@chakra-ui/react'
 import { ErrorBoundary } from 'react-error-boundary'
 
 import { OrganizationCard } from './OrganizationCard'
-
+import { CheckCircleIcon } from '@chakra-ui/icons'
 import { ErrorFallbackMessage } from '../components/ErrorFallbackMessage'
 import { LoadingMessage } from '../components/LoadingMessage'
 import { RelayPaginationControls } from '../components/RelayPaginationControls'
@@ -28,6 +28,7 @@ export default function Organizations() {
   const [orgsPerPage, setOrgsPerPage] = useState(10)
   const { isOpen: inviteRequestIsOpen, onOpen, onClose } = useDisclosure()
   const [orgInfo, setOrgInfo] = useState({})
+  const [isVerified, setIsVerified] = useState(true)
 
   const memoizedSetDebouncedSearchTermCallback = useCallback(() => {
     setDebouncedSearchTerm(searchTerm)
@@ -45,6 +46,7 @@ export default function Organizations() {
         direction: orderDirection,
         search: debouncedSearchTerm,
         includeSuperAdminOrg: false,
+        isVerified,
       },
       fetchPolicy: 'cache-and-network',
       nextFetchPolicy: 'cache-first',
@@ -166,6 +168,16 @@ export default function Organizations() {
           placeholder={t`Search for an organization`}
           onToggle={onToggle}
         />
+        <Flex align="center" mb="2">
+          <Switch
+            isFocusable={true}
+            aria-label="Show only verified organizations"
+            mx="2"
+            defaultChecked={isVerified}
+            onChange={(e) => setIsVerified(e.target.checked)}
+          />
+          <CheckCircleIcon color="blue.500" boxSize="icons.md" />
+        </Flex>
         {orgList}
         <RelayPaginationControls
           onlyPagination={false}