Category: javascript

I am using a normal formatter to format all relevant columns in a simple UI5 Table. However, one column requires a more complex conversion where the comparison data is coming from the database which have already retrieved into an array. This array is already declared as a global variable with a ‘this’ value which can be used globally.

However, when I want to use this in the formatter function, this is undefined and the ‘this’ control is referring to the internal formatter function. I am unable to refer to any global controller variable at all.

The formatter is called during a bindProperty function which I try to pass the array as a parts parameter, but unfortunately I am getting errors, passing parameters seems to be string components only.

is there a way to use external array data or model in a formatter or passing them to it.

Thanks.
Anand Muthu

Tried to pass array value through bindParameters using parts.

var that = this;
bindProperty(
"text", {
parts: [{ path: 'AA' }, 
{ path: 'A'}, 
{ path: that._C}],
{ path: that.array},
formatter: that.columnFormatter

This raise a binding error.

In the formatter, The formatter function is not a separate file but is just a function in the controller.

tried direct reference to the array in the formatter.
Eg. this.array -> get undefined

When the first request is sent, isVoting will be set to “true”. In this case, until isVoting is set to “false”, another request should not be allowed to be sent. But somehow isVoting is still “false” when i try to click downvote multiple times fast. And downvote request is being sent two times, which is incorrect. How can I solve this?

"use client";
import { downvoteAnswer } from "@/lib/actions/answer.action";
import Image from "next/image";
import { usePathname, useRouter } from "next/navigation";
import { useState } from "react";

interface Props {
  type: string;
  itemId: string;
  userId: string;
  upvotes: number;
  hasupVoted: boolean;
  downvotes: number;
  hasdownVoted: boolean;
  authorId: string;
  hasSaved?: boolean;
}

const Votes = ({
  type,
  itemId,
  userId,
  upvotes,
  hasupVoted,
  authorId,
  downvotes,
  hasdownVoted,
  hasSaved,
}: Props) => {
  const [isVoting, setIsVoting] = useState(false);
  const pathname = usePathname();
  const router = useRouter();

  const handleVote = async (action: string) => {
    console.log("isVoting:", isVoting);
    if (isVoting) {
      console.log("Request denied");
      return;
    }

      setIsVoting(true);
      await downvoteAnswer({
        answerId: JSON.parse(itemId),
        userId: JSON.parse(userId),
        hasupVoted,
        hasdownVoted,
        path: pathname,
      });
      setIsVoting(false);
    }
  };


  return (
    <div className="flex gap-5">
        <div className="flex-center gap-1.5">
          <Image
            src={
              hasdownVoted
                ? "/assets/icons/downvoted.svg"
                : "/assets/icons/downvote.svg"
            }
            width={18}
            height={18}
            alt="downvote"
            className="cursor-pointer"
            onClick={() => handleVote("downvote")}
          />
        </div>
    </div>
  );
};

export default Votes;

This is the transaction function that sends the request and receives the data for the TRX transaction below, but the tron_signTransaction method doesn’t read it correctly I built it via TronWeb.transactionBuilder.sendTrx.

        try {

            const transaction = responce.data[0]
            console.log('tron transaction: ', transaction, tronChains[0])    
            
            const resTransactionTron = await provider?.request({
                method: 'tron_signTransaction',
                params: { transaction }
            }, tronChains[0])
            console.log('res tron transaction; ', resTransactionTron)

        } catch (e) {
            console.log('error tron transaction: ', e)
        }

and this transaction object

{
    "permission": {
        "keys": [
            {
                "address": "41899ead35804115477d400d24cc164afd2d7047ae",
                "weight": 1
            }
        ],
        "permission_name": "dsaknbla",
        "threshold": 1
    },
    "raw_data": {
        "contract": [
            {
                "parameter": {
                    "type_url": "type.googleapis.com/protocol.TransferContract",
                    "value": {
                        "amount": 21617004,
                        "owner_address": "41e1e1e6f0832d3958624d6da1aedd823cea7663b3",
                        "to_address": "41299775b4ce6606e2b3c70ed7402f1068f9a79128"
                    }
                },
                "type": "TransferContract"
            }
        ],
        "data": "",
        "expiration": 1724838075860,
        "fee_limit": 1000000,
        "ref_block_bytes": "b44d",
        "ref_block_hash": "b7ae2e9d9f6593d9",
        "timestamp": 1724838015860
    },
    "signature": [],
    "txID": "7b165f77e619e1687ac61a9d4a8cd84fbbaa342aaa2162fb14c4b9014f07e270"
}

I need a working transaction method for TRX, I have a working one for contract tokens

i hope you’re doing well.

I have the follow situation.

I have a library for react native and inside my library project i want to create a Project to run this library and i want my project to listen the changes of this library.

I’ve trying to configure my ExampleProject/metro.condig.js but without success.

Follow my code.

I’ve tried to link the library with example project with yarn link and inside example project with yarn link <name_library> but without success.

How can i do that ?

I have plugin that I wrote that adds a menu item to the WordPress dashboard, which when selected, shows a template page that is coded in Templates/admin.php file.

This works, but now I am looking for an example of how to create a list of links or buttons that will call do_shortcode() for various functions from within the admin.php template.

I am currently creating a page for each with a shortcode call on it and using a sub menu item in the Dashboard to call that page, but I would really like to be able have a single control panel in Templates/admin.php verses sub-menu buttons that simply fire the shortcode via a page load.

<ul>
<li> do shortcode1 </li> // links to fire shortcode1, etc.
<li> do shortcode2 </li>
<li> do shortcode3 </li>
</ul>

I think the only way is to create a form that has various buttons which use the submit to calls a javascript function which then calls the do_shortcode(‘[shortcode1]’) function.

I am thinking that there is a better way, but not sure. Any help or examples would be greatly appreciated.

I have this code in devtools.js:

// calling this code for events
chrome.devtools.network.getHAR(
  async (harLog) => {
    for (let i = 0; i < harLog.entires.length; i++) {
      harLog.entires[i].body = await new Promise((resolve, reject) => {
        harLog.entires[i].getContent((content, encoding) => {
          resolve(content)
        })
      });
    }
    chrome.devtools.inspectedWindow.eval(`console.log( ${JSON.stringify(harLog)} )`);
    // processing harLog
  }
)

and if i call this code before updating the page (opened devtools), then everything works correctly, i can make endless requests, but if i reload the page (with open devtools), then the number of times i can call .getContent() decreases to 100 requests, and as it seemed to me , even these requests do not return content correctly, and then (after 100 requests) the code after calling .getContent() stops working, it just doesn’t start, I did not find any errors using trycatch

PS. if i reload the page again, then after each page reload there will be a maximum of 100 getContent() requests, but there are many more elements in harLog.entires

I tried outputting each step to the console, and still the code stops working after .getContent()
also, if i close and open devtools, the number of requests becomes infinite, but harLog is cleared, and harLog.entries.length === 0 (if i don’t close-open devtools, then after reloading the page the harLog history remains)

I want the harLog to be saved, and to be able to call .getContent() as many times as I want

I have array of objects with Tabulator table data like so:

[
    {
        priority: "Medium"
        priorityValue: 2
    },
    {
        priority: "Medium"
        priorityValue: 2
    },
    {
        priority: "Low"
        priorityValue: 1
    },
    {
        priority: "High"
        priorityValue: 3
    }
]

And the column for it is declared in the following format

{
    title: 'Priority',
    field: 'priority',
    minWidth: 120,
    type: 'string',
    sorter: 'string'
}

This is working fine if you I want to sort priorities alphabetically.
My question is how to sort it by priority value so when i click sorting in the header it’s displaying

Low
Medium
Medium
High

or

High
Medium
Medium
Low

I know I can use custom sorter function like for example

sorter(a, b, aRow, bRow, column, dir, sorterParams) {
   // a, b - the two values being compared
  // aRow, bRow - the row components for the values being compared (useful if you 
     need to access additional fields in the row data for the sort)
  // column - the column component for the column being sorted
  // dir - the direction of the sort ("asc" or "desc")
  // sorterParams - sorterParams object from column definition array
 
  return a - b; // you must return the difference between the two values
}

