I am trying to set up a money transfer page.

When you pick a country, It is suppose to post the rate and percentage from the database(which is working fine).

What I am trying to achieve is; when a client inputs a figure, it is suppose to multiply or divide (which is dependent on the side at which the input was made), and other few calculations as shown in the JavaScript section of the codes. Initially it was working fine until I added the first script to the file.

The first script is function that post the rate and percentage when you choose the country.

Now I am trying to set these variables in the first script to add the the second to make the calculations work.

hence;

#percent is to replace #strike

#currencyrate is to replace echo naijasend

<script>
    var data = <?= @json_encode($data); ?>;
    console.log(data);
    function rating(id){
        for(var i =0; i < data.length; i++){
            if(id == data[i].id){
                $("#type").val(data[i].type);
                $("#currency_rate").val(data[i].currency_rate);
                $("#percent").val(data[i].percent);
            }
        }
    }
</script>
<script>
 var find_net = function(gross_val,net_val){
    const net_total = parseFloat(net_val) + parseFloat(gross_val);
    document.getElementById("netamount").value = net_total;
 }

$("#currency_value").change(function(){
  var val = $(this).val();
  $("#grossvalue").val((val *<?php echo $naijasend; ?>).toFixed(2));
  var cedi_value = $("#grossvalue").val();
  $("#strike").val((cedi_value *<?php echo $point_five; ?>).toFixed(2));
  find_net($("#strike").val(), cedi_value);
});

$("#grossvalue").change(function(){
  var val = $(this).val();
  $("#strike").val((val *<?php echo $point_five; ?>).toFixed(2));
  var cedi_value = $("#grossvalue").val();
  $("#currency_value").val((val /<?php echo $naijasend; ?>).toFixed(2));
  find_net($("#strike").val(), cedi_value);
});
</script>

And here is how the from looks like in html

