Antebios
Antebios
PostsComments
SSolidJS
Created by Antebios on 7/23/2024 in #support
How do I refresh data without reloading the page
It worked!! I did this all on the client side with no server-side code needed!! So within the client code that does the update 
function Submit() {
...
revalidate(getProjectsByUserId.keyFor(updateResult.ownerId));
}
function Submit() {
...
revalidate(getProjectsByUserId.keyFor(updateResult.ownerId));
}
I also created a refresh function: 
  function refreshTableData() {
    log.debug("Refresh Table Data");
    revalidate(getProjectsByUserId.key);
  }
  function refreshTableData() {
    log.debug("Refresh Table Data");
    revalidate(getProjectsByUserId.key);
  }
So when I update I call Submit and it updates the record, uses the returned value of ownerId to invalidate and then refresh the data table successfully. It looks great. And I added a refresh button to call refreshTableData that invalidates the whole results and it refreshes the data perfectly without needing a page refresh!!!
17 replies
SSolidJS
Created by Antebios on 7/23/2024 in #support
How do I refresh data without reloading the page
Is this done on the server or client side? Would a refresh method look like this? Server-Side: 
import { reload, revalidate } from "@solidjs/router";
export async function refreshProjectsByUserId(userId: number) {
  "use server";
  revalidate(getProjectsByUserId.keyFor(userId));
}
export async function refreshProjects() {
  "use server";
  revalidate(getProjectsByUserId.key);
}
import { reload, revalidate } from "@solidjs/router";
export async function refreshProjectsByUserId(userId: number) {
  "use server";
  revalidate(getProjectsByUserId.keyFor(userId));
}
export async function refreshProjects() {
  "use server";
  revalidate(getProjectsByUserId.key);
}
Client-Side: 
import { refreshProjectsByUserId, refreshProjects} from "~/hooks/useProjects";

function refreshData() {
  refreshProjects();
  // or refreshProjectsByUserId(Id);
}
import { refreshProjectsByUserId, refreshProjects} from "~/hooks/useProjects";

function refreshData() {
  refreshProjects();
  // or refreshProjectsByUserId(Id);
}
17 replies
SSolidJS
Created by Antebios on 7/23/2024 in #support
How do I refresh data without reloading the page
I want to know how to refresh the projects call with a refresh button on the page without needing to reload the page. Clicking to a different page and back also refreshes the data, of course.
17 replies
SSolidJS
Created by Antebios on 7/23/2024 in #support
How do I refresh data without reloading the page
Client code: 
const projects = createAsync(() => getProjectsByUserId(userId));

<For each={projects()}>
...
</For>
const projects = createAsync(() => getProjectsByUserId(userId));

<For each={projects()}>
...
</For>
17 replies
SSolidJS
Created by Antebios on 7/23/2024 in #support
How do I refresh data without reloading the page
Server code: 
type Projects = {
    id: number;
    name: string | null;
    description: string | null;
    ownerId: number;
    createdAt: string | null;
    updatedAt: string | null;
}

export const getProjectsByUserId = cache(
  async (userId: number): Promise<Projects[]> => {
    "use server";
    const reponse = await db.query.projects.findMany({
      with: {
        projectsUsers: {
          where: and(eq(projectsUsers.userId, userId)),
        },
      },
    });
    const results: Projects[] = Array.from(reponse);
    return results;
  },
  "ProjectsByUserId"
);
type Projects = {
    id: number;
    name: string | null;
    description: string | null;
    ownerId: number;
    createdAt: string | null;
    updatedAt: string | null;
}

export const getProjectsByUserId = cache(
  async (userId: number): Promise<Projects[]> => {
    "use server";
    const reponse = await db.query.projects.findMany({
      with: {
        projectsUsers: {
          where: and(eq(projectsUsers.userId, userId)),
        },
      },
    });
    const results: Projects[] = Array.from(reponse);
    return results;
  },
  "ProjectsByUserId"
);
17 replies
SSolidJS
Created by Antebios on 7/11/2024 in #support
How to process and save Uploaded File on server side
Update: I figured it out myself!!! This is just my proof-of-concept code: Client code: 
import { saveFile } from "~/lib/utility";
const handlerFileUpload = async (formData: FormData) =>
    await saveFile(formData);

  function handleFile() {
    ... {your code to get the file from your UI}
    const selectFile = {your code to return File}

    const fileForm = new FormData();
    fileForm.append("file", selectedFile);
    log.debug("File Form: ", fileForm);
    handlerFileUpload(fileForm);
  }
