Requerimiento 1.5

package-lock.json

@@ -15,6 +15,7 @@
         "@uiw/codemirror-theme-github": "^4.21.25",
         "@uiw/codemirror-theme-vscode": "^4.21.25",
         "@uiw/react-codemirror": "^4.21.25",
+        "@vercel/analytics": "^1.2.2",
         "axios": "^1.7.4",
         "classnames": "^2.5.1",
         "dexie": "^3.2.4",
@@ -4205,6 +4206,44 @@
       "integrity": "sha512-zuVdFrMJiuCDQUMCzQaD6KL28MjnqqN8XnAqiEq9PNm/hCPTSGfrXCOfwj1ow4LFb/tNymJPwsNbVePc1xFqrQ==",
       "dev": true
     },
+    "node_modules/@vercel/analytics": {
+      "version": "1.5.0",
+      "resolved": "https://registry.npmjs.org/@vercel/analytics/-/analytics-1.5.0.tgz",
+      "integrity": "sha512-MYsBzfPki4gthY5HnYN7jgInhAZ7Ac1cYDoRWFomwGHWEX7odTEzbtg9kf/QSo7XEsEAqlQugA6gJ2WS2DEa3g==",
+      "license": "MPL-2.0",
+      "peerDependencies": {
+        "@remix-run/react": "^2",
+        "@sveltejs/kit": "^1 || ^2",
+        "next": ">= 13",
+        "react": "^18 || ^19 || ^19.0.0-rc",
+        "svelte": ">= 4",
+        "vue": "^3",
+        "vue-router": "^4"
+      },
+      "peerDependenciesMeta": {
+        "@remix-run/react": {
+          "optional": true
+        },
+        "@sveltejs/kit": {
+          "optional": true
+        },
+        "next": {
+          "optional": true
+        },
+        "react": {
+          "optional": true
+        },
+        "svelte": {
+          "optional": true
+        },
+        "vue": {
+          "optional": true
+        },
+        "vue-router": {
+          "optional": true
+        }
+      }
+    },
     "node_modules/@vitejs/plugin-react": {
       "version": "4.2.1",
       "resolved": "https://registry.npmjs.org/@vitejs/plugin-react/-/plugin-react-4.2.1.tgz",

src/components/EditorSidePanel/TablesTab/TableField.jsx

@@ -136,19 +136,27 @@ export default function TableField({ data, tid, index }) {
         <Button
           type={data.notNull || data.primary ? "primary" : "tertiary"}
           title={t("not_null")}
-          theme={data.notNull || data.primary ? "solid" : "light"}
+          theme={data.notNull ? "solid" : "light"}
-          disabled={data.primary ? true: false }
+         
+         
           onClick={() => {
+                if(data.primary){
+                  
+                  return};
+
             setUndoStack((prev) => [
               ...prev,
               {
+                
                 action: Action.EDIT,
                 element: ObjectType.TABLE,
                 component: "field",
                 tid: tid,
                 fid: index,
                 undo: { notNull: data.notNull },
+                
                 redo: { notNull: !data.notNull },
+                
                 message: t("edit_table", {
                   tableName: tables[tid].name,
                   extra: "[field]",
@@ -156,7 +164,11 @@ export default function TableField({ data, tid, index }) {
               },
             ]);
             setRedoStack([]);
+            
             updateField(tid, index, { notNull: !data.notNull });
+
+          //}
+
           }}
         >
           ?
@@ -168,41 +180,41 @@ export default function TableField({ data, tid, index }) {
           title={t("primary")}
           theme={data.primary ? "solid" : "light"}
           onClick={() => {
-          const mustSetNotNull = !data.primary && !data.notNull;
 
-          const undo = { primary: data.primary };
+            const newStatePK=!data.primary;
-          const redo = { primary: !data.primary };
+            const stateNull=newStatePK?true: !data.notNull;
+            const mustSetNotNull = !data.primary && !data.notNull;
             const changes = { primary: !data.primary };
              
+          const undo= { primary: data.primary , notNull : data.notNull };
+          const redo= { primary: newStatePK , notNull:stateNull };
           if (mustSetNotNull) {
             undo.notNull = data.notNull;
             redo.notNull = true;
             changes.notNull = true;
           }      
-
             setUndoStack((prev) => [
               ...prev,
               {
                 action: Action.EDIT,
                 element: ObjectType.TABLE,
                 component: "field",
-              tid,
+                tid: tid,
                 fid: index,
-              undo,
+                
-              redo,
                 message: t("edit_table", {
                   tableName: tables[tid].name,
                   extra: "[field]",
                 }),
               },
             ]);
-
             setRedoStack([]);
-          updateField(tid, index, changes);
+            updateField(tid, index, { primary: newStatePK,notNull:stateNull });
           }}
           icon={<IconKeyStroked />}
         />
       
+
       </Col>
       <Col span={3}>
         <Popover