Kindly note i am only showing the html section in question

                                    <h4 class="text-center">Beneficiary's Details</h4>
                                    <form method="POST"   enctype="multipart/form-data">
                                       <div class="row">
                                            <div class="col-md-6">
                                                <div class="form-group mb-4 mt-4">
                                                    <label for="">Select Country</label>
                                                    <div class="input-group">
                                                       <select name="currency_name" class='selectpicker' onchange="rating(this.value)" data-width='100%'>
                                                           <option>Select</option>
                                                           <?php
                                                            $sql = $conn->query("SELECT * FROM `exchange_rate` where `type` = 'send'");
                                                            while($ex = $sql->fetch(PDO::FETCH_ASSOC)){
                                                                $data[] = array(
                                                                        'id'=>$ex['id'],
                                                                        'currency_rate'=>$ex['currency_rate'],
                                                                        'type'=>$ex['type'],
                                                                        'percent'=>$ex['percent']
                                                                );
                                                                ?>
                                                                <option value="<?= $ex['id'] ?>"><?= ucwords($ex['currency_name']) ?></option>
                                                                <?php
                                                            }
                                                           ?>
                                                       </select>
                                                    </div>
                                                </div>
                                            </div>

                                            <div class="col-md-6">
                                                <div class="form-group mb-4 mt-4">
                                                    <label for="">Bank Name</label>
                                                    <div class="input-group ">
                                                        <input type="text" class="form-control" name="type" id="type" placeholder="Bank Name" aria-label="notification" aria-describedby="basic-addon1">
                                                    </div>
                                                </div>
                                            </div>
                                       </div>

                                        <div class="row">
                                           <div class="col-md-6">
                                               <div class="form-group mb-4 mt-4">
                                                   <label for="">Account Name</label>
                                                   <div class="input-group ">
                                                       <input type="text" class="form-control" name="acct_name"  placeholder="Beneficiary Account Name" aria-label="notification" aria-describedby="basic-addon1" value="<?= $_POST['acct_name']?>" required>
                                                   </div>
                                               </div>
                                           </div>

                                            <div class="col-md-6">
                                                <div class="form-group mb-4 mt-4">
                                                    <label for="">Account Number</label>
                                                    <div class="input-group ">
                                                        <input type="number" class="form-control" name="acct_number"  placeholder="Beneficiary Account Name" aria-label="notification" aria-describedby="basic-addon1" value="<?= $_POST['acct_number']?>" required>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>

                                        <div class="row">
                                            <div class="col-md-5">
                                                <div class="form-group mb-4 mt-4">
                                                    <label for="">Amount In Naira | CFA franc)</label>
                                                    <div class="input-group ">
                                                        <div class="input-group-prepend">
                                                    <span class="input-group-text" id="basic-addon1"><svg
                                                            xmlns="http://www.w3.org/2000/svg" width="24"
                                                            height="24" viewBox="0 0 24 24" fill="none"
                                                            stroke="currentColor" stroke-width="2"
                                                            stroke-linecap="round" stroke-linejoin="round"
                                                            class="feather feather-dollar-sign"><line x1="12" y1="1"x2="12"y2="23"></line><path d="M17 5H9.5a3.5 3.5 0 0 0 0 7h5a3.5 3.5 0 0 1 0 7H6"></path></svg></span>
                                                        </div>
                                                        <input type="number" class="form-control" id="currency_value" name="currency_value" value="<?= $_POST['$currency_value']?>" placeholder="Curreny Value" step="0.01" aria-label="notification" aria-describedby="basic-addon1" required>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="col-md-3">
                                                <div class="form-group mb-4 mt-4">
                                                    <label for="">Rate</label>
                                                    <div class="input-group ">
                                                        <input type="text" class="form-control" name="currency_rate" id="currency_rate" placeholder="Rate" aria-label="notification" aria-describedby="basic-addon1" readonly>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="col-md-4">
                                                <div class="form-group mb-4 mt-4">
                                                    <label for="">Amount In Cedis</label>
                                                    <div class="input-group ">
                                                        <div class="input-group-prepend">
                                                    <span class="input-group-text" id="basic-addon1"><svg
                                                            xmlns="http://www.w3.org/2000/svg" width="24"
                                                            height="24" viewBox="0 0 24 24" fill="none"
                                                            stroke="currentColor" stroke-width="2"
                                                            stroke-linecap="round" stroke-linejoin="round"
                                                            class="feather feather-dollar-sign"><line x1="12" y1="1"x2="12"y2="23"></line><path d="M17 5H9.5a3.5 3.5 0 0 0 0 7h5a3.5 3.5 0 0 1 0 7H6"></path></svg></span>
                                                        </div>
                                                        <input type="number" class="form-control" id="grossvalue" name="gross_value" value="<?= $_POST['gross_value']?>" placeholder="Amount in Cedis" step="0.01" aria-label="notification" aria-describedby="basic-addon1" required>
                                                    </div>
                                                </div>
                                            </div>                        
                                        </div>
                                        <div class="row">
                                            <div class="col-md-3">
                                                <div class="form-group mb-4 mt-4">
                                                    <label for="">Charges - 0.5%</label>
                                                    <div class="input-group ">
                                                        <input type="number" class="form-control" id="percent" name="trans_fees" aria-label="notification" value="<?= $_POST['trans_fees']?>" aria-describedby="basic-addon1" readonly required>
                                                    </div>
                                                </div>
                                            </div>  
                                        <div class="col-md-4">
                                               <div class="form-group mb-4 mt-4">
                                                   <label for="">Total Amount</label>
                                                   <div class="input-group ">
                                                       <div class="input-group-prepend">
                                                    <span class="input-group-text" id="basic-addon1"><svg
                                                            xmlns="http://www.w3.org/2000/svg" width="24"
                                                            height="24" viewBox="0 0 24 24" fill="none"
                                                            stroke="currentColor" stroke-width="2"
                                                            stroke-linecap="round" stroke-linejoin="round"
                                                            class="feather feather-dollar-sign"><line x1="12" y1="1"x2="12"y2="23"></line><path d="M17 5H9.5a3.5 3.5 0 0 0 0 7h5a3.5 3.5 0 0 1 0 7H6"></path></svg></span>
                                                       </div>
                                                       <input type="number" class="form-control" id="netamount" name="amount" value="<?= $_POST['amount']?>" placeholder="Amount" aria-label="notification" aria-describedby="basic-addon1" readonly required>
                                                   </div>
                                               </div>
                                           </div>

I dont know what i am doing wrong. An assistance will be appreciated

An image of how the form looks like

so per the form when yu select country it shows your rate and percentage fee going to be charges

but when a value is placed in either the cedi or naira section of the form the calculations should be done(division and multiplication respectively) and strike a percentage and show as total amount.

