feat(notifications): format backticks in title

Signed-off-by: Adam Setch <adam.setch@outlook.com>

Author: setchy

src/renderer/components/notifications/NotificationRow.tsx

@@ -113,10 +113,7 @@ export const NotificationRow: FC<NotificationRowProps> = ({
             justify="space-between"
             title={notification.display.title}
           >
-            <NotificationTitle
-              title={notification.subject.title}
-              wrapTitle={settings.wrapNotificationTitle}
-            />
+            <NotificationTitle title={notification.subject.title} />
             <Text
               className={cn(
                 'text-xxs ml-auto mr-2',

src/renderer/components/notifications/NotificationTitle.test.tsx

@@ -1,74 +1,72 @@
 import { renderWithAppContext } from '../../__helpers__/test-utils';
+import { mockSettings } from '../../__mocks__/state-mocks';
 
 import { NotificationTitle } from './NotificationTitle';
 
 describe('renderer/components/notifications/NotificationTitle.tsx', () => {
   it('should render plain text without code blocks', () => {
     const tree = renderWithAppContext(
-      <NotificationTitle title="Simple notification title" wrapTitle={false} />,
+      <NotificationTitle title="Simple notification title" />,
     );
 
     expect(tree).toMatchSnapshot();
   });
 
   it('should render text with single inline code block', () => {
     const tree = renderWithAppContext(
-      <NotificationTitle
-        title="refactor: migrate deprecated atlaskit `xcss`"
-        wrapTitle={false}
-      />,
+      <NotificationTitle title="refactor: migrate deprecated atlaskit `xcss`" />,
     );
 
     expect(tree).toMatchSnapshot();
   });
 
   it('should render text with multiple inline code blocks', () => {
     const tree = renderWithAppContext(
-      <NotificationTitle
-        title="Replace `foo` with `bar` in config"
-        wrapTitle={false}
-      />,
+      <NotificationTitle title="Replace `foo` with `bar` in config" />,
     );
 
     expect(tree).toMatchSnapshot();
   });
 
   it('should render text with code block at the start', () => {
     const tree = renderWithAppContext(
-      <NotificationTitle
-        title="`useState` hook implementation"
-        wrapTitle={false}
-      />,
+      <NotificationTitle title="`useState` hook implementation" />,
     );
 
     expect(tree).toMatchSnapshot();
   });
 
   it('should render text with code block at the end', () => {
     const tree = renderWithAppContext(
-      <NotificationTitle title="Fix issue with `render`" wrapTitle={false} />,
+      <NotificationTitle title="Fix issue with `render`" />,
     );
 
     expect(tree).toMatchSnapshot();
   });
 
-  it('should apply truncate className when wrapTitle is false', () => {
+  it('should apply truncate className when wrapNotificationTitle is false', () => {
     const tree = renderWithAppContext(
-      <NotificationTitle
-        title="refactor: migrate deprecated atlaskit `xcss`"
-        wrapTitle={false}
-      />,
+      <NotificationTitle title="refactor: migrate deprecated atlaskit `xcss`" />,
+      {
+        settings: {
+          ...mockSettings,
+          wrapNotificationTitle: false,
+        },
+      },
     );
 
     expect(tree).toMatchSnapshot();
   });
 
-  it('should not apply truncate className when wrapTitle is true', () => {
+  it('should not apply truncate className when wrapNotificationTitle is true', () => {
     const tree = renderWithAppContext(
-      <NotificationTitle
-        title="refactor: migrate deprecated atlaskit `xcss`"
-        wrapTitle={true}
-      />,
+      <NotificationTitle title="refactor: migrate deprecated atlaskit `xcss`" />,
+      {
+        settings: {
+          ...mockSettings,
+          wrapNotificationTitle: true,
+        },
+      },
     );
 
     expect(tree).toMatchSnapshot();

src/renderer/components/notifications/NotificationTitle.tsx

@@ -2,22 +2,23 @@ import type { FC } from 'react';
 
 import { Text } from '@primer/react';
 
+import { useAppContext } from '../../hooks/useAppContext';
+
 import { cn } from '../../utils/cn';
 import { parseInlineCode } from '../../utils/helpers';
 
 interface NotificationTitleProps {
   title: string;
-  wrapTitle: boolean;
 }
 
 export const NotificationTitle: FC<NotificationTitleProps> = ({
   title,
-  wrapTitle,
 }: NotificationTitleProps) => {
+  const { settings } = useAppContext();
   const parts = parseInlineCode(title);
 
   return (
-    <Text className={!wrapTitle && 'truncate'}>
+    <Text className={!settings.wrapNotificationTitle && 'truncate'}>
       {parts.map((part) => (
         <Text
           className={cn(