but a and b parameters return priority not priorityValue

Today I downloaded the gorhom Bottom Sheet package for my React Native project, but I couldn’t get my program to run.
I would appreciate if you could help me, the error is in the picture

I was waiting for the Gorhom bottom sheet to work, there is no problem when I downloaded it, but when I run the project, the program gives an error

Has anyone here experienced implementing Google OAuth with Sanctum authentication? I’m looking for guidance or insights on how to achieve this.

I’m working on a project where I need to integrate Google OAuth for user authentication while using Sanctum for API token management. I’m familiar with both technologies separately but unsure of how to combine them effectively. Specifically, I need help with:

Setting up Google OAuth in a Laravel 11 application, including configuring the necessary credentials and callback URLs.
Integrating Sanctum to handle API token management and ensuring that Sanctum works with the tokens provided by Google OAuth.
Implementing secure user sessions and API request handling with both Google OAuth and Sanctum in place.

I’ve tried various approaches but haven’t found a clear guide that covers both technologies together. If anyone has experience or can share detailed steps, code examples, or resources that could help me implement this setup correctly, I would greatly appreciate it. Any best practices or pitfalls to avoid would also be very helpful.

I have a list of movies that i get from an API call, after i render the movies in a grid format i then implement functionality to among other things play a trailer of the movie. The movie trailer comes from Youtube. Im hitting the youtube endpoint and getting audio back from Youtube together with a 401 error. Below are my components that im using to execute the process.