I have the script testing on a subdomain. I have give details to provide better understaing

I’m building a Chrome extension to capture and save conversation context from ChatGPT. The extension is supposed to:

Capture the conversation using a content script.

Save the conversation to chrome.storage.local.

Load the saved conversation into the input field when starting a new chat.

However, the extension is not working as expected. When I click Save Current Context, it says “Failed to capture conversation.”

Here’s my code:

manifest.json:

{
  "manifest_version": 3,
  "name": "AI Context Manager",
  "version": "1.0",
  "description": "Seamlessly manage conversation context across AI assistant sessions.",
  "permissions": ["storage", "activeTab", "scripting"],
  "background": {
    "service_worker": "background.js"
  },
  "action": {
    "default_popup": "popup.html",
    "default_icon": {
      "16": "icon16.png",
      "48": "icon48.png",
      "128": "icon128.png"
    }
  },
  "icons": {
    "16": "icon16.png",
    "48": "icon48.png",
    "128": "icon128.png"
  }
}

content.js

function captureConversation() {
  return new Promise((resolve) => {
    const selectors = [
      '.group\/conversation .text-message',
      '.message',
      '.text-base',
      'div[role="dialog"]',
      'div > div > p',
    ];

    const observer = new MutationObserver((mutations) => {
      mutations.forEach((mutation) => {
        for (const selector of selectors) {
          const conversationElements = document.querySelectorAll(selector);
          if (conversationElements.length > 0) {
            const conversation = Array.from(conversationElements).map(el => el.innerText).join('n');
            console.log('Captured conversation using selector:', selector, conversation); // Debugging
            observer.disconnect(); // Stop observing once the conversation is captured
            resolve(conversation);
            return;
          }
        }
      });
    });

    observer.observe(document.body, { childList: true, subtree: true });
  });
}

// Listen for messages from the popup or background script
chrome.runtime.onMessage.addListener((request, sender, sendResponse) => {
  if (request.action === 'captureConversation') {
    captureConversation().then((conversation) => {
      sendResponse({ conversation });
    });
    return true; // Indicates that the response will be sent asynchronously
  }
});

popup.js

document.getElementById('save-context').addEventListener('click', () => {
  chrome.tabs.query({ active: true, currentWindow: true }, (tabs) => {
    // Send a message to the content script to capture the conversation
    chrome.tabs.sendMessage(tabs[0].id, { action: 'captureConversation' }, (response) => {
      if (response && response.conversation) {
        const conversation = response.conversation;
        console.log('Conversation to save:', conversation); // Debugging

        // Save the conversation to chrome.storage.local
        chrome.storage.local.set({ conversation }, () => {
          console.log('Conversation saved to chrome.storage.local'); // Debugging
          alert('Context saved!');
        });
      } else {
        console.log('No conversation captured.'); // Debugging
        alert('Failed to capture conversation.');
      }
    });
  });
});

document.getElementById('load-context').addEventListener('click', () => {
  chrome.tabs.query({ active: true, currentWindow: true }, (tabs) => {
    chrome.storage.local.get(['conversation'], (result) => {
      if (result.conversation) {
        console.log('Loading conversation:', result.conversation); // Debugging
        chrome.scripting.executeScript({
          target: { tabId: tabs[0].id },
          func: (conversation) => {
            // Try multiple selectors to find the input field
            const selectors = [
              '#prompt-textarea', // Common ID for input field
              'textarea', // Generic textarea
              '[role="textbox"]', // Common role for input fields
            ];

            for (const selector of selectors) {
              const inputField = document.querySelector(selector);
              if (inputField) {
                console.log('Input field found using selector:', selector); // Debugging
                inputField.value = `Previous Context:n${conversation}nn`;
                return;
              }
            }

            console.log('No input field found using any selector.'); // Debugging
          },
          args: [result.conversation]
        });
      } else {
        console.log('No conversation found in storage.'); // Debugging
        alert('No saved context found.');
      }
    });
  });
});

background.js

chrome.runtime.onInstalled.addListener(() => {
  console.log('AI Context Manager installed.');
});

What I’ve Tried:

Updated the selectors in content.js to match ChatGPT’s DOM structure.
Added MutationObserver to handle asynchronous loading of conversation messages.
Verified that the storage permission is included in manifest.json.

