@ndla/ui 22.0.0 → 22.0.1

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": "22.0.0",
+  "version": "22.0.1",
   "description": "UI component library for NDLA.",
   "license": "GPL-3.0",
   "main": "lib/index.js",
@@ -83,5 +83,5 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "683202fb5ba5a555e6a3d61c89e5cce4ae3b151c"
+  "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/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}

package/src/SearchTypeResult/SearchItem.tsx

@@ -154,7 +154,6 @@ const ItemText = styled.div<ItemTypeProps>`
 
 const ContextWrapper = styled.div`
   background: white;
-  z-index: 1;
   padding: 0 ${spacing.normal} ${spacing.small};
   transition: all ${animations.durations.fast} ease-in-out;
   ${ItemWrapper}:hover & {

package/src/TreeStructure/FolderItem.tsx

@@ -7,8 +7,10 @@
  */
 
 import React, { KeyboardEvent, MouseEvent, useEffect, useRef } from 'react';
+import { useTranslation } from 'react-i18next';
 import styled from '@emotion/styled';
 import { ArrowDropDown } from '@ndla/icons/common';
+import { Done } from '@ndla/icons/editor';
 import { MenuButton } from '@ndla/button';
 import { FolderOutlined } from '@ndla/icons/contentType';
 import { colors, spacing, misc, animations } from '@ndla/core';
@@ -40,15 +42,11 @@ const FolderItemWrapper = styled.div`
   align-items: center;
 `;
 
-const WrapperForFolderChild = styled.div<{ selected?: boolean }>`
-  position: absolute;
-  right: ${spacing.xsmall};
-  opacity: ${({ selected }) => (selected ? 1 : 0.25)};
-  &:hover,
-  &:focus,
-  &:focus-within {
-    opacity: 1;
-  }
+const WrapperForFolderChild = styled.div`
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  gap: ${spacing.xsmall};
 `;
 
 const shouldForwardProp = (name: string) => !['selected', 'noArrow'].includes(name);
@@ -59,9 +57,24 @@ interface FolderNameProps {
 }
 
 const FolderName = styled('button', { shouldForwardProp })<FolderNameProps>`
-  line-height: 1;
+  cursor: pointer;
+  padding: ${spacing.xsmall};
+  margin: 0;
+  margin-left: ${({ noArrow }) => (noArrow ? `29px` : `0px`)};
+  flex-grow: 1;
+  display: grid;
+  grid-template-columns: auto 1fr auto;
+  align-items: center;
+  gap: ${spacing.xxsmall};
+  border: 0;
+  border-radius: ${misc.borderRadius};
+  box-shadow: none;
   background: ${({ selected }) => (selected ? colors.brand.lighter : 'transparent')};
   color: ${colors.text.primary};
+  transition: ${animations.durations.superFast};
+  text-align: left;
+  line-height: 1;
+  word-break: break-word;
   &:hover,
   &:focus {
     background: ${({ selected }) => (selected ? colors.brand.light : colors.brand.lightest)};
@@ -70,19 +83,10 @@ const FolderName = styled('button', { shouldForwardProp })<FolderNameProps>`
       opacity: 1;
     }
   }
-  transition: ${animations.durations.superFast};
-  border: 0;
-  border-radius: ${misc.borderRadius};
-  display: flex;
-  gap: ${spacing.xxsmall};
-  align-items: center;
-  cursor: pointer;
-  padding: ${spacing.xsmall};
-  margin: 0;
-  margin-left: ${({ noArrow }) => (noArrow ? `29px` : `0px`)};
-  flex-grow: 1;
-  box-shadow: none;
-  text-align: left;
+`;
+
+const StyledDone = styled(Done)`
+  color: ${colors.support.green};
 `;
 
 const FolderNameLink = FolderName.withComponent(SafeLink);
@@ -110,24 +114,30 @@ const FolderItem = ({
   openOnFolderClick,
   setFocusedId,
   setSelectedFolder,
+  targetResource,
   visibleFolders,
 }: Props) => {
+  const { t } = useTranslation();
   const { id, icon, name } = folder;
   const ref = useRef<HTMLButtonElement & HTMLAnchorElement>(null);
   const selected = selectedFolder && selectedFolder.id === id;
   const focused = focusedFolderId === id;
 
   const handleClickFolder = () => {
-    setSelectedFolder(folder);
-    setFocusedId(id);
-    onSelectFolder?.(id);
     if (openOnFolderClick) {
-      if (isOpen) {
-        onCloseFolder(id);
-      } else {
-        onOpenFolder(id);
+      if (selected) {
+        if (isOpen) {
+          onCloseFolder(id);
+        } else {
+          onOpenFolder(id);
+        }
       }
     }
+    if (!selected) {
+      setSelectedFolder(folder);
+      setFocusedId(id);
+    }
+    onSelectFolder?.(id);
   };
 
   useEffect(() => {
@@ -144,7 +154,10 @@ const FolderItem = ({
     };
   });
 
-  const linkPath = `/minndla${level > 1 ? '/folders' : ''}/${id}`;
+  const linkPath = `/minndla${level > 0 ? '/folders' : ''}/${id}`;
+
+  const containsResource =
+    targetResource && folder.resources.some((resource) => resource.resourceId === targetResource.resourceId);
 
   return (
     <FolderItemWrapper>
@@ -170,12 +183,18 @@ const FolderItem = ({
             onClick={handleClickFolder}>
             {icon || <FolderOutlined />}
             {name}
-          </FolderName>
-          {actions && (
-            <WrapperForFolderChild selected={selected}>
-              <MenuButton size="xsmall" menuItems={actions} tabIndex={selected || id === focusedFolderId ? 0 : -1} />
+            <WrapperForFolderChild>
+              {containsResource && <StyledDone title={t('myNdla.alreadyInFolder')} />}
+              {actions && (
+                <MenuButton
+                  onClick={(e) => e.stopPropagation()}
+                  size="xsmall"
+                  menuItems={actions}
+                  tabIndex={selected || id === focusedFolderId ? 0 : -1}
+                />
+              )}
             </WrapperForFolderChild>
-          )}
+          </FolderName>
         </>
       ) : (
         <FolderNameLink
@@ -185,7 +204,7 @@ const FolderItem = ({
           }
           noArrow={hideArrow}
           to={loading ? '' : linkPath}
-          tabIndex={selected || focused || level === 1 ? 0 : -1}
+          tabIndex={selected || focused || level === 0 ? 0 : -1}
           selected={selected}
           onFocus={() => setFocusedId(id)}
           onClick={handleClickFolder}>

package/src/TreeStructure/FolderItems.tsx

@@ -52,10 +52,11 @@ const FolderItems = ({
   openFolders,
   ...rest
 }: FolderItemsProps) => (
-  <StyledUL role="group" firstLevel={level === 1}>
+  <StyledUL role="group" firstLevel={level === 0}>
     {folders.map((folder) => {
       const { subfolders, id } = folder;
       const isOpen = openFolders?.includes(id);
+
       return (
         <StyledLI key={id} role="treeitem">
           <div>
@@ -65,7 +66,7 @@ const FolderItems = ({
               isOpen={isOpen}
               level={level}
               loading={loading}
-              noPaddingWhenArrowIsHidden={editable && level === 1 && subfolders?.length === 0}
+              noPaddingWhenArrowIsHidden={editable && level === 0 && subfolders?.length === 0}
               {...rest}
             />
           </div>

package/src/TreeStructure/TreeStructure.tsx

@@ -52,6 +52,7 @@ const TreeStructure = ({
   onNewFolder,
   onSelectFolder,
   openOnFolderClick,
+  targetResource,
 }: TreeStructureProps) => {
   const { t } = useTranslation();
 
@@ -68,10 +69,13 @@ const TreeStructure = ({
 
   useEffect(() => {
     if (defaultOpenFolders) {
-      setOpenFolders((prev) => {
-        return uniq(defaultOpenFolders.concat(prev));
-      });
+      if (!defaultOpenFolders.every((element) => openFolders.includes(element))) {
+        setOpenFolders((prev) => {
+          return uniq(defaultOpenFolders.concat(prev));
+        });
+      }
     }
+    // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [defaultOpenFolders]);
 
   useEffect(() => {
@@ -136,7 +140,7 @@ const TreeStructure = ({
           focusedFolderId={focusedId}
           menuItems={menuItems}
           folders={folders}
-          level={1}
+          level={0}
           loading={loading}
           selectedFolder={selectedFolder}
           maximumLevelsOfFoldersAllowed={maximumLevelsOfFoldersAllowed}
@@ -150,6 +154,7 @@ const TreeStructure = ({
           openOnFolderClick={openOnFolderClick}
           setFocusedId={setFocusedId}
           setSelectedFolder={setSelectedFolder}
+          targetResource={targetResource}
           visibleFolders={visibleFolderIds}
         />
       </TreeStructureStyledWrapper>

package/src/TreeStructure/types.ts

@@ -7,7 +7,7 @@
  */
 
 import { MouseEvent, ReactNode } from 'react';
-import { IFolder } from '@ndla/types-learningpath-api';
+import { IFolder, IResource } from '@ndla/types-learningpath-api';
 import { MenuItemProps } from '@ndla/button/src';
 
 export interface FolderType extends IFolder {
@@ -23,6 +23,7 @@ export interface CommonTreeStructureProps {
   onSelectFolder?: (id: string) => void;
   openOnFolderClick?: boolean;
   menuItems?: TreeStructureMenuProps[];
+  targetResource?: IResource;
 }
 
 export interface CommonFolderItemsProps extends CommonTreeStructureProps {

package/src/locale/messages-en.ts

@@ -997,6 +997,8 @@ const messages = {
       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',
@@ -1007,6 +1009,7 @@ const messages = {
     favourites: 'Favourites',
     addToFavourites: 'Add to my favourites',
     alreadyFavourited: 'Already in my favourites',
+    alreadyInFolder: 'Already in folder',
     help: 'Help',
     more: 'More options',
     listView: 'List view',
@@ -1015,6 +1018,9 @@ const messages = {
     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',
@@ -1047,6 +1053,8 @@ const messages = {
     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',