Update contact info

client/src/contacts/contact-info-editor.js

@@ -63,6 +63,7 @@ customElements.define('contact-info-editor', class extends Component {
         this.setAttribute('type', v);
         const icon = this.shadowRoot.querySelector('contact-type-icon');
         icon.setAttribute('contact-type', v);
+        this.shadowRoot.querySelector('#contact_type').value = v;
         this.shadowRoot.querySelector('#content').setAttribute('type', v === 'email' ? 'email' : 'text');
     }
 
@@ -93,6 +94,7 @@ customElements.define('contact-info-editor', class extends Component {
         const input = form.querySelector('#contact-id');
         input && input.remove();
         form.action = '/contacts/create';
+        form.querySelector('input[type=submit]').value = 'Dodaj';
     }
 
     #addId(v) {
@@ -104,5 +106,6 @@ customElements.define('contact-info-editor', class extends Component {
         input.setAttribute('id', 'contact-id');
         input.value = v;
         form.action = '/contacts/update';
+        form.querySelector('input[type=submit]').value = 'Zmień';
     }
 });

client/src/contacts/contact-info.js

@@ -33,6 +33,10 @@ customElements.define('contact-info',
             this.shadowRoot.querySelector('contact-type-icon').setAttribute('contact-type', v);
         }
 
+        get contact_type() {
+            return this.getAttribute('contact-type');
+        }
+
         set content(v) {
             this.setAttribute('content', v);
             this.shadowRoot.querySelector('#content').textContent = v;

client/src/contacts/edit-contact-info.js

@@ -12,8 +12,13 @@ customElements.define('edit-contact-info', class extends Component {
                 article {
                     display: flex;
                     justify-content: space-between;
+                    width: 100%;
                 }
                 #actions {
+                    display: flex;
+                    justify-content: space-between;
+                }
+                #buttons {
                     display: flex;
                     justify-content: start;
                 }
@@ -23,8 +28,12 @@ customElements.define('edit-contact-info', class extends Component {
                 :host([mode = 'view']) contact-info-editor {
                     display: none;
                 }
+                :host([mode = 'edit']) #actions {
+                    width: 100%;
+                }
                 :host([mode = 'edit']) contact-info-editor {
                     display: block;
+                    min-width: 50%;
                 }
                 :host([mode = 'view']) ::slotted(contact-info) {
                     display: block;
@@ -38,11 +47,13 @@ customElements.define('edit-contact-info', class extends Component {
                 <slot></slot>
                 <section id="actions">
                     <contact-info-editor></contact-info-editor>
-                    <input type="button" value="Edytuj" id="edit" />
-                    <form action="/contacts/delete" method="post">
-                        <input type="hidden" name="id" id="remove-id" />
-                        <input type="submit" value="Usuń" id="remove" />
-                    </form>
+                    <div id="buttons">
+                        <input type="button" value="Edytuj" id="edit" />
+                        <form action="/contacts/delete" method="post">
+                            <input type="hidden" name="id" id="remove-id" />
+                            <input type="submit" value="Usuń" id="remove" />
+                        </form>
+                    </div>
                 </section>
             </article>
         `);
@@ -56,8 +67,8 @@ customElements.define('edit-contact-info', class extends Component {
             if (!info) return;
 
             form.contact_id = info.contact_id;
-            form.contact_type = info.contact_type;
-            form.context = info.context;
+            form.type = info.contact_type;
+            form.content = info.content;
 
             this.mode = 'edit';
         });

src/queries/mod.rs

@@ -853,11 +853,10 @@ pub async fn update_contact(
     sqlx::query_as(
         r#"
 UPDATE contacts
-VALUES
-    owner_id = $2,
+SET
     contact_type = $3,
     content = $4
-WHERE id = $1
+WHERE id = $1 WHERE owner_id = $2
 RETURNING
     id,
     owner_id,