Error Messages:
When I click Save Current Context, I see the following error in the console:

Failed to capture conversation.

Questions:

1. Are the selectors in content.js correct for ChatGPT’s current DOM structure?

2. Is there a better way to handle asynchronous loading of conversation messages?

3. Are there any permissions or settings I might be missing?

I’m looking at elements which don’t seem to have an onclick event registered. Inspecting the DOM I can’t find any yet the event fires when you click on it.

An example is Linktree profiles like this one which have buttons that when you click on them the link is constructed and it opens it but the elements don’t look like they specify it in any obvious way.

I thought there may be some global event listener for button elements but the elements appear to be generic with no “id” identifier so I can’t see how they are linked.

Do these use some method I don’t know about or is it some hack?

I’m encountering an issue with my Express routes where accessing the /notification/group endpoint incorrectly triggers the getNotificationByIdController instead of the intended getNotificationGroupsController.

import express from "express";
import { isAdmin } from "../middlewares/auth.middleware";
import notificationControllers from "../controllers/notification.controller";

const adminRouter = express.Router();

// Routes for individual notifications
adminRouter
    .route("/notification/:notificationId")
    .put(isAdmin, notificationControllers.updateNotificationController)
    .delete(isAdmin, notificationControllers.deleteNotificationController)
    .get(isAdmin, notificationControllers.getNotificationByIdController);

// Routes for notification groups
adminRouter
    .route("/notification/group")
    .post(isAdmin, notificationControllers.createNotificationGroupController)
    .get(isAdmin, notificationControllers.getNotificationGroupsController);

export default adminRouter;

GET /notification/group should invoke getNotificationGroupsController to fetch all notification groups.

(I’m aware Fuse.js development is currently a couple years old, but it still seems to be an efficient front-end search with newer development than lunr, eclipselunr, etc. If I’d benefit from another js search package, please let me know.)

I’m trying to code a website to allow users to search a simple title/keywords file and see the best results on a new webpage. The search works fine, but I’m struggling to get the results page to show anything of value. I downloaded the latest version of fuse.min.js from the github page, and all files are in the same folder directory. If my query is blank, I successfully get the “Please enter a search query” message, so I know that part works. I can’t tell if the fuse.min.js file isn’t being loaded or something else is poorly set up, and finding documentation for beginner coders like me hasn’t been all that successful. Do I have a mistake somewhere or is there a simpler way to handle what I’m attempting?

My current code looks as follows:

HTML results page:

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Search Results</title>
  <script type="text/javascript" src="fuse.min.js"></script>
</head>
<body>
  <h1>Search Results</h1>
  <div id="results"></div>

  <script>
    // Get URL query parameters
    function getQueryParam(param) {
      const urlParams = new URLSearchParams(window.location.search);
      return urlParams.get(param);
    }

    // Fetch search index and perform search
    async function performSearch() {
      const query = getQueryParam('query'); // Get the search query from URL
      const resultsContainer = document.getElementById('results');

      if (!query) {
        resultsContainer.innerHTML = '<p>Please enter a search query.</p>';
        return;
      }

      // Fetch the JSON index
      const response = await fetch('search-index.json');
      const index = await response.json();

      // Initialize Fuse.js
      const fuse = new Fuse(index, {
        keys: ['title', 'content'], // Fields to search in
        threshold: 0.4, // Adjust based on sensitivity (lower is stricter)
      });

      // Perform the search
      const results = fuse.search(query);

      // Display results
      if (results.length === 0) {
        resultsContainer.innerHTML = '<p>No results found.</p>';
      } else {
        resultsContainer.innerHTML = results
          .map(result => {
            const { item } = result;
            return `
              <div class="search-result">
                <a href="${item.url}">${item.title}</a>
                <p>${item.content}</p>
              </div>
            `;
          })
          .join('');
      }
    }

    // Run the search
    performSearch();
  </script>
</body>
</html>

And the search-index.json file is currently just a simple example:

[
  { "id": 1, "title": "Home", "url": "/index.html", "content": "Welcome to the homepage." },
  { "id": 2, "title": "About", "url": "/about.html", "content": "Learn more about us." },
  { "id": 3, "title": "Services", "url": "/services.html", "content": "We offer web development and design services." },
  { "id": 4, "title": "Contact", "url": "/contact.html", "content": "Get in touch with us." }
]