import React from 'react';
import ReactPlayer from 'react-player'

const YoutubePlayer = ({ videoKey }) => (
  <div className="video-wrapper">
    <iframe
      className="video-player"
      src={`https://www.youtube.com/embed/${videoKey}?autoplay=1&mute`}
      allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
      allowFullScreen
      width="100%"
      height="100%"
      title="YouTube video player"
      data-testid="youtube-player"
    ></iframe>
  </div>
  );

export default YoutubePlayer; 

import React, { useEffect } from 'react';
import Modal from 'react-modal';
import YoutubePlayer from './YoutubePlayer';
import '../styles/modal.scss';

Modal.setAppElement('#root');

const YoutubeModal = ({ isOpen, onClose, videoKey }) => {
    useEffect(() => {
        if (isOpen) {
            console.log(videoKey)
            document.body.classList.add('modal-open');
        } else {
            document.body.classList.remove('modal-open');
        }
    }, [isOpen]);

    useEffect(() => {
        if (isOpen && videoKey) {
            const handleResize = () => window.dispatchEvent(new Event('resize'));
            const timer = setTimeout(handleResize, 100);
    
            return () => clearTimeout(timer);
        }
    }, [isOpen, videoKey]);
    
    return (
        <Modal
            isOpen={isOpen}
            onRequestClose={onClose}
            contentLabel="YouTube Video Modal"
            className="modal"
            overlayClassName="overlay"
        >
            <button onClick={onClose} className="close-button">X</button>
            {videoKey ? (
                <YoutubePlayer videoKey={videoKey} />
            ) : (<p>No video available.</p>
            )} 
        </Modal>
    );
};

export default YoutubeModal

import { useEffect, useState } from 'react'
import { Routes, Route, createSearchParams, useSearchParams, useNavigate } from "react-router-dom"
import { useDispatch, useSelector } from 'react-redux'
import 'reactjs-popup/dist/index.css'
import { fetchMovies } from './data/moviesSlice'
import { ENDPOINT_SEARCH, ENDPOINT_DISCOVER, ENDPOINT, API_KEY } from './constants'
import Header from './components/Header'
import Movies from './components/Movies'
import Starred from './components/Starred'
import WatchLater from './components/WatchLater'
// changed import from uppercase T to lower case to match export
import YoutubeModal from './components/YoutubeModal'
import './app.scss'

