feat: add Object Edit form (#2090)

Closes #1910

front/src/modules/settings/data-model/components/SettingsObjectFormSection.tsx

@@ -0,0 +1,53 @@
+import styled from '@emotion/styled';
+
+import { H2Title } from '@/ui/display/typography/components/H2Title';
+import { AutosizeTextInput } from '@/ui/input/components/AutosizeTextInput';
+import { TextInput } from '@/ui/input/components/TextInput';
+import { Section } from '@/ui/layout/section/components/Section';
+
+type SettingsObjectFormSectionProps = {
+  singularName?: string;
+  pluralName?: string;
+  description?: string;
+};
+
+const StyledInputsContainer = styled.div`
+  display: flex;
+  gap: ${({ theme }) => theme.spacing(2)};
+  margin-bottom: ${({ theme }) => theme.spacing(2)};
+  width: 100%;
+`;
+
+const StyledTextInput = styled(TextInput)`
+  flex: 1 0 auto;
+`;
+
+export const SettingsObjectFormSection = ({
+  singularName,
+  pluralName,
+  description,
+}: SettingsObjectFormSectionProps) => (
+  <Section>
+    <H2Title
+      title="Name and description"
+      description="Name in both singular (e.g., 'Invoice') and plural (e.g., 'Invoices') forms."
+    />
+    <StyledInputsContainer>
+      <StyledTextInput
+        label="Singular"
+        placeholder="Invoice"
+        value={singularName}
+      />
+      <StyledTextInput
+        label="Plural"
+        placeholder="Invoices"
+        value={pluralName}
+      />
+    </StyledInputsContainer>
+    <AutosizeTextInput
+      placeholder="Write a description"
+      minRows={4}
+      value={description}
+    />
+  </Section>
+);

front/src/modules/settings/data-model/components/__stories__/SettingsObjectFormSection.stories.tsx

@@ -0,0 +1,24 @@
+import { Meta, StoryObj } from '@storybook/react';
+
+import { ComponentDecorator } from '~/testing/decorators/ComponentDecorator';
+
+import { SettingsObjectFormSection } from '../SettingsObjectFormSection';
+
+const meta: Meta<typeof SettingsObjectFormSection> = {
+  title: 'Modules/Settings/DataModel/SettingsObjectFormSection',
+  component: SettingsObjectFormSection,
+  decorators: [ComponentDecorator],
+};
+
+export default meta;
+type Story = StoryObj<typeof SettingsObjectFormSection>;
+
+export const Default: Story = {};
+
+export const WithDefaultValues: Story = {
+  args: {
+    singularName: 'Company',
+    pluralName: 'Companies',
+    description: 'Lorem ipsum',
+  },
+};