|
| 1 | +/* eslint-disable import/no-anonymous-default-export */ |
| 2 | +import fakeRestProvider from 'ra-data-fakerest'; |
| 3 | + |
| 4 | +import { |
| 5 | + CreateParams, |
| 6 | + DataProvider, |
| 7 | + GetListParams, |
| 8 | + GetOneParams, |
| 9 | + GetManyParams, |
| 10 | + GetManyReferenceParams, |
| 11 | + Identifier, |
| 12 | + DeleteParams, |
| 13 | + RaRecord, |
| 14 | + UpdateParams, |
| 15 | + UpdateManyParams, |
| 16 | + DeleteManyParams, |
| 17 | +} from 'ra-core'; |
| 18 | +import pullAt from 'lodash/pullAt'; |
| 19 | +import localforage from 'localforage'; |
| 20 | + |
| 21 | +/** |
| 22 | + * Respond to react-admin data queries using a localForage for storage. |
| 23 | + * |
| 24 | + * Useful for local-first web apps. |
| 25 | + * |
| 26 | + * @example // initialize with no data |
| 27 | + * |
| 28 | + * import localForageDataProvider from 'ra-data-local-forage'; |
| 29 | + * const dataProvider = await localForageDataProvider(); |
| 30 | + * |
| 31 | + * @example // initialize with default data (will be ignored if data has been modified by user) |
| 32 | + * |
| 33 | + * import localForageDataProvider from 'ra-data-local-forage'; |
| 34 | + * const dataProvider = await localForageDataProvider({ |
| 35 | + * defaultData: { |
| 36 | + * posts: [ |
| 37 | + * { id: 0, title: 'Hello, world!' }, |
| 38 | + * { id: 1, title: 'FooBar' }, |
| 39 | + * ], |
| 40 | + * comments: [ |
| 41 | + * { id: 0, post_id: 0, author: 'John Doe', body: 'Sensational!' }, |
| 42 | + * { id: 1, post_id: 0, author: 'Jane Doe', body: 'I agree' }, |
| 43 | + * ], |
| 44 | + * } |
| 45 | + * }); |
| 46 | + */ |
| 47 | +export default async ( |
| 48 | + params?: LocalForageDataProviderParams |
| 49 | +): Promise<DataProvider> => { |
| 50 | + const { |
| 51 | + defaultData = {}, |
| 52 | + prefixLocalForageKey = 'ra-data-local-forage-', |
| 53 | + loggingEnabled = false, |
| 54 | + } = params || {}; |
| 55 | + |
| 56 | + const getLocalForageData = async (): Promise<any> => { |
| 57 | + const keys = await localforage.keys(); |
| 58 | + const keyFiltered = keys.filter(key => { |
| 59 | + return key.includes(prefixLocalForageKey); |
| 60 | + }); |
| 61 | + |
| 62 | + if (keyFiltered.length === 0) { |
| 63 | + return undefined; |
| 64 | + } |
| 65 | + const localForageData: Record<string, any> = {}; |
| 66 | + |
| 67 | + for (const key of keyFiltered) { |
| 68 | + const keyWithoutPrefix = key.replace(prefixLocalForageKey, ''); |
| 69 | + const res = await localforage.getItem(key); |
| 70 | + localForageData[keyWithoutPrefix] = res || []; |
| 71 | + } |
| 72 | + return localForageData; |
| 73 | + }; |
| 74 | + |
| 75 | + const localForageData = await getLocalForageData(); |
| 76 | + const data = localForageData ? localForageData : defaultData; |
| 77 | + |
| 78 | + // Persist in localForage |
| 79 | + const updateLocalForage = (resource: string) => { |
| 80 | + localforage.setItem( |
| 81 | + `${prefixLocalForageKey}${resource}`, |
| 82 | + data[resource] |
| 83 | + ); |
| 84 | + }; |
| 85 | + |
| 86 | + const baseDataProvider = fakeRestProvider( |
| 87 | + data, |
| 88 | + loggingEnabled |
| 89 | + ) as DataProvider; |
| 90 | + |
| 91 | + return { |
| 92 | + // read methods are just proxies to FakeRest |
| 93 | + getList: <RecordType extends RaRecord = any>( |
| 94 | + resource: string, |
| 95 | + params: GetListParams |
| 96 | + ) => { |
| 97 | + return baseDataProvider |
| 98 | + .getList<RecordType>(resource, params) |
| 99 | + .catch(error => { |
| 100 | + if (error.code === 1) { |
| 101 | + // undefined collection error: hide the error and return an empty list instead |
| 102 | + return { data: [], total: 0 }; |
| 103 | + } else { |
| 104 | + throw error; |
| 105 | + } |
| 106 | + }); |
| 107 | + }, |
| 108 | + getOne: <RecordType extends RaRecord = any>( |
| 109 | + resource: string, |
| 110 | + params: GetOneParams<any> |
| 111 | + ) => baseDataProvider.getOne<RecordType>(resource, params), |
| 112 | + getMany: <RecordType extends RaRecord = any>( |
| 113 | + resource: string, |
| 114 | + params: GetManyParams |
| 115 | + ) => baseDataProvider.getMany<RecordType>(resource, params), |
| 116 | + getManyReference: <RecordType extends RaRecord = any>( |
| 117 | + resource: string, |
| 118 | + params: GetManyReferenceParams |
| 119 | + ) => |
| 120 | + baseDataProvider |
| 121 | + .getManyReference<RecordType>(resource, params) |
| 122 | + .catch(error => { |
| 123 | + if (error.code === 1) { |
| 124 | + // undefined collection error: hide the error and return an empty list instead |
| 125 | + return { data: [], total: 0 }; |
| 126 | + } else { |
| 127 | + throw error; |
| 128 | + } |
| 129 | + }), |
| 130 | + |
| 131 | + // update methods need to persist changes in localForage |
| 132 | + update: <RecordType extends RaRecord = any>( |
| 133 | + resource: string, |
| 134 | + params: UpdateParams<any> |
| 135 | + ) => { |
| 136 | + const index = data[resource].findIndex( |
| 137 | + (record: { id: any }) => record.id === params.id |
| 138 | + ); |
| 139 | + data[resource][index] = { |
| 140 | + ...data[resource][index], |
| 141 | + ...params.data, |
| 142 | + }; |
| 143 | + updateLocalForage(resource); |
| 144 | + return baseDataProvider.update<RecordType>(resource, params); |
| 145 | + }, |
| 146 | + updateMany: (resource: string, params: UpdateManyParams<any>) => { |
| 147 | + params.ids.forEach((id: Identifier) => { |
| 148 | + const index = data[resource].findIndex( |
| 149 | + (record: { id: Identifier }) => record.id === id |
| 150 | + ); |
| 151 | + data[resource][index] = { |
| 152 | + ...data[resource][index], |
| 153 | + ...params.data, |
| 154 | + }; |
| 155 | + }); |
| 156 | + updateLocalForage(resource); |
| 157 | + return baseDataProvider.updateMany(resource, params); |
| 158 | + }, |
| 159 | + create: <RecordType extends RaRecord = any>( |
| 160 | + resource: string, |
| 161 | + params: CreateParams<any> |
| 162 | + ) => { |
| 163 | + // we need to call the fakerest provider first to get the generated id |
| 164 | + return baseDataProvider |
| 165 | + .create<RecordType>(resource, params) |
| 166 | + .then(response => { |
| 167 | + if (!data.hasOwnProperty(resource)) { |
| 168 | + data[resource] = []; |
| 169 | + } |
| 170 | + data[resource].push(response.data); |
| 171 | + updateLocalForage(resource); |
| 172 | + return response; |
| 173 | + }); |
| 174 | + }, |
| 175 | + delete: <RecordType extends RaRecord = any>( |
| 176 | + resource: string, |
| 177 | + params: DeleteParams<RecordType> |
| 178 | + ) => { |
| 179 | + const index = data[resource].findIndex( |
| 180 | + (record: { id: any }) => record.id === params.id |
| 181 | + ); |
| 182 | + pullAt(data[resource], [index]); |
| 183 | + updateLocalForage(resource); |
| 184 | + return baseDataProvider.delete<RecordType>(resource, params); |
| 185 | + }, |
| 186 | + deleteMany: (resource: string, params: DeleteManyParams<any>) => { |
| 187 | + const indexes = params.ids.map((id: any) => |
| 188 | + data[resource].findIndex((record: any) => record.id === id) |
| 189 | + ); |
| 190 | + pullAt(data[resource], indexes); |
| 191 | + updateLocalForage(resource); |
| 192 | + return baseDataProvider.deleteMany(resource, params); |
| 193 | + }, |
| 194 | + }; |
| 195 | +}; |
| 196 | + |
| 197 | +export interface LocalForageDataProviderParams { |
| 198 | + defaultData?: any; |
| 199 | + prefixLocalForageKey?: string; |
| 200 | + loggingEnabled?: boolean; |
| 201 | +} |
0 commit comments