My goal is to be able to serialize alpine variables into JSON and send those JSONs to my backend via htmx. This would be way more convenient then sending disparate form input values and random hx-vals. Essentially I want to use an alpine.js object that I already have and pass it into htmx-vals. This seems like a very easy premise but is proving impossible to me thus far.

Right now here’s the code that I’m testing:

<div id="test_div" x-data="{
    testTest: [1,2,3]
}">
    <button hx-post="/test_handle"
            hx-ext="json-enc"
            hx-vals="js:{'data': JSON.stringify(testTest)}">
        Submit
    </button>
</div>

Obviously, this code doesn’t work because testTest is not visible in normal js context. How would I go about achieving what I want? Before the button there would also be inputs and other elements that would modify testTest via x-model or other alpine mechanisms, these updates need to be captured as well.

This is for a Hackattic challenge, but the gist of the challenge is to host a SSH accessible git server, make an empty repository and read a file off of the push.
I’m running OpenSSH server on windows and forwarded port 22.

My code does something like this:

• I receive the JSON from the challenge, I create a new user and directory with the same name as the username.

• In the new directory, the pub key gets pasted into .ssh/authorized_keys.

• Then, I initialize a bare git repository with the same path as the repo_path. The full path would look something like this: “C:/Users/username/repopath1/repopath2.git”.

Now I send a POST request to Hackattic, letting them know my repository is ready. However, they always come back with something like:

{
  error: "couldn't push to hax@(my ip):soft/scene.git - sorry, but we have no further details, check your server logs :(",
  debug: { attempted_repo_url: 'hax@(my ip):soft/scene.git' }
}

The thing is, when I try to ssh locally, there are no pub key issues or anything like that. One thing that’s strange though is I can ssh localhost, but if I try to ssh my public ip, it doesn’t connect, even though I’ve confirmed that port 22 is discoverable on canyouseeme.org and pinging my public ip works too.

I think it may be a permissions related issue or improper configuration between git and ssh, but I’ve been stuck on this for two days now and I desperately need guidance 🙁

Long line of code here for the details:

export const solve = async (problem: TProblem): Promise<TSolution> => {
    try {
        const { push_token, username, repo_path } = problem;
        const url = `${BASEURL}/_/git/${push_token}`;

        const repo_host = PUBLIC_IP;
        const repoDir = await prepareDir(problem);
        await prepareGit({ repoDir, repo_host, username, repo_path });
        await setPermissions({ repoDir, username });
        const response = await axios.post(url, {
            repo_host,
        });
        console.log(response.data);
        const secret = (await fs.readFile(path.join(repoDir, "solution.txt"))).toString();
        return {
            secret,
        };
    } catch (e) {
        console.error(e);
        throw e;
    }
};

    const setPermissions = async ({ repoDir, username }: PermissionParams) => {
    try {
        const ownership = await exec(`icacls "${repoDir}" /setowner "${username}"`);
        await exec(`icacls "${repoDir}" /reset`);
        await exec(`icacls "${repoDir}" /grant "${username}:(F)"`);
        await exec(`icacls "${repoDir}" /inheritance:r`);

        return ownership.stdout;
    } catch (e) {
        console.error(e);
        throw e;
    }
};

const prepareGit = async ({ repoDir, repo_host, username, repo_path }: GitParams) => {
    try {
        const remote = `${username}@${repo_host}:${repo_path}`;
        const options: Partial<SimpleGitOptions> = {
            baseDir: repoDir,
            binary: "git",
            maxConcurrentProcesses: 6,
            trimmed: true,
        };
        const git: SimpleGit = simpleGit(options);
        const init = await git.init(true);
        return init;
    } catch (e) {
        console.error(e);
        throw e;
    }
};

const prepareDir = async (problem: TProblem) => {
    try {
        const { repo_path, ssh_key, username } = problem;
        const userDir = path.join(ROOT_DIR, username);
        const sshDir = path.join(userDir, ".ssh");
        const repoDir = path.join(userDir, repo_path);
        const authKeyPath = path.join(sshDir, "authorized_keys");
        await fs.mkdir(repoDir, { recursive: true });
        await fs.writeFile(authKeyPath, ssh_key);

        return repoDir;
    } catch (e) {
        console.error(e);
        throw e;
    }
};

