@ndla/ui 20.0.3 → 22.0.1

package/lib/TreeStructure/types.d.ts

@@ -0,0 +1,33 @@
+/**
+ * Copyright (c) 2022-present, NDLA.
+ *
+ * This source code is licensed under the GPLv3 license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ */
+import { MouseEvent, ReactNode } from 'react';
+import { IFolder, IResource } from '@ndla/types-learningpath-api';
+import { MenuItemProps } from '@ndla/button/src';
+export interface FolderType extends IFolder {
+    icon?: ReactNode;
+}
+export interface TreeStructureMenuProps extends Omit<MenuItemProps, 'onClick'> {
+    onClick: (e: MouseEvent<HTMLDivElement> | undefined, folder: FolderType) => void;
+}
+export interface CommonTreeStructureProps {
+    loading?: boolean;
+    onSelectFolder?: (id: string) => void;
+    openOnFolderClick?: boolean;
+    menuItems?: TreeStructureMenuProps[];
+    targetResource?: IResource;
+}
+export interface CommonFolderItemsProps extends CommonTreeStructureProps {
+    focusedFolderId?: string;
+    level: number;
+    selectedFolder?: FolderType;
+    onCloseFolder: (id: string) => void;
+    onOpenFolder: (id: string) => void;
+    setFocusedId: (id: string) => void;
+    setSelectedFolder: (id: FolderType) => void;
+    visibleFolders: string[];
+}

package/lib/index.d.ts

@@ -88,4 +88,4 @@ export type { SnackBarItem } from './SnackBar';
 export { SnackBar } from './SnackBar';
 export { InfoBlock } from './InfoBlock';
 export { TreeStructure } from './TreeStructure';
-export type { FolderStructureProps, TreeStructureProps } from './TreeStructure';
+export type { FolderType, TreeStructureProps, TreeStructureMenuProps } from './TreeStructure';

package/lib/locale/messages-en.d.ts

@@ -64,6 +64,8 @@ declare const messages: {
             edit: string;
             missingName: string;
         };
+        tags: string;
+        tags_plural: string;
         confirmDeleteFolder: string;
         confirmDeleteTag: string;
         myFolders: string;