import { saveFile } from "~/lib/utility";
const handlerFileUpload = async (formData: FormData) =>
    await saveFile(formData);

  function handleFile() {
    ... {your code to get the file from your UI}
    const selectFile = {your code to return File}

    const fileForm = new FormData();
    fileForm.append("file", selectedFile);
    log.debug("File Form: ", fileForm);
    handlerFileUpload(fileForm);
  }
Server code: ~/lib/utility.ts 
import * as process from "process";
import { promisify } from "util";
import { writeFile } from "fs";

export async function saveFile(formData: FormData) {
  "use server";
  const writeFileAsync = promisify(writeFile);

  const currentWorkingDirectory = process.cwd();
  log.debug("currentWorkingDirectory: ", currentWorkingDirectory);
  const tempDir = `${currentWorkingDirectory}\\public\\assets\\temp`;

  try {
    const file = formData.get("file") as File;
    const fileName = file.name;
    const writePath = `${tempDir}\\${fileName}`;
    const fileArrayBuffer = await file.arrayBuffer();
    await writeFileAsync(writePath, Buffer.from(fileArrayBuffer));
  } catch (error) {
    console.error("Error saving file:", error);
  }
}
import * as process from "process";
import { promisify } from "util";
import { writeFile } from "fs";

export async function saveFile(formData: FormData) {
  "use server";
  const writeFileAsync = promisify(writeFile);

  const currentWorkingDirectory = process.cwd();
  log.debug("currentWorkingDirectory: ", currentWorkingDirectory);
  const tempDir = `${currentWorkingDirectory}\\public\\assets\\temp`;

  try {
    const file = formData.get("file") as File;
    const fileName = file.name;
    const writePath = `${tempDir}\\${fileName}`;
    const fileArrayBuffer = await file.arrayBuffer();
    await writeFileAsync(writePath, Buffer.from(fileArrayBuffer));
  } catch (error) {
    console.error("Error saving file:", error);
  }
}
I did a test wit both text and binary file, and then compared to the original files and they all matched.
2 replies
SSolidJS
Created by colinshen on 1/26/2024 in #support
How to set a cookie that is returned from api call?
Did you ever solve this error?
2 replies
SSolidJS
Created by Grahf on 4/1/2023 in #support
Pass ref in routeData
I figured out how to do it, thanks.
12 replies
SSolidJS
Created by Grahf on 4/1/2023 in #support
Pass ref in routeData
Does anyone have a code example for this?
12 replies
DTDrizzle Team
Created by Quea on 6/7/2023 in #help
onConflictDoUpdate array
If you want the actual syntax I do this: 
async addUserProfile(userProfile: NewUserProfile) {
    console.debug('useUsers.ts ==> addUserProfile ==> userProfile: ', userProfile);
    const result = await this.db.insert(tblUserProfiles).values(userProfile)
      .onConflictDoUpdate(
        {
          target: [tblUserProfiles.userId],
          set: {
            firstName: userProfile.firstName,
            lastName: userProfile.lastName,
            email: userProfile.email,
            phoneNumber: userProfile.phoneNumber,
            cellPhoneNumber: userProfile.cellPhoneNumber,
            addressLine1: userProfile.addressLine1,
            addressLine2: userProfile.addressLine2,
            city: userProfile.city,
            state: userProfile.state,
            zipCode: userProfile.zipCode,
            lastUpdateAt: new Date().toUTCString()
          }
        }
      ).returning();
async addUserProfile(userProfile: NewUserProfile) {
    console.debug('useUsers.ts ==> addUserProfile ==> userProfile: ', userProfile);
    const result = await this.db.insert(tblUserProfiles).values(userProfile)
      .onConflictDoUpdate(
        {
          target: [tblUserProfiles.userId],
          set: {
            firstName: userProfile.firstName,
            lastName: userProfile.lastName,
            email: userProfile.email,
            phoneNumber: userProfile.phoneNumber,
            cellPhoneNumber: userProfile.cellPhoneNumber,
            addressLine1: userProfile.addressLine1,
            addressLine2: userProfile.addressLine2,
            city: userProfile.city,
            state: userProfile.state,
            zipCode: userProfile.zipCode,
            lastUpdateAt: new Date().toUTCString()
          }
        }
      ).returning();
19 replies
DTDrizzle Team
Created by Quea on 6/7/2023 in #help
onConflictDoUpdate array
I ended up doing one by one.
19 replies
DTDrizzle Team
Created by volks on 5/29/2023 in #help
Postgres's Serial column type doesn't automatically have a default
Thank you! I thought I was going crazy, but I have the same issue.
6 replies