No matter what am I trying to do – I cannot think of a way to conenct my signal correctly and where is the best place to create it.
I have this flight service:

import { Injectable, signal } from '@angular/core';
import { catchError, Observable, retry, tap, throwError } from 'rxjs';
import { Flight } from '../models/flight';

@Injectable({
  providedIn: 'root'
})
export class FlightService {

  private API_URL = 'http://localhost:4963/'

  constructor(private http: HttpClient) { }

  public initFlights() : Observable<Flight[]> {
    return this.http.get<Flight[]>(this.API_URL + 'flights')
      .pipe(
        retry(1),
        catchError(this._handleError)
      )
  }

  private _handleError(err: HttpErrorResponse) {
    console.log('err:', err)
    return throwError(() => err)
  }
}

and I do not know if my component is suppose to have its own signal to store the data and pass it to the other components or the service itself.
The problem is that we are talking about an API call and it needs to be completed.
Not only that – I need my local signal/var to always have the latest value of the signal, but it won’t budge – it keeps being an empty array.

app ts

import { RouterOutlet } from '@angular/router';
import { AppHeaderComponent } from '../cmps/app-header/app-header.component';
import { FilterComponent } from '../cmps/filter/filter.component';
import { SelectedFlight } from '../models/selected-flight';
import { FlightListComponent } from '../cmps/flight-list/flight-list.component';
import { Flight } from '../models/flight';
import { FlightService } from '../services/flight.service';

@Component({
  selector: 'app-root',
  standalone: true,
  imports: [RouterOutlet, AppHeaderComponent, FilterComponent, FlightListComponent],
  templateUrl: './app.component.html',
  styleUrl: './app.component.scss'
})
export class AppComponent implements OnInit, OnDestroy {
  public flightService = inject(FlightService)
  flights_ = signal<Flight[]>([])

  async ngOnInit(): Promise<void> {
    this.flightService.initFlights()
      .subscribe({
        next: flights => {
          this.flights_.set(flights)
        }
      })
  }

  ngOnDestroy(): void {
    this.flights_.set([])
  }

  onSelectFlight = (flight: SelectedFlight) => {
    console.log('hi')
    console.log(flight)
  }
}

app html

<app-header></app-header>
<main class="main">
  <filter (selectFlight)="onSelectFlight($event)"></filter>
  <flight-list [flights]="flights_"></flight-list>
</main>

<router-outlet />

flight list html

<section class="flight-list">
    <ul class="flight-list-container">
        <flight-preview 
        *ngFor="let flight of flights(); 
        trackBy: trackByFn"
         [flight]="flight"></flight-preview>
    </ul>
</section>

flight-list ts

import { Component, inject, Input, Signal, WritableSignal } from '@angular/core';
import { Flight } from '../../models/flight';
import { CommonModule } from '@angular/common';
import { FlightPreviewComponent } from '../flight-preview/flight-preview.component';

@Component({
  selector: 'flight-list',
  standalone: true,
  templateUrl: './flight-list.component.html',
  styleUrl: './flight-list.component.scss',
  imports: [CommonModule, FlightPreviewComponent]
})
export class FlightListComponent {

  @Input() flights!: WritableSignal<Flight[]>

  trackByFn = (idx: number, flight: Flight) => {
    console.log(flight.flightNumber)
    return flight.flightNumber
  }

}

I have tried setting the data to a signal in a service and getting the data from it from the other components but it won’t get updated, i cannot use the effect function in most places of my ts component files, the API call is correct (I have checked it with the log), but I cannot think of a way to have signals throughout my app (My app needs to be supported by signals ,not observables) and make the data flow each time it changes in the signal.

As far as I know the best practice is to have the signal in the service, but then how can I get the latest changes and data from the component themselves and which one should subscribe? How do I pass the data so I can iterate it in the list every time it changes?

I am trying to create a poke function with firebase functions and firebase cloud messaging in flutter. But i am getting bad request 400 invalid arguments error. I added log lines to my sendPoke.js file to check what is the problem. And the problem i am getting is sentBy and senTo is null. But i am sure sentTo or sentBy not null. can you help me?
this is my sendPoke.js file

const functions = require("firebase-functions");
const admin = require("firebase-admin"); //admin sdk