const App = () => {

  const state = useSelector((state) => state)
  const { movies } = state
  const dispatch = useDispatch()
  const [searchParams, setSearchParams] = useSearchParams()
  const searchQuery = searchParams.get('search')
  const [videoKey, setVideoKey] = useState()
  const [isOpen, setOpen] = useState(false)
  const navigate = useNavigate()

  const closeModal = () => setOpen(false)

  const closeCard = () => {

  }

  const getSearchResults = (query) => {
    if (query !== '') {
      dispatch(fetchMovies(`${ENDPOINT_SEARCH}&query=` + query))
      setSearchParams(createSearchParams({ search: query }))
    } else {
      dispatch(fetchMovies(ENDPOINT_DISCOVER))
      setSearchParams()
    }
  }

  const searchMovies = (query) => {
    navigate('/')
    getSearchResults(query)
  }

  const getMovies = () => {
    if (searchQuery) {
      dispatch(fetchMovies(`${ENDPOINT_SEARCH}&query=` + searchQuery))
    } else {
      dispatch(fetchMovies(ENDPOINT_DISCOVER))
    }
  }

  const viewTrailer = async (movie) => {
    await getMovie(movie.id)
    if (videoKey) {
      setOpen(true)
    }
  };

  const getMovie = async (id) => {
    const URL = `${ENDPOINT}/movie/${id}?api_key=${API_KEY}&append_to_response=videos`

    setVideoKey(null)
    const videoData = await fetch(URL)
      .then((response) => response.json())

    if (videoData.videos && videoData.videos.results.length) {
      const trailer = videoData.videos.results.find(vid => vid.type === 'Trailer')
      setVideoKey(trailer ? trailer.key : videoData.videos.results[0].key)
    }
  }
  
  useEffect(() => {
    getMovies()
  }, [searchQuery])

  return (
    <div className="App">
      <Header searchMovies={searchMovies} searchParams={searchParams} setSearchParams={setSearchParams} />

      <div className="container">
        <Routes>
          <Route path="/" element={<Movies movies={movies} viewTrailer={viewTrailer} closeCard={closeCard} />} />
          <Route path="/starred" element={<Starred viewTrailer={viewTrailer} />} />
          <Route path="/watch-later" element={<WatchLater viewTrailer={viewTrailer} />} />
          <Route path="*" element={<h1 className="not-found">Page Not Found</h1>} />
        </Routes>

        {/* Modal Component */}
          <YoutubeModal isOpen={isOpen} onClose={closeModal} videoKey={videoKey} />
      </div>
    </div>
  )
}

export default App

I have checked if video key is correct. I had it logged in the console and then appended to the url and saw i do get to the video.

Trying to create this onscroll unlock screen animation – how do you keep the phone static/sticky – and give enough time to unlock the screen – before letting the phone move on scroll.

Also need to create a parallax effect with the text by the side of it so I’ve created a transformX function – which should split the text into negative/positive changes in the x.

https://jsfiddle.net/turo2vyw/11/

  $(document).ready(function() {

console.log("ready")
var myElement = $(".iphone-lock-screen-image");

var myElement1 = $(".hero-text-holder-1");

var myElement2 = $(".hero-text-holder-2");    


function setTransform(yPos, el) {
  el.style.transform = `transform: translate3d(0px, ${yPos}%, 0px) scale3d(1, 1, 1) rotateX(0deg) rotateY(0deg) rotateZ(0deg) skew(0deg, 0deg); transform-style: preserve-3d;`;
}



function setTransformX(xPos, el) {
  el.style.transform = `transform: translate3d(${xPos}px, 0px, 0px) scale3d(1, 1, 1) rotateX(0deg) rotateY(0deg) rotateZ(0deg) skew(0deg, 0deg); transform-style: preserve-3d;`;
}



$(document).scroll(function(e){
  
  console.log("e", e)
  
  let h = $("body").offset().top;
  console.log("h", h)
  
  setTransform(h*2, myElement[0])
  
  
  setTransformX(h*4, myElement1[0])
  setTransformX(-h*4, myElement2[0])
  
});



  });

.section-hero {
    position: relative;
    padding-top: 3em;
}


.small-container {
    position: relative;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    max-width: 900px;
    margin-right: auto;
    margin-left: auto;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}


.small-container {
    position: relative;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    max-width: 900px;
    margin-right: auto;
    margin-left: auto;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}


.hero-product-demo {
    position: relative;
    display: block;
    width: 100%;
    height: 160vh;
}

.product-demo-sticky {
    position: -webkit-sticky;
    position: sticky;
    top: 110px;
    z-index: 1;
    min-height: auto;
    padding-top: 0px;
}



.product-container {
    position: relative;
    top: -30px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    overflow: hidden;
    width: 100%;
    padding-top: 1em;
    padding-bottom: 1em;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}


.product-phone-image-holder {
    position: relative;
    width: 400px;
}

img {
    display: inline-block;
    max-width: 100%;
}

.product-phone-image {
    width: 100%;
}


