zomh
zomh
Explore posts from servers
RRailway
Created by zomh on 3/14/2024 in #✋|help
Strapi Deployment "Application failed to respond"
No description
33 replies
RRefine
Created by other-emerald on 3/12/2024 in #ask-any-question
Refine and Server Components
Hello, is there any info regarding Refine and server components? I found this blog post: https://refine.dev/blog/react-server-components/#pros-and-cons-of-react-server-components It's very well written but it does not say anything about refine and server components. I searched in Discord but did not really find a lot. I know Refine does support Nextjs and Nextjs (i think 13+) does use server components. So how does that integrate with Refine and e.g. it's data providers? Some data providers use a axios instance to fetch. Can someone provide an overview of what's already supported, what's on the roadmap and what's outside of scope regarding Refine and server components? Thank you
6 replies
RRefine
Created by ambitious-aqua on 7/11/2023 in #ask-any-question
resource.route is deprecated
No description
12 replies
RRefine
Created by conscious-sapphire on 7/5/2023 in #ask-any-question
useSelect typing when using optionLabel and optionValue
I am using useSelect with optionLable and optionValue as described here: https://refine.dev/docs/api-reference/core/hooks/useSelect/#optionlabel-and-optionvalue How to type useSelect when using Object path syntax?
const { options, queryResult } = useSelect<IRevenueResponseResultOnly>({
resource: "revenue",

filters: [
{ field: "financialplan][id]", operator: "eq", value: selectedFinplan },
{ field: "resultsonly", operator: "eq", value: true },
],



optionLabel: "revenuestream.base.name",
optionValue: "revenuestream.basisangaben.id",

queryOptions: {
queryKey: ["revenue", selectedFinplan],
enabled: selectedFinplan > 0 ? true : false,
},

})
const { options, queryResult } = useSelect<IRevenueResponseResultOnly>({
resource: "revenue",

filters: [
{ field: "financialplan][id]", operator: "eq", value: selectedFinplan },
{ field: "resultsonly", operator: "eq", value: true },
],



optionLabel: "revenuestream.base.name",
optionValue: "revenuestream.basisangaben.id",

queryOptions: {
queryKey: ["revenue", selectedFinplan],
enabled: selectedFinplan > 0 ? true : false,
},

})
optionLabel and optionValue give a typescript error: Type '"revenuestream.basisangaben.name"' is not assignable to type 'keyof IRevenueResponseResultOnly'.ts(2322)
6 replies
RRefine
Created by noble-gold on 7/1/2023 in #ask-any-question
Headless Navigation / Headless EditButton
I am in the process of migrating to a headless UI in my refine project. I was just implementing a Edit Button and was wondering if my implementation was really the way to go. Here is my implementation:
{
id: "actions",
header: "Edit",
accessorKey: "revenuestream.id",
maxSize: 100,
cell: function render({ table, row, getValue }) {
const umsatzpostenId = getValue()
const getToPath = useGetToPath()
const { resource } = useResource(table.options.data[0].revenuestream.slug);

const go = useGo()
const editPath = getToPath({
action: "edit",
resource: resource,
meta: {
id: umsatzpostenId,

},
})


return (
<div>
{/* OLD WAY with MUI <EditButton
className="text-black bg-primary hover:bg-primary/75"
resourceNameOrRouteName="revenue-subscriptionmodels"
hideText
recordItemId={umsatzpostenId}
resource={table.options.data[0].revenuestream.slug}
/> */}
<Button
variant="ghost"
size="sm"
onClick={() => {
go({
to: editPath,
})
}}
>
<Edit className="h-4 w-4 text-primary" />
</Button>
</div>
)
},
},
{
id: "actions",
header: "Edit",
accessorKey: "revenuestream.id",
maxSize: 100,
cell: function render({ table, row, getValue }) {
const umsatzpostenId = getValue()
const getToPath = useGetToPath()
const { resource } = useResource(table.options.data[0].revenuestream.slug);

const go = useGo()
const editPath = getToPath({
action: "edit",
resource: resource,
meta: {
id: umsatzpostenId,

},
})


return (
<div>
{/* OLD WAY with MUI <EditButton
className="text-black bg-primary hover:bg-primary/75"
resourceNameOrRouteName="revenue-subscriptionmodels"
hideText
recordItemId={umsatzpostenId}
resource={table.options.data[0].revenuestream.slug}
/> */}
<Button
variant="ghost"
size="sm"
onClick={() => {
go({
to: editPath,
})
}}
>
<Edit className="h-4 w-4 text-primary" />
</Button>
</div>
)
},
},
Do really have to call 3 hooks to navigate to edit a certain resource or is there a better way?
8 replies
RRefine
Created by extended-salmon on 4/6/2023 in #ask-any-question
Deployment to Vercel 404 not found when pasting URL
No description
8 replies
RRefine
Created by wise-white on 3/28/2023 in #ask-any-question
Sider and Top Menu
No description
7 replies
RRefine
Created by ratty-blush on 1/17/2023 in #ask-any-question
Howto set saveButtonProps.onClick correctly?
I am trying to overwrite the saveButtonProps.onClick function. However i cant quite get it:
const reactHookFormMethods = useStepsForm<BaseRecord, HttpError, ExpenseStartupAPI>({
refineCoreProps: {
action: "edit",
metaData: {
populate: ["administration", "businessplan", "vermittlung","geschaeftsausstattung","weitereKosten"],
},
},
})
...