module.exports = async (data,context) => {
  const sentBy = context.auth?.uid; // Dürten kullanıcı
  const sentTo = data.sentTo;       // Dürtülen kullanıcı
  const message = data.message || "Seni dürttü!";
  const currentTime = admin.firestore.Timestamp.now();


  //I am giving error in here
  if (!sentBy || !sentTo) { 
    throw new functions.https.HttpsError(
      "invalid-argument",
      "requester and recever informations are necessary."
      
    );
  }
 await admin.messaging.sendToDevice(sentTo, payload);//send a notifications to user

and this is how i am calling this function in dart :

Future<void> sendPokeNotification(String sentTo) async {
  try {
    // call callable function
    final HttpsCallable callable =
        FirebaseFunctions.instance.httpsCallable('sendPoke');

    print('senTo '+sentTo);//this is not null
    final currentUser = FirebaseAuth.instance.currentUser;
if (currentUser == null) {
  throw Exception("The user did not login.");
}

final idToken = await currentUser.getIdToken();
print("UserID Token: $idToken");
    // send data and give respond
    final response = await callable.call(<String, dynamic>{
      "sentTo": sentTo, // reciever UID
      "message": 'Hi, i poked you!', // message content
    });

    print('Function respond: ${response.data}');
  } catch (e) {
    print('Send Poke Error: $e');
  }
}

sentBy is sender uid and sentTo is reciever device Token.
Also i added sendPoke function to idnex.js file with this way :

const sendPoke = require("./functions/utilities/pokeAndNotifications/sendPoke");
exports.sendPoke = functions.https.onCall(sendPoke);

I want to add to my offline web system a feature that reads the height and weight of an item from a message sent by a customer and stores this info in my database. I have completed my Facebook developer account setup, but I can’t find any online info about what’s next.

Everything was working fine before, but after running the command vercel dev locally, I encounter the following error:When I run vercel dev on my project, I encounter the following error:

Error [ERR_REQUIRE_ESM]: require() of ES Module /home/mrahk/Documents/development/Projects/url-shortner/node_modules/nanoid/index.js from /home/mrahk/Documents/development/Projects/url-shortner/controllers/url.js not supported.
Instead change the require of index.js in /home/mrahk/Documents/development/Projects/url-shortner/controllers/url.js to a dynamic import() which is available in all CommonJS modules.

This error happens when I try to dynamically import nanoid in my controller file (url.js):

const asyncHandler = require("express-async-handler");
const urlModel = require("../models/url");
const BASE_URL = process.env.BASE_URL || "http://localhost:8000";
let nanoid;
(async () => {
  const { nanoid: nanoidFn } = await import("nanoid");
  nanoid = nanoidFn;
})();

I expected the dynamic import to work as it did before running the vercel dev command. However, after executing this command, I’m encountering the ERR_REQUIRE_ESM error. I’m expecting the import to function as before, without any issues, allowing me to use nanoid(7) to generate unique IDs in my postUrl function.

I’m working on a project for people who are new to web development and open source.

It’s called code contributions. Users will go through a tutorial, add an HTML file and submit a pull request to the same repository on GitHub.

I have two self imposed restrictions for this project.

1. Users shouldn’t have to install anything or setup tooling
2. Their changes should be a separate HTML file

Reasoning behind (1) is to make the project more accessible. I’m assuming users would already have a web browser, text editor and terminal emulator on their machine. I’d like them to be able to complete the tutorial without installing any tooling (runtime, compiler etc) of a language. I’m expecting users to open index.html in their browser and see their changes.

Reasoning behind (2) is to avoid a big HTML file and merge conflicts

To implement fragments, I tried vanilla js, HTMX, Unpoly etc. My implementations ended up needing a server to be run on local (which goes against (1))

I ended up with a solution using iframes. All fragment HTML files are loaded in iframes now. I don’t like this solution though. Ideally, I like to share scope, styles etc from the parent with child fragments.

If you have suggestions on enabling HTML fragments, please let me know.

So I am a beginner at javascript and learnt that there are only a limited falsy values: false, 0, -0, BigInt 0n, “”, null, undefined, NaN
Yet when I use the == operator with truthy values, this doesnt seem to be the case.
I am unable to understand the issue with the equality operator and the boolean outputs.

// outputs are written as comments
console.log(false == "0"); //true
console.log(false == []); //true

console.log(Boolean("0")); //true
console.log(Boolean([])); //true
console.log(Boolean([]) == []); //false

Goodmorning everyone!

I wrote this:

let user_sess = {
            name: 'admin',
            service_ID: '-C4C302',
            Connect(){                                                                      
                this.remote_url = 'ws://' + location.host + ':40000';
                this.backend = new WebSocket(this.remote_url, this.service_ID);
                this.backend.onopen = (e)=>{alert("WebSocket Connected!");};
                this.backend.onerror = (error)=>{alert(`WebSocket Error: ${error.message}`);};
                this.backend.onclose = (e)=>{alert("WebSocket Closed!");};
            },
        };

Calling the ‘Connect’ function here:

<input type="button" value="Connect" onclick="user_sess.Connect()"><br>

The onerror and onclose event works fine instead of onopen that doesn’t tringgers the handler. what i missed?
I also tried using the addEventListener method instead of setting the object property

I’m trying to set up a simple email subscription system using Google Apps Script and a Google Spreadsheet. The idea is that users enter their email in a form on my website, and the email gets sent via a fetch POST request to a Google Apps Script Web App. The script should then add the email to a Google Spreadsheet.

Here’s my Google Apps Script code:

function doPost(e) {
  try {
    // Parse the incoming request
    const email = JSON.parse(e.postData.contents).email;

    // Open the spreadsheet and append the email
    const spreadsheetId = "CENSORED";
    const sheet = SpreadsheetApp.openById(spreadsheetId).getActiveSheet();
    sheet.appendRow([email]);

    // Return a success message
    return ContentService.createTextOutput(
      JSON.stringify({ message: "Subscription successful!" })
    ).setMimeType(ContentService.MimeType.JSON);

  } catch (error) {
    // Return an error message
    return ContentService.createTextOutput(
      JSON.stringify({ message: "Error: " + error.message })
    ).setMimeType(ContentService.MimeType.JSON);
  }
}

Here’s the frontend JavaScript code that makes the request:

const subscribeButton = document.querySelector('.sketchy-button');

subscribeButton.addEventListener('click', () => {
  const emailInput = document.getElementById('email-input');
  const email = emailInput.value;

  if (email) {
    fetch('CENSORED', {
      method: "POST",
      headers: {
        "Content-Type": "application/json",
      },
      body: JSON.stringify({ email }),
    })
      .then(response => response.json())
      .then(data => {
        if (data.message === "Subscription successful!") {
          alert("Thanks for subscribing!");
          emailInput.value = "";
        } else {
          alert("Something went wrong: " + data.message);
        }
      })
      .catch(error => {
        console.error("Error:", error);
        alert("An error occurred. Please try again later.");
      });
  } else {
    alert("Please enter an email first.");
  }
});

I’ve deployed the Google Apps Script as a Web App with the permissions set to “Anyone with the link,” and I’m sure the Web App URL in the fetch call is correct.

However, it’s not working! The email doesn’t show up in the spreadsheet, and I’m seeing this error in the Apps Script logs:

Jan 27, 2025, 2:05:12 AM    Info    Request received: {"postData":{"contents":"{"email":"[email protected]"}"}}
Jan 27, 2025, 2:05:13 AM    Info    Email added to spreadsheet
Jan 27, 2025, 2:05:13 AM    Info    Error: ContentService.createTextOutput(...).setMimeType(...).setHeader is not a function
Jan 27, 2025, 2:05:13 AM    Error   TypeError: ContentService.createTextOutput(...).setMimeType(...).setHeader is not a function
    at doPost(Code:33:8)
    at testDoPost(Code:43:16)
    at [unknown function](Code:47:1)

I’ve also tried removing the .setHeader() part (since it doesn’t seem to work with ContentService), but even after that, the emails still don’t make it to the spreadsheet.

What am I doing wrong? How can I fix this?

I tried setting up a POST request from my website to the Google Apps Script Web App. I expected the script to extract the email from the request and append it as a new row in my Google Sheet.

Instead, I kept getting an error in the Apps Script logs:
TypeError: ContentService.createTextOutput(...).setMimeType(...).setHeader is not a function

Even after removing the .setHeader() part (which I learned doesn’t work with ContentService), the email still doesn’t show up in the spreadsheet. I’ve also confirmed the Web App URL and permissions are correct. Still no luck!