Add sorting by name functionality and implement AdminProductList component for product management

frontend/app/inventory/InventoryForm.tsx

@@ -11,6 +11,7 @@ type Props = {
 export default function InventoryForm({ products }: Props) {
   const [isPending, setIsPending] = useState(false);
   const [error, setError] = useState<string | null>(null);
+  const [isOpen, setIsOpen] = useState(false);
 
   const UNIT_OPTIONS = [
     { value: '', label: 'Välj enhet' },
@@ -56,8 +57,32 @@ export default function InventoryForm({ products }: Props) {
   }
 
   return (
-    <form
-      onSubmit={async (e) => {
+    <div style={{ marginBottom: '1.5rem' }}>
+      <button
+        type="button"
+        onClick={() => setIsOpen((v) => !v)}
+        style={{
+          padding: '0.6rem 1rem',
+          border: '1px solid #ddd',
+          borderRadius: '6px',
+          background: '#fff',
+          cursor: 'pointer',
+          fontWeight: 500,
+          fontSize: '1rem',
+          width: '100%',
+          textAlign: 'left',
+          display: 'flex',
+          justifyContent: 'space-between',
+          alignItems: 'center',
+        }}
+      >
+        <span>Lägg till hemmavara</span>
+        <span>{isOpen ? '▲' : '▼'}</span>
+      </button>
+
+      {isOpen && (
+      <form
+        onSubmit={async (e) => {
         e.preventDefault();
         setError(null);
         setIsPending(true);
@@ -82,11 +107,12 @@ export default function InventoryForm({ products }: Props) {
         gap: '0.75rem',
         padding: '1rem',
         border: '1px solid #ddd',
-        borderRadius: '8px',
-        marginBottom: '1.5rem',
+        borderTop: 'none',
+        borderRadius: '0 0 8px 8px',
+        marginBottom: '0',
       }}
     >
-      <h2 style={{ margin: 0 }}>Lägg till hemmavara</h2>
+      <h2 style={{ margin: 0, display: 'none' }}>Lägg till hemmavara</h2>
 
       <label>
         Produkt
@@ -187,5 +213,7 @@ export default function InventoryForm({ products }: Props) {
 
       {error ? <p style={{ color: 'crimson', margin: 0 }}>{error}</p> : null}
     </form>
+      )}
+    </div>
   );
 }

frontend/app/inventory/page.tsx

@@ -98,8 +98,9 @@ export default async function InventoryPage({ searchParams }: InventoryPageProps
   const locationOptions = ['', 'Kyl', 'Frys', 'Skafferi'];
   const sortOptions = [
     { value: '', label: 'Senast tillagda' },
-    { value: 'bestBeforeAsc', label: 'Bäst före Stigande' },
-    { value: 'bestBeforeDesc', label: 'Bäst före Fallande' },
+    { value: 'nameAsc', label: 'Namn A\u2013\u00d6' },
+    { value: 'bestBeforeAsc', label: 'B\u00e4st f\u00f6re Stigande' },
+    { value: 'bestBeforeDesc', label: 'B\u00e4st f\u00f6re Fallande' },
   ];
 
   return (
@@ -131,6 +132,7 @@ export default async function InventoryPage({ searchParams }: InventoryPageProps
                   <Link
                     key={option || 'alla'}
                     href={buildInventoryUrl(option || undefined, sort || undefined)}
+                    scroll={false}
                     style={{
                       padding: '0.45rem 0.75rem',
                       borderRadius: '999px',
@@ -158,6 +160,7 @@ export default async function InventoryPage({ searchParams }: InventoryPageProps
                   <Link
                     key={option.value || 'default'}
                     href={buildInventoryUrl(location || undefined, option.value || undefined)}
+                    scroll={false}
                     style={{
                       padding: '0.45rem 0.75rem',
                       borderRadius: '999px',