const {handleSubmit, refineCore:{onFinish}} = reactHookFormMethods

reactHookFormMethods.saveButtonProps.onClick = (e) => {
console.log("saveButtonProps onclick is executed",e)
handleSubmit((values) => {
console.log("iam in hanldesubmit")
const convertedDate = new Date(values.start).toJSON()
values.start = convertedDate
// @ts-ignore
values.financialplan = 14
console.log("🚀 ThIS DATA IS SENT TO BACKEND::::::::::::::::::: ~ file: edit.tsx:64 ~ handleSubmit ~ values", values)
onFinish(values)
})
}
const reactHookFormMethods = useStepsForm<BaseRecord, HttpError, ExpenseStartupAPI>({
refineCoreProps: {
action: "edit",
metaData: {
populate: ["administration", "businessplan", "vermittlung","geschaeftsausstattung","weitereKosten"],
},
},
})
...

const {handleSubmit, refineCore:{onFinish}} = reactHookFormMethods

reactHookFormMethods.saveButtonProps.onClick = (e) => {
console.log("saveButtonProps onclick is executed",e)
handleSubmit((values) => {
console.log("iam in hanldesubmit")
const convertedDate = new Date(values.start).toJSON()
values.start = convertedDate
// @ts-ignore
values.financialplan = 14
console.log("🚀 ThIS DATA IS SENT TO BACKEND::::::::::::::::::: ~ file: edit.tsx:64 ~ handleSubmit ~ values", values)
onFinish(values)
})
}
Inside another Component:
...
<Edit
isLoading={formLoading}
saveButtonProps={saveButtonProps}
...
/>
...
<Edit
isLoading={formLoading}
saveButtonProps={saveButtonProps}
...
/>
The first console.log gets fired console.log("saveButtonProps onclick is executed",e) However the second one is not reached Can someone help thank you
5 replies
RRefine
Created by extended-salmon on 1/14/2023 in #ask-any-question
useTable Typing error is unkown
No description
12 replies
RRefine
Created by extended-salmon on 1/11/2023 in #ask-any-question
Mutation Mode
No description
3 replies
RRefine
Created by fascinating-indigo on 12/16/2022 in #ask-any-question
useFieldArray's update() and replace() reset Dirtyfields in Edit
This is a wierd one. When using update() or replace() method from useFieldArray. The Dirtyfields do get reset while in <Edit> View which seems wrong. Same scenario in <Create> View works, however. Steps to reproduce: Visit codesandbox i prepared: https://codesandbox.io/p/github/capsloq/form-react-hook-form-use-steps-form 1. Click Create Post 2. Type something into Title Field 3. Go To Step 2 by clicking Next 4. Klick "klick this to use update()" button 5. Notice that title is still dirty after clicking the button ✅ 6. If you go back to Step 1 you will see that the Title you typed is still there. Now go back to all posts (/posts) 1. Click on the Edit Button of one post 2. Type something into Title Field 3. Go To Step 2 by clicking Next 4. Klick "klick this to use update()" button 5. Notice that title is not dirty anymore after clicking the button and the value form Step 1 is lost ❌ Is that intentional or whats happening here? I was not able to reproduce that with the original react-hook-form. Thank you
7 replies
RRefine
Created by fascinating-indigo on 12/8/2022 in #ask-any-question
Custom Sider render property Type Error
No description
7 replies
RRefine
Created by xenophobic-harlequin on 12/7/2022 in #ask-any-question
Make useSearchParams() hook available in pankodrefine-react-router-v6
Is it possible to make React Router's useSearchParams hook available through refine-react-router-v6? https://reactrouter.com/en/main/hooks/use-search-params I know one could format and parse searchparams with the help of a third party package but the built in hook seems more convenient. 🥺 Correct me if its already possible. Thank you
21 replies
RRefine
Created by correct-apricot on 12/3/2022 in #ask-any-question
use router v6 with search params
Hello 👋 i am trying to programmatically redirect to the create view of a resource and passing some search params. My code is redirecting correctly but there are no search params in the url:
import { useNavigation } from "@pankod/refine-core";
...
const { push, goBack, createUrl } = useNavigation();
...
const customSubmit = (values: FieldValues) => {
// push to path with query params
push(createUrl(resourcename), { search: '?sort=date&order=newest'})

}
import { useNavigation } from "@pankod/refine-core";
...
const { push, goBack, createUrl } = useNavigation();
...
const customSubmit = (values: FieldValues) => {
// push to path with query params
push(createUrl(resourcename), { search: '?sort=date&order=newest'})

}
Can someone point me in the right direction? Thank you
7 replies