.play-icon-holder {
    position: absolute;
    left: 50%;
    top: 50%;
    right: auto;
    bottom: auto;
    width: 100px;
    height: 100px;
    margin-top: -50px;
    margin-left: -50px;
    border-radius: 100%;
    -webkit-transition: box-shadow 200ms ease;
    transition: box-shadow 200ms ease;
    cursor: pointer;
}


.play-icon-image {
    position: relative;
    border-style: solid;
    border-width: 1px;
    border-color: rgba(250, 88, 83, 0.41);
    border-radius: 100%;
    box-shadow: 0 0 30px 0 rgba(0, 0, 0, 0.05);
}



.product-phone-content {
    position: absolute;
    left: 36px;
    top: 36px;
    right: 37px;
    bottom: 35px;
    z-index: -1;
    overflow: hidden;
}


.product-phone-demo-image {
    position: absolute;
    left: 0%;
    top: 0%;
    right: 0%;
    bottom: 0%;
    display: inline-block;
    width: 100%;
    height: 100%;
    opacity: 1;
    -o-object-fit: cover;
    object-fit: cover;
}


.iphone-lock-screen-image {
    position: absolute;
    left: 0%;
    top: 0%;
    right: 0%;
    bottom: 0%;
    display: inline-block;
    width: 100%;
    height: 100%;
    border-radius: 36px;
    opacity: 1;
    -o-object-fit: cover;
    object-fit: cover;
}


.hero-text-sticky {
    position: -webkit-sticky;
    position: sticky;
    top: 75px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    overflow: visible;
    width: 99vw;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
}



.hero-text-holder {
    position: absolute;
    top: 200px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    overflow: hidden;
    width: 99vw;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
}

.hero-text-holder-1 {
    overflow: hidden;
    width: 50vw;
    text-align: right;
}