@@ -74,6 +76,7 @@ declare const messages: {
         favourites: string;
         addToFavourites: string;
         alreadyFavourited: string;
+        alreadyInFolder: string;
         help: string;
         more: string;
         listView: string;
@@ -82,6 +85,9 @@ declare const messages: {
         myPage: {
             myPage: string;
             logout: string;
+            loginTerms: string;
+            loginResourcePitch: string;
+            loginWelcome: string;
             deleteAccount: string;
             welcome: string;
             read: {
@@ -118,6 +124,8 @@ declare const messages: {
         resource: {
             add: string;
             remove: string;
+            removeTitle: string;
+            confirmRemove: string;
             copyLink: string;
             addToMyNdla: string;
             addedToMyNdla: string;

package/lib/locale/messages-en.js

@@ -959,6 +959,8 @@ var messages = _objectSpread(_objectSpread({
       edit: 'Edit',
       missingName: 'Folder name required'
     },
+    tags: '{{count}} tag',
+    tags_plural: '{{count}} tags',
     confirmDeleteFolder: 'Are you sure you want to delete this folder? This process cannot be undone.',
     confirmDeleteTag: 'Are you sure you want to delete this tag? This process cannot be undone.',
     myFolders: 'My folders',
@@ -969,6 +971,7 @@ var messages = _objectSpread(_objectSpread({
     favourites: 'Favourites',
     addToFavourites: 'Add to my favourites',
     alreadyFavourited: 'Already in my favourites',
+    alreadyInFolder: 'Already in folder',
     help: 'Help',
     more: 'More options',
     listView: 'List view',
@@ -977,6 +980,9 @@ var messages = _objectSpread(_objectSpread({
     myPage: {
       myPage: 'My page',
       logout: 'Log out of My NDLA',
+      loginTerms: 'Log in with Feide to receive access. By logging on your accept your terms of service',
+      loginResourcePitch: 'Do you want to favorite this page?',
+      loginWelcome: 'Welcome to My NDLA! This page allows you to organize your articles in your <i>own</i> way!',
       deleteAccount: 'Delete My NDLA',
       welcome: 'Welcome to my NDLA! You can now save your favourite resources from NDLA and organise them in folders with tags',
       read: {
@@ -1013,6 +1019,8 @@ var messages = _objectSpread(_objectSpread({
     resource: {
       add: 'Add folder/tag',
       remove: 'Remove',
+      removeTitle: 'Remove resource',
+      confirmRemove: 'Are you sure you want to remove the resource from this folder?',
       copyLink: 'Copy link to this page',
       addToMyNdla: 'Add to My NDLA',
       addedToMyNdla: 'Added to My NDLA'

package/lib/locale/messages-nb.d.ts

@@ -64,6 +64,8 @@ declare const messages: {
             edit: string;
             missingName: string;
         };
+        tags: string;
+        tags_plural: string;
         confirmDeleteFolder: string;
         confirmDeleteTag: string;
         myFolders: string;
@@ -74,6 +76,7 @@ declare const messages: {
         favourites: string;
         addToFavourites: string;
         alreadyFavourited: string;
+        alreadyInFolder: string;
         help: string;
         more: string;
         listView: string;
@@ -83,6 +86,9 @@ declare const messages: {
             myPage: string;
             deleteAccount: string;
             logout: string;
+            loginTerms: string;
+            loginResourcePitch: string;
+            loginWelcome: string;
             welcome: string;
             read: {
                 our: string;
@@ -118,6 +124,8 @@ declare const messages: {
         resource: {
             add: string;
             remove: string;
+            removeTitle: string;
+            confirmRemove: string;
             copyLink: string;
             addToMyNdla: string;
             addedToMyNdla: string;

package/lib/locale/messages-nb.js

@@ -959,6 +959,8 @@ var messages = _objectSpread(_objectSpread({
       edit: 'Rediger',
       missingName: 'Mappenavn er påkrevd'
     },
+    tags: '{{count}} tag',
+    tags_plural: '{{count}} tags',
     confirmDeleteFolder: 'Er du sikker på at du vil slette mappen? Denne handlingen kan ikke angres.',
     confirmDeleteTag: 'Er du sikker på at du vil slette tag? Denne handlingen kan ikke angres.',
     myFolders: 'Mine mapper',
@@ -969,6 +971,7 @@ var messages = _objectSpread(_objectSpread({
     favourites: 'Favoritter',
     addToFavourites: 'Legg til i mine favoritter',
     alreadyFavourited: 'Allerede lagt til i mine favoritter',
+    alreadyInFolder: 'Finnes allerede i mappen',
     help: 'Hjelp',
     more: 'Flere valg',
     listView: 'Listevisning',
@@ -978,6 +981,9 @@ var messages = _objectSpread(_objectSpread({
       myPage: 'Min side',
       deleteAccount: 'Slett Min NDLA',
       logout: 'Logg ut av Min NDLA',
+      loginTerms: 'Logg på med Feide for å få tilgang. Ved å logge på godkjenner du våre vilkår for bruk',
+      loginResourcePitch: 'Ønsker du å favorittmerke denne siden?',
+      loginWelcome: 'Velkommen til NDLA! Her kan du organisere fagstoffet på <i>din</i> måte!',
       welcome: 'Velkommen til Min NDLA! Nå kan du lagre dine favorittressurser fra NDLA og organisere dem slik du ønsker i mapper og med tags.',
       read: {
         our: 'Les våre',
@@ -1013,6 +1019,8 @@ var messages = _objectSpread(_objectSpread({
     resource: {
       add: 'Legg til mappe/tag',
       remove: 'Fjern',
+      removeTitle: 'Fjern ressurs',
+      confirmRemove: 'Er du sikker på at du ønsker å fjerne ressursen fra denne mappen?',
       copyLink: 'Kopier lenke til siden',
       addToMyNdla: 'Legg i Min NDLA',
       addedToMyNdla: 'Lagt i Min NDLA'

package/lib/locale/messages-nn.d.ts

@@ -64,6 +64,8 @@ declare const messages: {
             edit: string;
             missingName: string;
         };
+        tags: string;
+        tags_plural: string;
         confirmDeleteFolder: string;
         confirmDeleteTag: string;
         myFolders: string;
@@ -74,6 +76,7 @@ declare const messages: {
         favourites: string;
         addToFavourites: string;
         alreadyFavourited: string;
+        alreadyInFolder: string;
         help: string;
         more: string;
         listView: string;
@@ -83,6 +86,9 @@ declare const messages: {
             myPage: string;
             deleteAccount: string;
             logout: string;
+            loginTerms: string;
+            loginResourcePitch: string;
+            loginWelcome: string;
             welcome: string;
             read: {
                 our: string;
@@ -118,6 +124,8 @@ declare const messages: {
         resource: {
             add: string;
             remove: string;
+            removeTitle: string;
+            confirmRemove: string;
             copyLink: string;
             addToMyNdla: string;
             addedToMyNdla: string;

package/lib/locale/messages-nn.js

@@ -959,6 +959,8 @@ var messages = _objectSpread(_objectSpread({
       edit: 'Rediger',
       missingName: 'Mappenavn er påkrevd'
     },
+    tags: '{{count}} tag',
+    tags_plural: '{{count}} tags',
     confirmDeleteFolder: 'Er du sikker på at du vil slette mappa? Denne handlinga kan ikkje angres.',
     confirmDeleteTag: 'Er du sikker på at du vil slette tag? Denne handlinga kan ikkje angres.',
     myFolders: 'Mine mapper',
@@ -969,6 +971,7 @@ var messages = _objectSpread(_objectSpread({
     favourites: 'Favorittar',
     addToFavourites: 'Legg til i mine favorittar',
     alreadyFavourited: 'Allereie lagt til i mine favorittar',
+    alreadyInFolder: 'Finnes allereie i mappa',
     help: 'Hjelp',
     more: 'Fleire val',
     listView: 'Listevisning',
@@ -978,6 +981,9 @@ var messages = _objectSpread(_objectSpread({
       myPage: 'Min side',
       deleteAccount: 'Slett Min NDLA',
       logout: 'Logg ut av Min NDLA',
+      loginTerms: 'Logg på med Feide for å få tilgang. Ved å logge på godkjennar du våre vilkår for bruk',
+      loginResourcePitch: 'Ønsker du å favorittmerke denne sida?',
+      loginWelcome: 'Velkommen til NDLA! Her kan du organisere fagstoffet på <i>din</i> måte!',
       welcome: 'Velkommen til Min NDLA! Nå kan du lagre dine favorittressurser fra NDLA og organisere dem slik du ønsker i mapper og med tags.',
       read: {
         our: 'Les våre',
@@ -1013,6 +1019,8 @@ var messages = _objectSpread(_objectSpread({
     resource: {
       add: 'Legg til mappe/tag',
       remove: 'Fjern',
+      removeTitle: 'Fjern ressurs',
+      confirmRemove: 'Er du sikker på at du ønsker å fjerne ressursen frå denne mappen?',
       copyLink: 'Kopier lenke til sida',
       addToMyNdla: 'Legg i Min NDLA',
       addedToMyNdla: 'Lagt i Min NDLA'

package/lib/locale/messages-se.d.ts

@@ -64,6 +64,8 @@ declare const messages: {
             edit: string;
             missingName: string;
         };
+        tags: string;
+        tags_plural: string;
         confirmDeleteFolder: string;
         confirmDeleteTag: string;
         myFolders: string;
@@ -74,6 +76,7 @@ declare const messages: {
         favourites: string;
         addToFavourites: string;
         alreadyFavourited: string;
+        alreadyInFolder: string;
         help: string;
         more: string;
         listView: string;
@@ -83,6 +86,9 @@ declare const messages: {
             myPage: string;
             deleteAccount: string;
             logout: string;
+            loginTerms: string;
+            loginResourcePitch: string;
+            loginWelcome: string;
             welcome: string;
             read: {
                 our: string;
@@ -118,6 +124,8 @@ declare const messages: {
         resource: {
             add: string;
             remove: string;
+            removeTitle: string;
+            confirmRemove: string;
             copyLink: string;
             addToMyNdla: string;
             addedToMyNdla: string;

package/lib/locale/messages-se.js

@@ -959,6 +959,8 @@ var messages = _objectSpread(_objectSpread({
       edit: 'Rediger',
       missingName: 'Mappenavn er påkrevd'
     },
+    tags: '{{count}} tag',
+    tags_plural: '{{count}} tags',
     confirmDeleteFolder: 'Er du sikker på at du vil slette mappen? Denne handlingen kan ikke angres.',
     confirmDeleteTag: 'Er du sikker på at du vil slette tag? Denne handlingen kan ikke angres.',
     myFolders: 'Mine mapper',
@@ -969,6 +971,7 @@ var messages = _objectSpread(_objectSpread({
     favourites: 'Favoritter',
     addToFavourites: 'Legg til i mine favoritter',
     alreadyFavourited: 'Allerede lagt til i mine favoritter',
+    alreadyInFolder: 'Finnes allerede i mappen',
     help: 'Hjelp',
     more: 'Flere valg',
     listView: 'Listevisning',
@@ -978,6 +981,9 @@ var messages = _objectSpread(_objectSpread({
       myPage: 'Min side',
       deleteAccount: 'Slett Min NDLA',
       logout: 'Logg ut av Min NDLA',
+      loginTerms: 'Logg på med Feide for å få tilgang. Ved å logge på godkjennar du våre vilkår for bruk',
+      loginResourcePitch: 'Ønsker du å favorittmerke denne sida?',
+      loginWelcome: 'Velkommen til NDLA! Her kan du organisere fagstoffet på <i>din</i> måte!',
       welcome: 'Velkommen til Min NDLA! Nå kan du lagre dine favorittressurser fra NDLA og organisere dem slik du ønsker i mapper og med tags.',
       read: {
         our: 'Les våre',
@@ -1013,6 +1019,8 @@ var messages = _objectSpread(_objectSpread({
     resource: {
       add: 'Legg til mappe/tag',
       remove: 'Fjern',
+      removeTitle: 'Fjern ressurs',
+      confirmRemove: 'Er du sikker på at du ønsker å fjerne ressursen frå denne mappen?',
       copyLink: 'Kopier lenke til siden',
       addToMyNdla: 'Legg i Min NDLA',
       addedToMyNdla: 'Lagt i Min NDLA'

package/lib/locale/messages-sma.d.ts

@@ -64,6 +64,8 @@ declare const messages: {
             edit: string;
             missingName: string;
         };
+        tags: string;
+        tags_plural: string;
         confirmDeleteFolder: string;
         confirmDeleteTag: string;
         myFolders: string;
@@ -74,6 +76,7 @@ declare const messages: {
         favourites: string;
         addToFavourites: string;
         alreadyFavourited: string;
+        alreadyInFolder: string;
         help: string;
         more: string;
         listView: string;
@@ -83,6 +86,9 @@ declare const messages: {
             myPage: string;
             deleteAccount: string;
             logout: string;
+            loginTerms: string;
+            loginResourcePitch: string;
+            loginWelcome: string;
             welcome: string;
             read: {
                 our: string;
@@ -118,6 +124,8 @@ declare const messages: {
         resource: {
             add: string;
             remove: string;
+            removeTitle: string;
+            confirmRemove: string;
             copyLink: string;
             addToMyNdla: string;
             addedToMyNdla: string;

package/lib/locale/messages-sma.js

@@ -959,6 +959,8 @@ var messages = _objectSpread(_objectSpread({
       edit: 'Rediger',
       missingName: 'Mappenavn er påkrevd'
     },
+    tags: '{{count}} tag',
+    tags_plural: '{{count}} tags',
     confirmDeleteFolder: 'Er du sikker på at du vil slette mappen? Denne handlingen kan ikke angres.',
     confirmDeleteTag: 'Er du sikker på at du vil slette tag? Denne handlingen kan ikke angres.',
     myFolders: 'Mine mapper',
@@ -969,6 +971,7 @@ var messages = _objectSpread(_objectSpread({
     favourites: 'Favoritter',
     addToFavourites: 'Legg til i mine favoritter',
     alreadyFavourited: 'Allerede lagt til i mine favoritter',
+    alreadyInFolder: 'Finnes allerede i mappen',
     help: 'Hjelp',
     more: 'Flere valg',
     listView: 'Listevisning',
@@ -978,6 +981,9 @@ var messages = _objectSpread(_objectSpread({
       myPage: 'Min side',
       deleteAccount: 'Slett Min NDLA',
       logout: 'Logg ut av Min NDLA',
+      loginTerms: 'Logg på med Feide for å få tilgang. Ved å logge på godkjennar du våre vilkår for bruk',
+      loginResourcePitch: 'Ønsker du å favorittmerke denne sida?',
+      loginWelcome: 'Velkommen til NDLA! Her kan du organisere fagstoffet på <i>din</i> måte!',
       welcome: 'Velkommen til Min NDLA! Nå kan du lagre dine favorittressurser fra NDLA og organisere dem slik du ønsker i mapper og med tags.',
       read: {
         our: 'Les våre',
@@ -1013,6 +1019,8 @@ var messages = _objectSpread(_objectSpread({
     resource: {
       add: 'Legg til mappe/tag',
       remove: 'Fjern',
+      removeTitle: 'Fjern ressurs',
+      confirmRemove: 'Er du sikker på at du ønsker å fjerne ressursen frå denne mappen?',
       copyLink: 'Kopier lenke til siden',
       addToMyNdla: 'Legg i Min NDLA',
       addedToMyNdla: 'Lagt i Min NDLA'

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ndla/ui",
-  "version": "20.0.3",
+  "version": "22.0.1",
   "description": "UI component library for NDLA.",
   "license": "GPL-3.0",
   "main": "lib/index.js",
@@ -31,19 +31,20 @@
     "types"
   ],
   "dependencies": {
-    "@ndla/button": "^3.1.5",
-    "@ndla/carousel": "^1.2.14",
-    "@ndla/core": "^2.3.2",
-    "@ndla/forms": "^3.1.2",
+    "@ndla/button": "^3.2.0",
+    "@ndla/carousel": "^1.2.15",
+    "@ndla/core": "^2.3.3",
+    "@ndla/forms": "^3.1.3",
     "@ndla/hooks": "^1.1.4",
-    "@ndla/icons": "^1.11.2",
-    "@ndla/licenses": "^5.0.5",
-    "@ndla/modal": "^1.2.15",
-    "@ndla/notion": "^3.1.25",
-    "@ndla/safelink": "^2.2.3",
-    "@ndla/switch": "^0.1.9",
-    "@ndla/tabs": "^1.1.13",
-    "@ndla/tooltip": "^2.1.4",
+    "@ndla/icons": "^1.11.3",
+    "@ndla/licenses": "^5.0.6",
+    "@ndla/modal": "^1.2.16",
+    "@ndla/notion": "^3.1.26",
+    "@ndla/safelink": "^2.2.4",
+    "@ndla/switch": "^0.1.10",
+    "@ndla/tabs": "^1.1.14",
+    "@ndla/tooltip": "^2.1.5",
+    "@ndla/types-learningpath-api": "^0.0.12",
     "@ndla/util": "^3.0.0",
     "@reach/menu-button": "^0.16.2",
     "@reach/slider": "^0.16.0",
@@ -82,5 +83,5 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "fd7915eee936f4d2450c1263e4830a7bda29d49a"
+  "gitHead": "b4b0a48ca5d00d92fadafa85326a8ee86b91f152"
 }

package/src/Breadcrumb/ActionBreadcrumb.tsx

@@ -47,7 +47,7 @@ const ActionBreadcrumb = ({ items, actionItems }: Props) => {
     if (totalCount === 1) {
       return <StyledSpan title={item.name}>{item.name}</StyledSpan>;
     }
-    if (item.index === totalCount - 1) {
+    if (item.index === totalCount - 1 && actionItems.length > 0) {
       return (
         <MenuButton menuItems={actionItems} size="small">
           <StyledSpan title={item.name}>{item.name}</StyledSpan>

package/src/LearningPaths/LearningPathInformation.tsx

@@ -8,7 +8,8 @@
 
 import React from 'react';
 import styled from '@emotion/styled';
-import { fonts, spacing, spacingUnit, breakpoints, mq } from '@ndla/core';
+import { fonts, spacing, spacingUnit, breakpoints, mq, colors } from '@ndla/core';
+import { getLicenseByAbbreviation, LicenseByline } from '@ndla/licenses';
 
 type StyledWrapperProps = {
   invertedStyle?: boolean;
@@ -50,6 +51,17 @@ const StyledWrapper = styled.div<StyledWrapperProps>`
   }
 `;
 
+const LicenseWrapper = styled.div`
+  ul {
+    margin-left: 0;
+    margin-bottom: ${spacing.small};
+  }
+`;
+
+const StyledHeader = styled.h1`
+  margin-bottom: ${spacing.small};
+`;
+
 interface Props {
   description?: string;
   title: string;
@@ -59,14 +71,17 @@ interface Props {
   };
 }
 
-export const LearningPathInformation = ({ description, title, license, invertedStyle }: Props) => (
-  <section className="o-wrapper">
-    <StyledWrapper invertedStyle={invertedStyle} className="c-article">
-      <div>
-        <h1>{title}</h1>
-        {license && license.license}
-      </div>
-      {description && <div dangerouslySetInnerHTML={{ __html: description }} />}
-    </StyledWrapper>
-  </section>
-);
+export const LearningPathInformation = ({ description, title, license, invertedStyle }: Props) => {
+  const { rights } = getLicenseByAbbreviation(license?.license || '', 'nb');
+  return (
+    <section className="o-wrapper">
+      <StyledWrapper invertedStyle={invertedStyle} className="c-article">
+        <LicenseWrapper>
+          <StyledHeader>{title}</StyledHeader>
+          <LicenseByline licenseRights={rights} color={colors.brand.tertiary} />
+        </LicenseWrapper>
+        {description && <div dangerouslySetInnerHTML={{ __html: description }} />}
+      </StyledWrapper>
+    </section>
+  );
+};

package/src/LearningPaths/LearningPathMenuAsideCopyright.tsx

@@ -9,22 +9,20 @@
 import React from 'react';
 import styled from '@emotion/styled';
 import { User } from '@ndla/icons/common';
-import { spacing, fonts } from '@ndla/core';
+import { spacing, fonts, colors } from '@ndla/core';
+import { getLicenseByAbbreviation, LicenseByline } from '@ndla/licenses';
 
 const StyledLearningPathDetails = styled.div`
   ${fonts.sizes(14, 1.1)};
   font-weight: ${fonts.weight.normal};
-  margin: 0;
+`;
+
+const UserLine = styled.div`
   display: flex;
-  align-items: flex-start;
-  justify-items: flex-start;
   margin-bottom: ${spacing.xsmall};
-  p {
-    margin: 0;
-    padding-left: ${spacing.xsmall};
-  }
+
   span {
-    display: block;
+    margin-left: ${spacing.xsmall};
   }
 `;
 
@@ -40,16 +38,20 @@ type Props = {
   };
 };
 
-const LearningPathMenuAsideCopyright = ({ copyright }: Props) => (
-  <StyledLearningPathDetails>
-    <User />
-    <p>
-      {copyright.contributors.map((contributor) => (
-        <span key={contributor.name}>{contributor.name}</span>
-      ))}
-      <span>{copyright.license.license}</span>
-    </p>
-  </StyledLearningPathDetails>
-);
+const LearningPathMenuAsideCopyright = ({ copyright }: Props) => {
+  const { rights } = getLicenseByAbbreviation(copyright.license.license || '', 'nb');
+  return (
+    <StyledLearningPathDetails>
+      <UserLine>
+        <User />
+        {copyright.contributors.map((contributor) => (
+          <span key={contributor.name}>{contributor.name}</span>
+        ))}
+      </UserLine>
+
+      <LicenseByline licenseRights={rights} color={colors.brand.tertiary} />
+    </StyledLearningPathDetails>
+  );
+};
 
 export default LearningPathMenuAsideCopyright;

package/src/MyNdla/Resource/Folder.tsx

@@ -141,7 +141,7 @@ const Folder = ({ link, title, subFolders, subResources, type = 'list', menuItem
       <FolderTitle>{title}</FolderTitle>
       <IconCount layoutType={type} type={'folder'} count={subFolders} />
       <IconCount layoutType={type} type={'resource'} count={subResources} />
-      {menuItems && menuItems.length > 0 && <MenuButton size="small" menuItems={menuItems} />}
+      {menuItems && menuItems.length > 0 && <MenuButton alignRight size="small" menuItems={menuItems} />}
     </FolderWrapper>
   );
 };

package/src/Resource/BlockResource.tsx

@@ -92,7 +92,7 @@ const BlockResource = ({ link, title, tags, resourceImage, topics, description,
         <BlockDescription>{description}</BlockDescription>
         <RightRow>
           {tags && <CompressedTagList tags={tags} />}
-          {menuItems && menuItems.length > 0 && <MenuButton size="small" menuItems={menuItems} />}
+          {menuItems && menuItems.length > 0 && <MenuButton alignRight size="small" menuItems={menuItems} />}
         </RightRow>
       </BlockInfoWrapper>
     </BlockElementWrapper>

package/src/Resource/ListResource.tsx

@@ -131,7 +131,7 @@ const ListResource = ({ link, title, tags, resourceImage, topics, description, m
       {showDescription && <ResourceDescription>{description}</ResourceDescription>}
       <TagsandActionMenu>
         {tags && <CompressedTagList tags={tags} />}
-        {menuItems && menuItems.length > 0 && <MenuButton size="small" menuItems={menuItems} />}
+        {menuItems && menuItems.length > 0 && <MenuButton alignRight size="small" menuItems={menuItems} />}
       </TagsandActionMenu>
     </ResourceWrapper>
   );

package/src/ResourceGroup/ResourceGroup.tsx

@@ -36,7 +36,7 @@ const StyledHeading = styled.h1`
 type Props = {
   invertedStyle?: boolean;
   toggleAdditionalResources: () => void;
-  onToggleAddToFavorites: (id: string | number, add: string) => void;
+  onToggleAddToFavorites: (id: string) => void;
   showAddToFavoriteButton: boolean;
 };
 

package/src/ResourceGroup/ResourceItem.tsx

@@ -229,7 +229,7 @@ type Props = {
   showAdditionalResources?: boolean;
   access?: 'teacher';
   isFavorite?: boolean;
-  onToggleAddToFavorites: (id: string, add: boolean) => void;
+  onToggleAddToFavorites: (id: string) => void;
   showAddToFavoriteButton: boolean;
 };
 
@@ -305,7 +305,7 @@ const ResourceItem = ({
           <ArticleFavoritesButton
             isFavorite={isFavorite}
             articleId={id}
-            onToggleAddToFavorites={() => onToggleAddToFavorites(id, true)}
+            onToggleAddToFavorites={() => onToggleAddToFavorites(id)}
           />
         )}
       </TypeWrapper>

package/src/ResourceGroup/ResourceList.tsx

@@ -48,7 +48,7 @@ export type ResourceListProps = {
   contentType?: string;
   title?: string;
   showAdditionalResources?: boolean;
-  onToggleAddToFavorites: (id: string, add: boolean) => void;
+  onToggleAddToFavorites: (id: string) => void;
   showAddToFavoriteButton: boolean;
 };
 

package/src/Search/ContentTypeResult.tsx

@@ -129,7 +129,6 @@ const ContentTypeResult = ({
             return (
               <StyledListItem key={path} delayAnimation={delayAnimation}>
                 <SafeLink
-                  tabIndex={-1}
                   css={shouldHighlight && highlightStyle}
                   data-highlighted={shouldHighlight || false}
                   {...linkProps}