fix: Handling filename overflow in mobile viewports (#7364)

Fixes #7330
Fixes https://github.com/twentyhq/twenty/issues/7516 

<div style="display: flex">
<img style="max-width:50%"
src="https://github.com/user-attachments/assets/51027a9d-8745-4cc7-9f17-4000e3615e44"/>
<img style="max-width:50%"
src="https://github.com/user-attachments/assets/827f69ba-c581-402f-9498-6b1a4dde7b69"/>
</div>

---------

Co-authored-by: sid0-0 <a@b.com>
Co-authored-by: Lucas Bordeau <bordeau.lucas@gmail.com>

packages/twenty-front/src/modules/activities/components/ActivityList.tsx

@@ -0,0 +1,16 @@
+import { Card } from '@/ui/layout/card/components/Card';
+import styled from '@emotion/styled';
+
+const StyledList = styled(Card)`
+  & > :not(:last-child) {
+    border-bottom: 1px solid ${({ theme }) => theme.border.color.light};
+  }
+
+  width: calc(100% - 2px);
+
+  overflow: auto;
+`;
+
+export const ActivityList = ({ children }: React.PropsWithChildren) => {
+  return <StyledList>{children}</StyledList>;
+};

packages/twenty-front/src/modules/activities/components/ActivityRow.tsx

@@ -0,0 +1,35 @@
+import { CardContent } from '@/ui/layout/card/components/CardContent';
+import styled from '@emotion/styled';
+import React from 'react';
+
+const StyledRowContent = styled(CardContent)<{
+  clickable?: boolean;
+}>`
+  align-items: center;
+  display: flex;
+  gap: ${({ theme }) => theme.spacing(2)};
+  height: ${({ theme }) => theme.spacing(12)};
+  padding: ${({ theme }) => theme.spacing(0, 4)};
+  cursor: ${({ clickable }) => (clickable === true ? 'pointer' : 'default')};
+`;
+
+export const ActivityRow = ({
+  children,
+  onClick,
+  disabled,
+}: React.PropsWithChildren<{
+  onClick?: (event: React.MouseEvent<HTMLDivElement>) => void;
+  disabled?: boolean;
+}>) => {
+  const handleClick = (event: React.MouseEvent<HTMLDivElement>) => {
+    if (disabled !== true) {
+      onClick?.(event);
+    }
+  };
+
+  return (
+    <StyledRowContent onClick={handleClick} clickable={disabled !== true}>
+      {children}
+    </StyledRowContent>
+  );
+};