diff --git a/src/components/settingsInputs.jsx b/src/components/settingsInputs.jsx
index a9374d5..155c425 100644
--- a/src/components/settingsInputs.jsx
+++ b/src/components/settingsInputs.jsx
@@ -140,6 +140,7 @@ function NoteTextArea({ value, onChange, preview = false }) {
       maxLength={5000}
       onChange={onChange}
       defaultValue={value}
+      id="noteTextArea"
     ></textarea>
   );
 }
@@ -159,8 +160,9 @@ function NotesAdditionalSettings({
                 text={locals.AIComplete}
                 className="m-1"
                 w="w-full"
-                onClick={() => {
-                  let text = Complete(noteText);
+                onClick={async () => {
+                  let text = await Complete(noteText);
+                  document.getElementById("noteTextArea").value = text;
 
                   onClick(text);
                 }}
diff --git a/src/pages/note.jsx b/src/pages/note.jsx
index 6e84d49..e8e6564 100644
--- a/src/pages/note.jsx
+++ b/src/pages/note.jsx
@@ -58,13 +58,14 @@ function NotePage() {
               value={note.text}
               onChange={(e) => (note.text = e.target.value)}
             />
-
-            <NotesAdditionalSettings
-              noteText={note.text}
-              onClick={(text) => {
-                note.text = text;
-              }}
-            />
+            <div className="grid grid-cols-1 lg:grid-cols-2 justify-items-center w-full">
+              <NotesAdditionalSettings
+                noteText={note.text}
+                onClick={(text) => {
+                  note.text = text;
+                }}
+              />
+            </div>
           </>
         ) : (
           <Note note={note} />