.hero-text-line {
    position: relative;
    overflow: hidden;
    width: 3px;
    height: 160px;
    margin-top: 60px;
    border-radius: 20px;
    background-image: -webkit-gradient(linear, left top, right top, from(#fa5853), color-stop(50%, #f46692), to(#ffc444));
    background-image: linear-gradient(90deg, #fa5853, #f46692 50%, #ffc444);
}



h1 {
    margin-top: 20px;
    margin-bottom: 10px;
    font-family: Manrope, sans-serif;
    color: #323232;
    font-size: 75px;
    line-height: 1.2;
    font-weight: 800;
}

.hero-text {
    overflow: hidden;
    margin-top: 0px;
    margin-bottom: 0px;
    font-size: 210px;
    line-height: 1.2;
    font-weight: 800;
}

.hero-text._1 {
    padding-right: 1rem;
    background-image: -webkit-gradient(linear, left top, right top, from(#fa5853), to(#f46692));
    background-image: linear-gradient(90deg, #fa5853, #f46692);
    text-align: right;
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}



.hero-text-holder-2 {
    overflow: hidden;
    text-align: left;
}

.hero-text._2 {
    width: 48vw;
    padding-left: 1rem;
    background-image: -webkit-gradient(linear, left top, right top, from(#f46692), to(#ffc444));
    background-image: linear-gradient(90deg, #f46692, #ffc444);
    text-align: left;
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
<div class="section-hero">
  <div class="small-container">
    <div style="transform: translate3d(0px, 0px, 0px) scale3d(1, 1, 1) rotateX(0deg) rotateY(0deg) rotateZ(0deg) skew(0deg, 0deg); transform-style: preserve-3d;" class="hero-text-sticky">
      <div class="hero-text-holder">
        <div class="hero-text-holder-1" style="will-change: transform; transform: translate3d(-108.9px, 0px, 0px) scale3d(1, 1, 1) rotateX(0deg) rotateY(0deg) rotateZ(0deg) skew(0deg, 0deg); transform-style: preserve-3d;">
          <h1 style="transform: translate3d(0%, 0%, 0px) scale3d(1, 1, 1) rotateX(0deg) rotateY(0deg) rotateZ(0deg) skew(0deg, 0deg); transform-style: preserve-3d;" class="hero-text _1">Test1</h1>
        </div>
        <div class="hero-text-line" style="will-change: opacity; opacity: 0.274;"></div>
        <div class="hero-text-holder-2" style="will-change: transform; transform: translate3d(108.9px, 0px, 0px) scale3d(1, 1, 1) rotateX(0deg) rotateY(0deg) rotateZ(0deg) skew(0deg, 0deg); transform-style: preserve-3d;">
          <h1 style="transform: translate3d(0%, 0%, 0px) scale3d(1, 1, 1) rotateX(0deg) rotateY(0deg) rotateZ(0deg) skew(0deg, 0deg); transform-style: preserve-3d;" class="hero-text _2">Test2</h1>
        </div>
      </div>
    </div>
    <div data-w-id="08a4f49f-daee-82d9-5871-e852a62377d9" style="opacity: 1;" class="hero-product-demo">
      <div class="product-demo-sticky">
        <div class="product-phone-image-container">
          <div class="product-container">
            <div class="product-phone-image-holder"><img src="https://assets.website-files.com/604b35876a71cbbd84768e36/604ce94df02e1e447d32686d_Apple%20iPhone%2011%20Pro%20Space%20Grey%201.png" loading="lazy" sizes="(max-width: 479px) 300px, 400px" srcset="https://assets.website-files.com/604b35876a71cbbd84768e36/604ce94df02e1e447d32686d_Apple%20iPhone%2011%20Pro%20Space%20Grey%201-p-500.png 500w, https://assets.website-files.com/604b35876a71cbbd84768e36/604ce94df02e1e447d32686d_Apple%20iPhone%2011%20Pro%20Space%20Grey%201.png 588w" alt="" class="product-phone-image">
              <div class="product-phone-content"><img src="https://assets.website-files.com/604b35876a71cbbd84768e36/604d4b5ee9f5d3561967d646_ChatList-White.jpg" loading="lazy" sizes="(max-width: 479px) 246px, 327px" srcset="https://assets.website-files.com/604b35876a71cbbd84768e36/604d4b5ee9f5d3561967d646_ChatList-White-p-500.jpeg 500w, https://assets.website-files.com/604b35876a71cbbd84768e36/604d4b5ee9f5d3561967d646_ChatList-White.jpg 750w" alt="" class="product-phone-demo-image"><img src="https://assets.website-files.com/604b35876a71cbbd84768e36/604d43119ce091cb1037818c_LockScreen-Light.jpg" loading="lazy" sizes="(max-width: 479px) 246px, 327px" srcset="https://assets.website-files.com/604b35876a71cbbd84768e36/604d43119ce091cb1037818c_LockScreen-Light-p-800.jpeg 800w, https://assets.website-files.com/604b35876a71cbbd84768e36/604d43119ce091cb1037818c_LockScreen-Light.jpg 839w" alt="" class="iphone-lock-screen-image" style="will-change: transform; transform: translate3d(0px, 0%, 0px) scale3d(1, 1, 1) rotateX(0deg) rotateY(0deg) rotateZ(0deg) skew(0deg, 0deg); transform-style: preserve-3d;"></div>
            </div><a href="#" class="play-icon-holder w-inline-block w-lightbox" aria-label="open lightbox" aria-haspopup="dialog" style="will-change: opacity; opacity: 0;"><img src="https://assets.website-files.com/604b35876a71cbbd84768e36/604e0b990851a7f3bb6efd47_play-button.svg" loading="lazy" alt="" class="play-icon-image">
              <script type="application/json" class="w-json">
                {
                  "items": [{
                    "url": "https://www.youtube.com/watch?v=sWRUzxINCoA",
                    "originalUrl": "https://www.youtube.com/watch?v=sWRUzxINCoA",
                    "width": 940,
                    "height": 528,
                    "thumbnailUrl": "http://i.ytimg.com/vi/sWRUzxINCoA/hqdefault.jpg",
                    "html": "<iframe class="embedly-embed" src="//cdn.embedly.com/widgets/media.html?src=https%3A%2F%2Fwww.youtube.com%2Fembed%2FsWRUzxINCoA&display_name=YouTube&url=https%3A%2F%2Fwww.youtube.com%2Fwatch%3Fv%3DsWRUzxINCoA&image=http%3A%2F%2Fi.ytimg.com%2Fvi%2FsWRUzxINCoA%2Fhqdefault.jpg&key=96f1f04c5f4143bcb0f2e68c87d65feb&type=text%2Fhtml&schema=youtube" width="940" height="528" scrolling="no" title="YouTube embed" frameborder="0" allow="autoplay; fullscreen" allowfullscreen="true"></iframe>",
                    "type": "video"
                  }],
                  "group": ""
                }

              </script>
            </a>
          </div>
        </div>
      </div>
    </div>
  </div>
</div>

var doc = SpreadsheetApp.getActive();
var sheet = doc.getSheetByName(Sheet2);
var headers = sheet.getRange(1, 1, 1, sheet.getLastColumn()).getValues()[0];
var nextRow = sheet.getLastRow() + 1;
var newRow = headers.map(function(header) {
return header === 'Timestamp' ? new Date() : e.parameter[header]
});
sheet.getRange(nextRow, 1, 1, newRow.length).setValues([newRow]);

var eventTitle = newRow[5]; //this is submitted title
var allEventsSheet = doc.getSheetByName("Sheet1");
var inputData = allEventsSheet.getDataRange().getValues();

if (eventTitle !== ""){

for (var i = 0; i < inputData.length; ++i){
var row = inputData[i];
var col = row[10]; //all titles here

if (col == eventTitle){

var startTime = row[1];
var endTime = row[2];
var cal = CalendarApp.getCalendarById("[email protected]");
var events = cal.getEvents(new Date(startTime), new Date(endTime));

for (var j=0; j<events.length; j++){
var ev = events[j];
ev.deleteEvent();
}
}
}
}

Everything is working but the event is not deleted from the calendar. Thanks in advance!

I’m facing an issue with bundling my React library using Tsup, specifically when trying to support server components. The previous configuration bundled everything into one file, which caused conflicts with components that needed to be loaded as server components.

I’m attempting to bundle each component separately and use a barrel index file to gather them, applying the 'use client' directive only where necessary. However, this new configuration is resulting in a ERR_WORKER_OUT_OF_MEMORY error.

this is the ISSUE FROM GITHUB my LIbrary If you want to suggest some help or contribute

Previous Tsup Configuration

import { defineConfig } from 'tsup'

export default defineConfig((option) => ({
  entry: ['src/index.ts'],
  format: ['cjs', 'esm'],
  splitting: false,
  sourcemap: true,
  clean: true,
  dts: true,
  treeshake: true,
  external: ['react', 'react-dom'],
  minify: !option.watch,
}))

New Tsup Configuration

export default defineConfig({
  sourcemap: true,
  entry: ['./src/index.ts', './src/core/**/index.tsx'],
  format: ['cjs', 'esm'],
  splitting: false,
  outDir: 'dist/',
  dts: true,
  minify: true,
  treeshake: true,
  external: ['react', 'react-dom'],
  bundle: false,
  esbuildOptions(options, context) {
    options.outbase = './'
  },
})

Error

@pillar-ui/core:dev: Error [ERR_WORKER_OUT_OF_MEMORY]: Worker terminated due to reaching memory limit: JS heap out of memory

Goals

1. Bundle each component separately.
2. Add the "use client" directive to the components that require it.

I’m developing an open-source UI library, and I’m aiming to ensure it seamlessly supports the ‘use client’ directive by default this is the link of the issue in github for more info Pillar ui.

Any help in resolving this issue or suggestions for improving the bundling configuration would be greatly appreciated!

I’m a total novice, but I’ve been messing around with similar answers here, but haven’t got any luck. This just keeps refreshing the page instanly.

var current = new Date();
var future = new Date();
var x = Math.ceil(future.getMinutes() / 5) * 5;
future.setMinutes(x);

let timeout = (future.getTime() - current.getTime());
setTimeout(function() { window.location.reload(true); }, timeout);

enter image description here

He realizado la instalacion de un moodle en hostinger, al principio funciono bien pero pasando un tiempo al ir a calificar empezaron a surgir este error, que no se pueden visualizar los pdf a la hora de calificar, estoy usando una version de php 8.2 y una version de moodle de 4.2.2.
lo probe en otro servidor y funciono bien, bueno un servidor de prueba

Deseo poder solucionar este error, ya que mis estudiantes estan en el proceso de aprendizaje de virtualizacion de los procesos del aula y no quiero que se pierda el conocimiento que hemos venido trabajando con mooodle